Pagespeed

About the Extension

HTML minification

Critical CSS Feature

The next option for improving the loading time, in general, is CSS delivery optimization. With the Shopware Page Speed extension, you can enable Critical CSS to deliver the fastest possible time to first render. This is what users can see when they first load the page. It is important to load the minimum amount of CSS. By minimizing the number of critical resources, you make the browser process the content faster and show it on the screen.

Enable Defer Js mode

With the Shopware Page Speed extension, you can enable the deferred running of all JS code on the page. It tells the browser not to wait for the script.

Image Lazy Loading Feature

With the Shopware Page Speed extension, you can enable the image lazy loading. It has an effect on reducing the number of image bytes, which results in improving page performance and keeping visitors on your site. The option loads images only when they cross into the user viewport. The extension allows you to skip the lazy loading for the first images and to specify images that won’t be lazy loaded. Our module adds lazy load only to one image that has no load behavior set. If some module's or theme's developer defined a loading strategy then our modules don't change it.

Image converting to WebP

The images increase user engagement, so it would be better to convert them into the modern WebP format. It offers excellent lossy compression for static or animated images on the web. The use of WebP media consumes less storage space and helps to get better loading time together with hardly noticeable differences in image quality. The Shopware Page Speed extension enables you to convert JPEG and PNG to WebP with PHP. It supports numerous methods. Moreover, it selects the most capable of those which are available on the system.

Optimization of images with other files formats

Adding Expires Headers (experimental)

By adding Expires Headers with the Shopware Page Speed extension, you can reduce the number of HTTP requests for the server. That will help you to prevent a huge server load increase. It happens when your online shop has 40+ files per page to transfer. The Expires Headers option reduces the time the server requires to connect with the browser.

Adding with and height attributes to tag (experimental)

You might have faced the case when you loaded a page and, while you're reading it, a banner loads and the page jumps down. This breaks the visual stability of a page load. There is a Cumulative Layout Shift (CLS) metric that measures how much a webpage unexpectedly shifts during its loading. Given that CLS affects the website's performance and user experience, it is better to avoid CLS issues. With the Shopware Page Speed extension, you can include width and height size attributes on your images. The option helps the browser set the correct amount of space while the image is loading.