Here is a test. Open your Task Manager on your system and then this image-heavy page in the Firefox web browser. Is the memory count going up like crazy on that page and staying there? Then you are running Firefox 23 or older on your system.

Now open that very same page in Firefox 24, and then in Firefox 26. You will notice that the page is not nearly making a dent in Firefox 26 thanks to memory consumption improvements that Mozilla implemented in this version of the browser. In Firefox 24, you will notice that the consumption drops after the first peak.

First improvements landed in Firefox 24, but the real deal ships with Firefox 26. On my test system, I opened the page in Firefox 26 and Firefox 23, and compared the memory consumption after the page had been loaded.

Note that I had about 20 tabs open in Firefox 26, and only one in Firefox 23.

Firefox image-heavy page optimizations

Firefox 23: 1809956 K

Firefox 26: 372592 K

So why the huge difference in memory consumption?

Firefox 23 and older versions of the browser decode every image found on the page and retain the data for as long as the page is in the foreground.

The memory fix introduced in Firefox 24 keeps only the visible images in memory. While it will still decode all images on the page, you will notice that memory consumption drops shortly thereafter due to this.

The Firefox 26 improvement takes care of the initial burst in memory usage. Instead of decoding all images on the page, it only takes care of the visible images so that only those are decoded on page load. This not only means that the memory consumption stays low and won't peak on page load, but also that the page loading times of image heavy pages are improved significantly.

Since Firefox does not have to decode all images on page load, the page itself loads a lot quicker in the browser.

According to Mozilla, these improvements do not affect the scrolling performance of Firefox. While it is too early to say if this is really the case, it is likely that most users won't notice a difference in scrolling behavior on image-heavy pages.

The feature introduced in Firefox 24 and 26 is similar to a technology called lazy loading which is used by webmasters to speed up the loading of their sites. Instead of loading all images on user connection, those visible are loaded with priority, with the remaining ones only loaded when they are needed (in this case when the user scrolls down so that they become visible on the page).

Other browsers

Wonder how other browsers are handling that page? Google Chrome's memory consumption does not increase by a lot when the page is loaded. You will see a peak in memory and some cpu utilization though during the decoding, but the process responsible for the page stays well within memory limits (jumps to about 200K)

The new Opera browser handles the page exactly as Chrome does.

Microsoft's Internet Explorer 11 has no issues loading the page, and memory consumption won't jump by much (to about 160K.

Closing Words

If you hang out on image-heavy pages, web forums for instance, a lot, you will certainly benefit from the improvements made. That's great for users who use machines with little RAM, but should also have an impact on other users of the browser.

With all other browsers handling memory consumption in a better fashion on image-heavy pages, it was time that Mozilla reacted and modified how Firefox handles those pages. The engineers responsible did a fantastic job and eliminated the issue in Firefox.

Advertisement