Xumulus Logo
Engineering

Kill the Loader — Improve Your Magento 2 Product Page Load Time

Author

Dan Kozlowski

Date Published

Update: this issue was fixed in Magento 2.3.2 — so it’s no longer a problem unless your theme overrides the gallery with older Magento code (which, honestly, many do). The original post follows.

The problem

Magento 2 product pages ship a spinner GIF as the primary image placeholder. After the page loads, JavaScript competes with other scripts to build the Fotorama gallery from the data-gallery object, swapping out the HTML and often causing motion and resizing. Only when that finishes — sometimes three to eight seconds later — does the real product image appear.

Perception is performance

Great Time to First Byte doesn’t guarantee a fast-feeling page. Compare two Magento 2 sites: one posts a 76ms TTFB but takes four seconds to show the product image, while a leaner one at ~60ms TTFB feels faster because the image is delivered immediately. Perception and performance are the same thing to a shopper.

The fix

Generate the gallery HTML and CSS server-side so the browser renders the product image on first paint, and stop adding loaders and motion to sliders and galleries. You want rock-solid load time and a stable viewport — not a page that reflows itself into place. Kill the loader.