Partager via

Website Performance Talk at MIX09

  • Article

John Hrvatin, lead program manager on the IE team, recently gave a talk at MIX09 entitled “Building High Performance Web Applications and Sites” (see the presentation key below).  John goes over a number of common performance pitfalls encountered when developing websites with CSS and JavaScript as well as some issues you might encounter at the HTTP level.  Some of the presentation’s content can be found in Steve Souders’ High Performance Web Sites book, but John goes more in depth on JavaScript issues and where IE8 has addressed specific problems.

John also gives a demo of IE8’s new JavaScript profiler which gives you absolute timings and call counts for your JavaScript functions.  This is a great first step, giving you the raw data you need in order to see where time is being spent in the browser.  To jump right in with IE8’s JavaScript profiler, check out the “How Do I: JavaScript Profiler” video.

Integrated JavaScript profiling will also ship with Visual Studio 2010, though you’ll get a richer analysis and reporting experience with tools like hot path, call tree trimming and folding, .csv and .xml exporting, VS IDE integration, and the function details and caller/callee views.  A future blog post will go more in depth on this.

Presentation Key

Time Topic
00:00 Intro, motivation
05:53 CSS performance
  • 05:53 – Minimize included styles
  • 06:57 – Simplify selectors
  • 09:14 – Don’t use expressions
  • 10:09 – Minimize page re-layouts
13:14 Optimizing JavaScript symbol resolution
  • 14:01 – Lookup chains
  • 15:53 – Local variables
  • 16:52 – Implicit lookups
  • 18:10 – Multiple DOM lookups
  • 18:51 – Function lookups
20:10 Demo - Internet Explorer 8 JavaScript Profiler
23:44 JavaScript coding inefficiencies
  • 23:44 – Parsing JSON
  • 26:36 – The switch statement
  • 28:18 – Property access methods
  • 29:23 – Minimize DOM interaction
  • 34:23 – Use querySelectorAll for groups
37:06 HTTP performance
  • 37:39 - HTTP compression
  • 38:44 - Scaled images
  • 39:45 - File linking
  • 41:18 - Many images
  • 42:49 - Repeat visits
  • 44:06 - Script blocking
  • 47:55 - Tools
49:07 Summary
50:30 Q & A