April, 2009

  • My Code Does What?!

    Website Performance Talk at MIX09

    • 0 Comments

    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
  • My Code Does What?!

    Visual Studio 2008 AJAX Profiling Extensions Power Tool

    • 0 Comments

    Originating in Microsoft Research as Ajax View, the Visual Studio 2008 AJAX Profiling Extensions Power Tool was released today (download here).  It’s a JavaScript performance profiler with a novel approach: it modifies the code sent by your server to include diagnostic code to trace and time function execution.  The client browser then sends profiling data back to your server for aggregation and analysis as the JavaScript executes.  Once you’ve collected your data, you can install the power tool extensions for VS2008 Team Developer or Team Suite to view and analyze the results using the Visual Studio Profiler’s UI.

    The benefit of the server-side instrumentation approach is that it works with any client browser, letting you see how various browsers affect your performance.  On the server, you must be running IIS7 with an integrated pipeline.  Currently, running this power tool on production servers is not recommended.

    Between this power tool, the built-in IE8 JavaScript profiler, and the integration with Visual Studio, we hope to shine much needed light on client-side browser performance.

Page 1 of 1 (2 items)
Search