Use a network analyzer to identify bottlenecks in the loading of scripts and other page assets; this helps determine where script deferral or profiling may be needed.
Use a profiler to identify slow areas in script execution, examining the time spent in each function, the number of times a function is called, and the call stack itself.
Internet Explorer Developer Tools – Internet Explorer provides a development toolkit that includes a profiler. The profiler includes function profiling and provides a detailed report that includes the number of calls, time spent, and other data points. It adds the ability to view the report as a call tree, profile native functions, and export the profile data. Although it lacks a network analyzer, the profiler can be supplemented with a generic tool such as Fiddler.
Safari Web Inspector – The Web Inspector profiles native functions and provides an expandable call tree. It also includes a Firebug-like console API with profiling functionality, and a Resource panel for network analysis.
Chrome Developer Tools – Chrome includes the Web Inspector Profiles panel, and adds the ability to take “heap” snapshots of the current memory. As with Safari, Chrome profiles native functions and implements the Firebug Console API, including console.profile and console.time.
Script Blocking – Older browsers used to limit script requests to one at a time. This was done to manage dependencies between files. As long as a file that depended on another comes later in the source, it will be guaranteed to have its dependencies ready prior to execution. Today’s modern browsers allow parallel downloading of scripts but block execution, to ensure any dependencies are ready. Although this allows the assets to download more quickly, page rendering is still blocked until all scripts have executed.
Fiddler – An HTTP debugging proxy that examines the assets coming over the wire and helps identify any loading bottlenecks. It is a general purpose network analysis tool for Windows that provides detailed reports on any browser or web request.
YSlow – The tool provides performance insights into the overall loading and execution of the initial page view. It scores the loading of external assets to the page, provides a report on page performance, and gives tips for improving loading speed. The scoring it provides is based on extensive research done by performance experts. Applying this feedback and reading more about the details behind the scoring helps ensure the fastest possible page load experience with the minimal number of resources.
dynaTrace Ajax Edition – A robust Java/.NET performance diagnostic tool tool provides an end-to-end performance analysis, from network and page rendering to run-time scripts and CPU usage. The tool’s reports display all aspects together, so you can easily find where any bottlenecks may be occurring. The results can be exported for further dissection and analysis.