New insights into web application performance

Posted by Kelly Norton - Wednesday, November 04, 2009 at 10:23:00 AM

I've sometimes thought that optimizing web applications is as much a science as dowsing. (No offense intended, dowsers of the world — but you have to admit it's a hard thing to explain even when it does work out.) Even when you are completely willing to invest time and energy into optimizing an application, how do you actually go about it?

Our team, along with everyone else in the world who cares about web application performance, has had to essentially guess at where time goes inside the browser. We've spent countless hours debating each others' wild-eyed speculations as to the true sources of latency afflicting a wide variety of applications. Indeed, web apps can be slow for all sorts of opaque and unintuitive reasons. Don't be fooled into thinking that bloated, slow JavaScript is the only culprit. We've seen pathological situations in which a few seemingly insignificant CSS tweaks can improve performance by a factor of 5 or more. Another dark gem: rearranging a mere few lines of JavaScript that were inadvertently calling DOM-related methods in an unfortunate sequence (which caused multiple redundant layouts) turned a life-negating 5 second operation into a sprightly 50 millisecond blink of an eye. That one took 5 days to find the offending 4 lines of JavaScript and then about 3 seconds to actually make the code change. #nowiamwaybehindingooglereader

We couldn't take it anymore. We decided we had to find a way to transform the witchcraft of optimizing web apps into a legitimate engineering task, once and for all.

My team began working on a series of changes to WebKit and Chrome to collect precise metrics on where time is, in fact, going within the browser. When, exactly, does layout occur? How long does each layout take? Can layout happen synchronously while my JavaScript is executing, or is it deferred? How much time is spent on CSS selector matching? How long does parsing (versus executing) JavaScript take? Does the process of actually painting pixels on the screen take much time? We instrumented the browser way deep down inside to produce a stream of such metrics, being very careful to keep observer effects to a minimum.

Happily, we've managed to land these changes into both WebKit and Chrome over the last several weeks. Soon you'll see the first examples of tools that make these metrics available to web developers using WebKit-based browsers. Of course, we have a lot more instrumentation planned, but the ball is really rolling now thanks to lots of help from the friendly folks on the WebKit and Chrome teams (especially Pavel Feldman and Timothy Hatcher). We've gained many new insights, some of which I mentioned in my Measure in Milliseconds talk at Google I/O earlier this year. When you see these metrics yourself for your own web apps, you'll likely be surprised — and you'll almost certainly wonder how anyone tried to write high-performance code without this sort of insight. Be sure to keep an eye on the Chrome Dev Channel and the WebKit nightly builds for new Inspector features based on our work.

11 comments:

Extreme News said...

This is my first opportunity to visit this website. I found some interesting things and I will apply to the development of my blog. thanks for sharing useful information, Rumah Mungil yang Sehat, Bisnis Syariah

Extreme News said...

I am happy to visit here. I hope you continue to do the sharing through the post to the reader. and good luck for the members site Mobil Keluarga Ideal Terbaik Indonesia, Mobil Keluarga Ideal Terbaik Indonesia, Inilah Alasan Kenapa Anda Harus Bergabung Dengan Oriflame, Pasang Iklan Gratis Sebagai Awal Mulai Bisnis Online

alib16 said...

a great honor to visit your website. This article was very useful for me. thanks,Indonesia Siap Bersaing di SERP Diskon Gila Disdus.com

Andz said...

nice info :D

ocon said...
This comment has been removed by the author.
nopnop said...

Nice info,,, I like it,, thanks...

ihsan mufthi said...

Of course, we have a lot more instrumentation planned, but the ball is really rolling now thanks to lots of help from the friendly folks on the WebKit and Chrome teams (especially Pavel Feldman and Timothy Hatcher).

tips and tricks | tips and tricks
cara beriklan di internet
stop korupsi dan suap

Sari Rahmadhani said...
This comment has been removed by the author.
Medoho said...

i think its very nice info
http://www.hpsblog.com/2006/08/personal-real-time-gps-tracking-device.html

chordsmantap said...

your stuff is very good i like it, thx for share this good stuff for me

chordsmantap said...

your stuff is very good i like it, thx for share this good stuff for me