Haavard

JavaScript performance? What about layout performance?

Wednesday, 24. June 2009, 15:46:50

css, opera, benchmarks, performance, carakan, browsers

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.

Official Opera Unite blogWhat is a browser? Russian edition

Comments

Dennis_Hawks # 24. June 2009, 16:29

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?

dbloom # 24. June 2009, 16:47

Those slides (http://www.slideshare.net/lsimon/go-with-the-reflow) are actually from Googler Lindsey Simon's talk about reflows at Velocity (but he does borrow some of the slides from Souders)

[edit] The original slides from Souders are at http://dl.google.com/io/2009/pres/W_1115_EvenFasterWebSites.pdf ... Lindsey reused slide #44 in his talk.

haavard # 24. June 2009, 16:53

Is Lindsey Simon's talk from Google I/O as well?

dbloom # 24. June 2009, 16:54

Originally posted by haavard:

Is Lindsey Simon's talk from Google I/O as well?

Nope, it's at Velocity which is still underway

http://en.oreilly.com/velocity2009

kailapis # 24. June 2009, 16:57

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.

dbloom # 24. June 2009, 17:01

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.

artyname # 24. June 2009, 17:27

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.

haavard # 24. June 2009, 18:00

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.

Indyan # 24. June 2009, 19:30

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

Chas4 # 24. June 2009, 23:36

Originally posted by Indyan:

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

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

BleedingHeart # 25. June 2009, 06:38

For general browsing "speed" I end up with the, (from fastest to slowest)

Chrome
Opera / Firefox (Too close to call)
Safari
IE

This despite Safari always coming out on top in JS benchmarks.
Any and all performance improvements in any area are always welcome though.

Anonymous # 25. June 2009, 08:09

wuut writes:

What?? Firefox is the slowest of the lot (except IE)!

malsumis # 25. June 2009, 16:00

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.