Thursday, May 29, 2008

Client-Side Performance

Here's a screen shot of IBM Page Detailer, Steve Souders's preferred packet viewer to use. 80% of web response time is spent on the client, and it also shows where network object downloads get blocked by script execution.

Browsers block parallel downloading of script and CSS when a script is being run so be careful with online script placement as a web page will block downloads. Basically be aware that whenever script is reached it will block any further parallel downloading of network objects.

@import statements have the same effect on CSS as inline script with script tags, so use link tags instead.

Defer script that is not needed for the loading of a page with XHR injection. XHR is required as Firefox does not support the DEFER attribute. Use XHR to load the script and then place it in a created script element. This is the best way as it allows for parallel downloading and does not display the busy indicator in the browser which is distracting to a user.

No comments: