Monday, 11 July 2011

Google PageSpeed & SpeedTracer

Page Speed

Page Speed is an open-source project started at Google to help developers optimise their web pages by applying web performance best practices and is integrated into the Developer Tools within Google Chrome.

As an example, here is one of my Azure hosted websites running SQL Azure backend viewed in Chrome with Page Speed turned on:

ScreenShot082

Speed Tracer

Speed Tracer is a tool to help you identify and fix performance problems in your web applications. It visualizes metrics that are taken from low level instrumentation points inside of the browser and analyzes them as your application runs. Speed Tracer is available as a Chrome extension and works on all platforms where extensions are currently supported (Windows and Linux).

Using Speed Tracer you are able to get a better picture of where time is being spent in your application. This includes problems caused by JavaScript parsing and execution, layout, CSS style recalculation and selector matching, DOM event handling, network resource loading, timer fires, XMLHttpRequest callbacks, painting, and more.

Here’s an example of Speed Tracer:

ScreenShot084

Conclusions

Everyone likes quick wins, by using these tools against your business apps bottlenecks are made visible within your team.  This is a very powerful and necessary part of development, be sure to include performance tests as part of your normal development and release cycle to measure code impact over time.

No comments:

Post a Comment