JavaScript performance? What about layout performance?

Performance benchmarks are all the rage these days, but everyone seems to be focusing narrowly on artificial benchmarks that basically tell you how certain browsers perform at the particular JavaScript functions chosen for those particular benchmarks.

It's surprising that there is little or no focus on other, perhaps more relevant performance aspects of modern pages. For example, how do browsers perform when it comes to dynamically changing the style of a page (CSS)? …

At Velocity 2009, Google's Lindsey Simon talked about exactly that, and the slides from his presentation show a few interesting graphs.


It turns out that Opera's layout engine is very fast at dynamically changing the page content, and this is used everywhere on the Web today. Perhaps the next move is to make browser benchmarks more relevant by running more than just JavaScript tests?

Another related issue that I saw mentioned the other day was a rather flawed and narrow memory usage test which doesn't take into account how different browsers deal with memory in different ways. For example, it ignored Chrome's shared memory, and did not seem to be taking Opera's advanced memory cache into account.

Opera also cleans up the image cache after 10 minutes or so, but that does not seem to be reflected in the test. We could have done the cleanup all the time, but then we would have to sacrifice performance like Firefox apparently does.

On a related note, and in order to tie JavaScript benchmarking and memory usage testing together, Carakan will likely take the speed crown for artificial JavaScript benchmarks, but perhaps at the cost of using more memory.

It is basically a tradeoff.

Advertisements

16 thoughts on “JavaScript performance? What about layout performance?

  1. 10nx for the article!

    Opera also cleans up the image cache after 10 minutes or so

    Is it possible to customize this behavior? For example, for a longer or shorter period?

  2. Recent computers have 2GB+ memory, and likely 3GB or more. I say memory usage isn't nearly as important as it was before, as long as it's used wisely (like Opera does). I'll be eagerly awaiting for Carakan's arrival.

  3. Originally posted by kailapis:

    Recent computers have 2GB+ memory, and likely 3GB or more. I say memory usage isn't nearly as important as it was before, as long as it's used wisely (like Opera does). I'll be eagerly awaiting for Carakan's arrival.

    As long as memory is finite, efficient usage is important. Otherwise, you can end up with memory fragmentation or, if your working set can get big enough, really slow garbage-collects.

  4. Originally posted by kailapis:

    Recent computers have 2GB+ memory, and likely 3GB or more. I say memory usage isn't nearly as important as it was before, as long as it's used wisely (like Opera does). I'll be eagerly awaiting for Carakan's arrival.

    Opera has same core on all platforms, including mobile, and there's not too much memory available on these.

  5. Thanks for the info, David. I updated the blog post.artyname: Futhark could still be used if Carakan's memory requirements turn out to be too high for platforms on the lower end of the spectrum. I would assume that Carakan would be able to run comfortably on high-end smartphones, though.

  6. Kind of vindicates what Opera users have known for a long time -Opera is the fastest in rendering html/css

  7. Originally posted by Indyan:

    Kind of vindicates what Opera users have known for a long time -Opera is the fastest in rendering html/css

    :yes: One other thing is that javascript speed only works if you have a fast internet connection, on slow connections you will not see the improvements as much

  8. For general browsing "speed" I end up with the, (from fastest to slowest)ChromeOpera / Firefox (Too close to call)SafariIEThis despite Safari always coming out on top in JS benchmarks.Any and all performance improvements in any area are always welcome though.

  9. I kinda noticed the importance of the layout engine today, when I tried to write some tooltip javascript code using jquery. At first, I made it using the most straightforward way that occured to me – when the cursor is over an image, throw some code before an element, and then style it accordingly. Opera worked flawless. Then I forgot about it for some time, and finally tested stuff in Firefox. Tooltips were unusable, because Firefox couldn't keep up with even relatively slow movement of the mouse, firefox just couldn't redraw at a proper rate. I fixed it so my script inserts code only when needed, but still, Opera was the one impervious to my stupid coding.

  10. Good point, but no good numbers, and even crappier charts.p.s.: while IE8 is the slowest of all modern browsers, no question, it would been very interesting to know why and where Safari and FF lag. Because both of them show very good results in synthetic tests, and regularly fail to compete on real life websites.

  11. Originally posted by c69:

    regularly fail to compete on real life websites

    I would think part of this is how they work on the different codes on different sites, a site with a lot of flash content will slow down 100% of all browsers, plus the bandwidth a user has will also affect the speed

Comments are closed.