Google Is Optimizing Rendering Performance In Chrome

AH Google Chrome Logo 1.3

The Google Chrome browser is designed to offer a smooth, fluid fast browser experience and today Google’s Chrome developer team announced a number of optimizations that have been introduced. These optimizations are centered around making Chrome faster through working smarter. By faster, Google’s intention is to make the browser smoother, faster and more responsive while simultaneously reducing power consumption through improving the browser’s rendering pipeline. The theory here is that rather than working on improving the Chrome browser’s raw speed, the developers have made the browser more intelligently render pages. Chrome is now better able to avoid running unnecessary tasks and more effectively uses device hardware. Furthermore, the team have improved how well Chrome recognizes the optimal rendering algorithm To use. The effect is that these improvements will “[cause] websites to load faster, run smoother, and use less power.”

Google’s blog on the subject explains that the Chrome browser has a time budget of 16ms to render each frame in order to display content at a smooth 60fps. The browser needs to executive JavaScript code, process the style and layout or the browser and shunt the pixels to the display. If the browser is able to render a frame under 16ms this improves the user experience. The development team have been working on optimizing the Chrome browser on a by-frame basis. One example is how Chrome paints pixels to the screen. After optimization, the Chrome browser now tracks changes the screen and no longer renders parts of the display that haven’t changed, but instead copies the same data from the cache. According to internal testing, this particular change reduces the time it takes for the browser to render a frame by 35%. Another related improvement is how Chrome reduces the area of the screen that it redraws based on what has changed on the display: depending on what has changed, the browser can copy the previous frame and modify the changes, rather than render the full frame. This has a performance improvement of up to 40%. The animated GIF at the bottom of this article shows that the modernized Chrome browser now only renders the area around the blinking pixel and so saves time and effort. Because the Chrome browser is loading the hardware less, this has a knock-on effect of reducing power consumption.

The final area where the Chrome developers have improved the browser is in how the application uses device hardware. Today, the Chrome browser is keener to use the GPU for the more challenging rendering tasks when running on the Mac, Windows and Android platforms; GPUs are more efficient at such high performance workloads and now Chrome will make better use of it. According to the Chrome browser development team, using the GPU, “…improves animation performance, input latency, and scroll smoothness for modern SVG and HTML5 pages.” Interestingly enough, Google concludes its blog on the subject by explaining that there are more performance optimizations to follow in order to “make the web faster and more responsive for all Chrome users.”