The page speed optimization is one of the most important factors to make your website accessible and performant.
Follow the quick guides below to improve the site performance directly from Contao backend.
Enable page cache
One of the most significant speed improvements you can make for the website is to enable the page cache. If your site is not updated frequently, setting a long cache timeout is usually a good idea. Furthermore, if you don't have any member modules on the page, it might be worth always loading the page from the shared cache.
You can read more about caching in the Contao documentation.
Page layout settings
Once you activate the Veello Theme features in the page layout settings, some new optimization options will appear. The HTTP/2 support will ensure the assets are not bundled, the deferred loading of JS files will help the browser parse the DOM faster, lazy-loaded images will improve the page load, and local fonts will load faster than fetched from external services like Google Fonts.
Do not miss to minify the HTML output markup:
Responsive, lazy-loaded images in WEBP format
Contao provides some excellent image features out of the box. You should definitely consider making the images responsive so they are not loaded in full size on mobile devices. Images should also be delivered in modern formats, such as WEBP. Contao provides autoconversion to that format, but it needs to be explicitly enabled.
To improve images even further, make sure they are lazy-loaded. It's a feature that is available natively in all modern browsers. There is one catch here, though! The images seen first on the initial page load should not be loaded lazily, as this would decrease the Largest Contentful Paint (LCP) metric!
Hey, and what about content images in different sizes? Do I have to create an image size record for every single image on the website?
Well, that would be the best 🙂 but it is sometimes just non-realistic. What you can do, however, is set the default image size densities in the page layout settings. It is maybe also worth setting the lightbox image size instead of displaying a raw image that can weigh dozens of megabytes.
Remove inactive extensions
The default Contao edition installed in most cases comes with several extra bundles out of the box (e.g., calendar or newsletter). They are redundant for some websites but still consume resources while rendering the page. Hence, uninstalling unnecessary extensions (e.g., Contao Manager) is recommended.
Although Veello Theme comes packed with various page speed optimizations there is always some room for improvement also on other levels than Contao.
A modern website requires improvements on a variety of levels. One of them is certainly a
.htaccess file which can be updated by the below rules (highly inspired by Contao 3) to provide even more performance:
One of the most important things when publishing media files on your website is their quality and size in kilobytes. To avoid uploading raw and exaggerated images, you can use some tools below to compress them while maintaining a decent quality:
For Apache or Nginx servers, there is a superb PageSpeed Module that can greatly increase the performance of your website. For more information, please visit: https://developers.google.com/speed/pagespeed/module/