Ajax Performance Analysis

IBM Developerworks' latest was submitted to us by an anonymous reader who writes "Using Firebug and YSlow, you can thoroughly analyze your Web applications to make educated changes to improve performance. This article reviews the latest tools and techniques for managing the performance of Ajax applications along the life cycle of your application, from inception through production."

Comments

Client-side execution

[truthsearch]

I recently did a performance analysis of a complex site I've worked on for over a year. My primary tool was Firebug. While the size of the HTML + CSS + JS per page is pretty large, it turns out compressing them and setting header cache only saw a small performance improvement. The execution of JS like Scriptaculous actually accounts for more than 50% of the time it takes to render the pages. Since we only use Scriptaculous for drag-and-drop we're considering alternatives, like mootools or custom code. Loading as much JS as possible from the bottom of the page instead of the head can help, but isn't always an option. Focusing on CSS and JS performance has now made a huge improvement in perceived site performance.

During the initial development we never considered that simply loading one JS library (even when it's not used for inserting HTML) could slow down page rendering that much. On JS or CSS heavy sites, client-side loading, rendering, and runtime execution can easily account for 50% to 90% of the time it takes to see a final page. So while I've usually focused entirely on server side performance, I now know to pay more attention to the speed of client side rendering. Lesson learned.

NoScript

[slashgrim]

All websites should have an option to run without fancy Javascript (and still be fully functional!). It makes no sense that a web site should bog down my 400Mhz PDA.