For more details see the Google Page Speed Optimizer extension page.
Check your store with a Google PageSpeed Insights tool and remember the score. Ready? Now it’s time to improve the store performance and get higher score.
The extension settings page can be found in Stores→ Configuration→ Google Page Speed Optimizer
Set the option to ‘Yes’ to enable HTML minification. Minification removes all the unnecessary comments, line breaks, tabs and spaces from your HTML to reduce its size.
There are 4 options to optimize your JS code.
1. Merge all JS files into one to reduce the number of queries.
2. Enable JS bundling to combine all JS files into few bundles and download them for each page. This helps to save time by reducing the number of server requests. Notice that as browsers download the bundles synchronously, page rendering is blocked until all bundles finish downloading.
3. Minifying JS files works the same way as HTML minification.
4. Moving JS to page bottom (footer) helps to load all the important content before loading JS what improves pages loading time.
1. Merging CSS Files works the same way as merging JS files.
2. Minifying CSS Files works the same way as minifying JS and HTML.
3. If you set Defer Fonts Loading to 'Yes', browser will load the page with system fonts and replace them with your fonts when they are loaded. It makes store pages load faster.
Use flat tables storing all the information about a product or a category. Such tables help to shorten the query in the database. The shorter the query, the better the store performance. Pays off for large stores with massive databases.
You can enable Asynchronous indexing to distinguish traffic patterns on the database level to avoid conflicts between read and write operations. Order data is placed in a temporary storage and moved to the Order Management grid with no accidents.
Set the Use Lazy Loading Images to ‘Yes’ to make off-screen images load only when a customer scrolls to them. It prevents pages full of images from lagging.
You can choose between 2 lazy load scripts: jQuerry Lazy Script or Native JS Lazy Script. We recommend trying both of them to choose one that fits your system best.
You can decide whether to Preload Images or load them from scratch when they happen on screen. Decide how many images to load without lazy loading by setting Skip Images Count.
Enable Optimize images option to compress images without quality loss and reduce web pages loading time. To automatically optimize all the new images uploaded to the catalog or Wysiwyg folder set the Automatically Optimize Product Images option to ‘Yes’.
The extension allows you to optimize JPEG, PNG and GIF images.
Set the Dump Original Images option to ‘Yes’ to store original images in the ‘pub/media/amasty/amoptimizer_dump’ folder. That’s an easy way to collect all the original files in one place.
When you’re ready with the optimization don’t forget to check your store with the Google PageSpeed Insights tool once again and compare the scores before and after optimization.
Find out how to install the Google Page Speed Optimizer via Composer