Notes from PDC10: Inside IE9 Performance

 

Presenter: Jason Weber

Video

  • Lots of research, boiled down to 3 themes from developers
  • Interoperable HTML5 (same markup)
  • Performance, Performance, Performance
  • Websites more like native applications
  • Browser CPU Usage Loading ESPN
  • Time to Glass
  • Elapsed Page Load Time
  • CPU Time
  • Idle CPU Time
  • Browser Subsystems
  • Networking
  • HTML
  • CSS
  • Collectors
  • JavaScript
  • Marshalling
  • DOM
  • Formatting
  • Block Building
  • Layout
  • Rendering
  • Back to ESPN
  • CPU Activity
  • Subsystem Activity Breakout Chart (33:30)
  • Network Gantt Chart
  • These charts come from Windows Performance Tools
  • Closer Look at Sports Sites (5)
  • Looking at top 5 sites
  • Total download size
  • Number of elements in DOM
  • Number of CSS Rules
  • Number of Image Files Downloaded
  • Number of Script Blocks
  • Number of Script Lines
  • Number of Script Frameworks
  • Which is the fastest?
  • The results are not what you think…
  • Rendering certainly longer for slowest sites
  • Javascript performance impacted sites differently
  • Marshalling hurt some sites
  • Did the same analysis on the top 25 worldwite sites
  • Average Time Distribution Across AJAX sites
  • Rendering and Javascript were the two most time consuming activities
  • Understnading Today’s Websites
  • Created a crawler to analyze API usage over top 7200 Sites
  • Only a few API’s used consistently across the sites. This is used to prioritize
  • Top API call: indexOf
  • IE9: Building a Fast Modern Web Browser (42:14)
  • IE9 is fundamentally different
  • Completely re-written the most used subsystems
  • JavaScript Engines
  • Ours is Chakra
  • Interpreter
  • Immediately Execute Code
  • Slow Execution Speed
  • Easy to build
  • Ideal for simple code that executes once
  • Compiler
  • Wait for Compilation
  • Fast Execution Speed
  • Difficult to build well
  • Ideal for complex code that executes multiple times
  • IE is first browser to have both
  • Multi-core Processing (46:18)
  • Windows Experience Index Results
  • Average # of cores: 2.46
  • IE8 Processor Utilization
  • shows most working going on Core #1, and other cores not doing much
  • Brand New JavaScript Background Compiler
  • Doing compiling and interpreting with multiple cores
  • IE9 Processor Utilization
  • showing same page, shows 2nd core doing a lot more work, and page comes up faster
  • IE9 JavaScript Integration (50:00)
  • A look back at IE8 JavaScript Engine Integration
  • In IE9, JavaScript engine into the browser itself. Shared DOM and shared state between the two systems
  • JavaScript now a first class browser language
  • IE9 Rendering Engine (52:15)
  • GPU’s not just for games. Every Windows computer has a GPU.
  • GPU, highly specialized processors designed for graphics
  • Exponential growth in GPU processing
  • Browsers have not been taking advantage, but IE9 now does
  • Putting it All Together (55:00)
  • How the architecture changes impact performance
  • Shows IE8 and Flying Images (HTML4 sample on Test Drive site). Only able to create 5 FPS.
  • Shows Safari shows similar experience
  • Shows IE9, which gets 60 FPS. Increases image count. Very quick stuff.
  • IE8 Performance Chart
  • IE9 Performance chart, much smaller than IE8
  • “fully hardware accelerated graphics”
  • Shows “Speed Reading” demo on IE9 (14 seconds). Then Chrome and Safari, which don’t fare well
  • SVG Helicopter app
  • Demo: Browser Hunt, IE9 vs. Chrome 9. The latter is about 50% slower.
  • Fish Tank. IE9 vs. Firefox. Not even close. IE9 is the winner.
  • Track Splash (1:20:20)
  • H.264 video, canvas element for boat, ocean is a HD video
  • Chrome could not run this demo
  • Q&A (1:12:30)
  • Will IE9 support all of CSS3 elements?
  • we think mostly complete, but keeping an eye on the standards
  • Will IE9 support WebGL?
  • we’re continuing to keep an eye on that