How Google Chrome reduces the processor load of webapps

With the web’s popularity, it is common for web browsers to have many open tabs at the same time. Processor load can significantly increase in such a case. Google Chrome has implemented several measures to help with that:
  • Experimental webkitRequestAnimationFrame API: which tracks a similar API on Firefox. Until now, if you wanted to animate 2D or 3D content, you had to use timers that called you back in regular intervals so that you could update the animated content. The new API works as follows: Instead of telling the browser to call you back each 1/25 second, you tell it to call you back when it is ready to let you draw the next animation frame. You can optionally specify where you are drawing. All this has has two advantages:
    • You are not called back if the animated content is not currently visible (be it because it has scrolled out of view or because the tab is currently not visible).
    • You are only called back as often as the platform can handle. Quoting Google: “Excessive CPU consumption by timers on web pages is not a theoretical problem. We have measured web sites containing mostly static text content firing timers at a rate of over two hundred per second.”
  • Constraining timers in background tabs: If a tab isn’t visible then its timers are run at most once per second. This should still be enough for applications that need to be notified at a given time, but it will prevent invisible animations from slowing down the browser.
In addition to these measures, there is also Chrome’s Task Manager. It shows CPU usage for each tab which allows one to track down which one is a CPU hog.