Velocity 2011: The Performance Impact of Modernizing Internet Explorer

[Guest BSchwarz]

Velocity 2011: The Performance Impact of Modernizing Internet Explorer

 

Browsers need amazing performance to deliver on the promise of HTML5 applications. Modernizing Internet Explorer 9 has changed what&rsquos possible with Web sites, and dramatically improved the performance of the HTML4 sites consumers use today. To demonstrate the real world performance gains in IE9 at the recent Velocity 2011 conference, we presented our talk on Modernizing Internet Explorer as an interactive HTML4 Web application:

 

View the entire Velocity 2011 presentation, Modernizing Internet Explorer

 

This real world scenario is a great way to experience what&rsquos possible today with the gazillions of Web sites that have been developed using HTML4 standards-based markup over the last two decades, through full hardware acceleration of the browser, and without needing to rewrite Web sites using HTML5.

 

This site works consistently across browsers, using the same HTML, CSS and JavaScript coding patterns found in today&rsquos Web sites. At the same time, it shows the performance benefits of the systematic approach we took in modernizing Internet Explorer.

 

When you interact with the presentation in Internet Explorer 9, you&rsquoll find a real-time experience that feels more like a native Windows application than a Web application. Slide transitions are smooth and fluid. You can rapidly scroll between sections of the presentation (holding down the arrow keys). And your responsiveness rarely falls below 100%.

 

The Velocity conference, sponsored by O&rsquoReilly Media and chaired by Steve Souders and Jesse Robbins, brought together more than 2,000 developers from across the industry to learn best practices from community experts, and to collaborate on how we make the Web faster together as an industry.

 

This was the first Velocity conference since Internet Explorer 9&rsquos release in March, and our first opportunity to share our performance results from modernizing Internet Explorer with the Velocity community. At last year&rsquos Velocity we had just released the Third IE9 Platform Preview. That&rsquos seven releases ago and it&rsquos amazing how much performance can improve in one year!

 

Performance Analysis

 

Using the Windows Performance Toolkit we can measure the runtime performance of Web applications, see how they utilize the underlying hardware, and compare the resulting performance between browsers. The below CPU diagrams show the time required for our Velocity 2011 presentation to animate and draw one frame of the presentation in both IE8 and IE9. These results were generated on a three year old Dell Precision WorkStation (3.0 GHz Intel Pentium Dual-Core, 4GB physical memory, NVIDIA GeForce 8600 GT, 100GB 7200 RPM drive, Windows 7). The experience will vary slightly based on PC configuration, but the overall patterns are representative of the Internet Explorer 9 customer experience.

 

 

As you can see, it takes 1.251 seconds for IE8 to animate one frame of the presentation. The process starts (in blue) when IE8 wakes up based on the JavaScript timer and processes outstanding events. The IE8 JavaScript interpreter (in yellow) then calculates the next location for each slide and updates the DOM with those locations. Next, the IE8 layout engine (in green) moves the slides on the screen before they are finally drawn to the screen (in pink) through IE8&rsquos CPU based graphics system.

 

With IE9, the results are a staggering nine milliseconds (that&rsquos 0.009 seconds or 139x faster than IE8). You will see the same runtime pattern occur on the CPU however at near native speeds. Because there&rsquos less memory pressure on the system and fewer events to process, IE9 quickly processes outstanding events (in blue). The new Chakra JavaScript engine, which is natively integrated into IE9, will then execute native machine code to calculate the new location for the slides and update the DOM (in yellow). The new IE9 layout engine will iteratively move the slides around (in green). Finally, the GPU draws the contents to the screen (in pink).

 

Thank you to the Velocity Web performance community for another enjoyable conference. We&rsquore excited about the work you&rsquore doing to improve Web performance. The community continues to grow and together we&rsquore changing what&rsquos possible on the Web.

 

&mdashJason Weber, Internet Explorer Performance Lead

 

 

 

Source

Edited April 28, 2014 by AWS