# Magento 2 Google Page Speed Optimizer

### <span style="color: #3b82f6;">Installation and User Guide for Magento 2 Google Page Speed Optimizer</span>

**Table of Contents**

1. [*Installation*](#bkmrk-installation)
    - *Installation via app/code*
    - *Installation via Composer*
2. [*Configuration Settings for Optimiser Base* ](#bkmrk-configuration-settin)
    - *General Settings*
3. [*Configuration Settings for Speed Optimiser* ](#bkmrk-configuration-settin-1)
    - *General Settings*
    - *Minify HTML*
    - *Javascript Settings*
    - *CSS Settings*
4. [*Configuration Settings for Lazy Loading* ](#bkmrk-configuration-settin-1)
    - *General Settings*
    - *Lazy Loading on the Homepage*
    - *Home Page Excluded from Lazy Loading*
    - *Lazy Loading on the Category Page*
    - *Lazy Loading on the Search Page*
    - *Lazy Loading on the Cart Page*
5. [*Configuration Settings for Image Optimizer* ](#bkmrk-configuration-settin-3)
    - *General Settings*
    - *Compress/Optimize Product Image*
    - *Compress/Optimize Category Image.*
    - *Compress/Optimize CMS Image*
6. [*Configuration Settings for Cache Warmer* ](#bkmrk-configuration-settin-4)
    - *General Settings*
    - *Cron Settings*
7. [*Cache Warmer Grid* ](#bkmrk-cache-warmer-grid)
    - *Regenerate*
8. [*Console Commands* ](#bkmrk-console-commands)
    - *Category Page*
    - *Product Page*
    - *CMS Page*
9. [*Front-end Screenshots* ](#bkmrk-front-end-screenshot)
    - *Cache Hit for the category page after the execution of category page c ommand*
    - *Cache Miss for the Category Page*
10. [*Google Page Speed Tests* ](#bkmrk-google-page-speed-te)
    - *Home Page Mobile*
    - *Home Page Desktop*
    - *Category Page Mobile*
    - *Category Page Desktop*
    - *Product Page Mobile*
    - *Product Page Desktop*

### <span style="color: #3b82f6;">Installation</span> [](#bkmrk-)

- <span style="color: #f97316;">**Installation via app/code:**</span> Upload the content of the module to your root folder. This will not overwrite the existing Magento folder or files, only the new contents will be added. After the successful upload of the package, run below commands on Magento 2 root directory.
    
    ```php
    php bin/magento setup:upgrade
    php bin/magento setup:di:compile
    php bin/magento setup:static-content:deploy
    ```
- <span style="color: #f97316;">**Installation via Composer:**</span> Please follow the guide provided in the below link to complete the installation via composer.

<p class="callout success">[https://docs.scommerce-mage.com/magento-2-extensions/installation-via-composer/installation-via-composer](https://docs.scommerce-mage.com/magento-2-extensions/installation-via-composer/installation-via-composer)</p>

### <span style="color: #3b82f6;">Configuration Settings for Optimiser Base</span> [](#bkmrk--1)

Go to *Admin &gt; Stores &gt; Configuration &gt; Scommerce Configuration &gt; Optimiser Base*

#### <span style="color: #f97316;">General Settings</span> [](#bkmrk--2)

- **Enabled –** Select "Yes" or "No" to enable or disable the module.
- **License Key –** Please add the license for the extension which is provided in the order confirmation email. Please note license keys are site URL specific. If you require license keys for dev/staging sites then please email us at <support@scommerce-mage.com>.

[![image - 2025-06-04T192408.855.png](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-2025-06-04t192408-855.png)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-2025-06-04t192408-855.png)

### <span style="color: #3b82f6;">Configuration Settings for Speed Optimiser</span> [](#bkmrk--3)

Go to *Admin &gt; Stores &gt; Configuration &gt; Scommerce Configuration &gt; Speed Optimiser*

#### <span style="color: #f97316;">General Settings</span> [](#bkmrk--4)

- **Enabled -** Select "Yes" or "No" to enable or disable the module.

[![image - 2025-06-04T192514.900.png](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-2025-06-04t192514-900.png)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-2025-06-04t192514-900.png)

#### <span style="color: #f97316;">Minify HTML</span> [](#bkmrk--5)

- **Enabled -** Select "Yes" or "No" to enable or disable the module. If set to "Yes" then the module will remove all the unnecessary comments, line breaks, tabs and spaces from your HTML to reduce its size.
- **Defer Iframes –** Select "Yes" or "No". If set to "Yes" then attribute defer will be added to the iframe.

[![image - 2025-06-04T192622.109.png](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-2025-06-04t192622-109.png)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-2025-06-04t192622-109.png)

#### <span style="color: #f97316;">Javascript Settings</span> [](#bkmrk--6)

Select "Yes" to enable the Defer Iframes

- **Merge Javascript Files –** Select "Yes" or "No". If set to "Yes" then it will merge all JS files into one to reduce the number of queries.
- **Enable Javascript Bundling –** Select "Yes" or "No". If set to "Yes" then it will combine all JS files into few bundles and download them for each page. This will save time by reducing the number of server requests.
- **Javascript Files Minification –** Please select "Yes" or "No". If set to "Yes" then the module will remove all the unnecessary comments, line breaks, tabs and spaces from your Java Script to reduce its size.

[![image - 2025-06-04T192719.180.png](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-2025-06-04t192719-180.png)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-2025-06-04t192719-180.png)

#### <span style="color: #f97316;">CSS Settings</span> [](#bkmrk--7)

- **Merge CSS Files –** Select "Yes/No". If set to "Yes" then it will merge all CSS files into one to reduce the number of queries.
- **Defer Fonts Loading –** Select "Yes/No". If set to "Yes" then browser will load the page with system fonts and replace them with your fonts when they are loaded. It makes store pages load faster.
- **Fonts Display Swap –** Select "Yes/No". If set to "Yes" then font-display will be replaced with swap. Helps avoid Luma-Icons issue.
- **CSS Files Minification –** Select "Yes" or "No". If set to "Yes" then the module will remove all the unnecessary comments, line breaks, tabs and spaces from your CSS to reduce its size.

[![-988888.png](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/988888.png)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/988888.png)

### <span style="color: #3b82f6;">Configuration Settings for Lazy Loading</span> [](#bkmrk--8)

Go to *Admin &gt; Stores &gt; Configuration &gt; Scommerce Configuration &gt; Lazy Loading*

#### <span style="color: #f97316;">General Settings</span> [](#bkmrk--9)

- **Enabled -** Select "Yes" or "No" to enable or disable the module.
- **Preload Images –** Select "Yes" to preload the images.
- **Loading Icon –** Show a preview image before the real image loads.
- **Skip Images Count by page category –** Enter a valid image count to skip the images from lazy load. Based on the count this option will decide how many images to load without lazy loading.
- **Ignore Images that Contain –** Provide a part of an image tag content into the field to exclude the image from the lazy load.
- **Exclude Pages –** Select the page(s) from multi-select options to exclude from the lazy load.

[![image - 2025-06-04T193048.312.png](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-2025-06-04t193048-312.png)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-2025-06-04t193048-312.png)

- <span style="color: #f97316;">**Lazy Loading on the Homepage –**</span> Enable the module to implement lazy loading on the homepage, here is the configuration path *Admin &gt; Stores &gt; Configuration &gt; Lazy Loading- Enable "Yes".*

*[![image (90).jpg](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-90.jpg)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-90.jpg)*

- <span style="color: #f97316;">**Home Page Excluded from Lazy Loading –**</span> There is an option " Exclude Pages" available in the backend, from where you can select the page to exclude from the lazy loading.

[![image (91).jpg](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-91.jpg)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-91.jpg)

- <span style="color: #f97316;">**Lazy Loading on the Category Page –**</span> Enable the module to implement the lazy loading on the category page *Admin &gt; Stores &gt; Configuration &gt; Lazy Loading - Enable "Yes".*

*[![image (93).jpg](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-93.jpg)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-93.jpg)*

- <span style="color: #f97316;">**Lazy Loading on the Search Page –**</span> There is an option available in the configuration settings at *Admin &gt; Stores &gt; Configuration &gt; Lazy Loading- Enable* and by selecting "Yes" or "No" you can enable or disable the lazy loading on the search page.

[![image (94).jpg](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-94.jpg)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-94.jpg)

- <span style="color: #f97316;">**Lazy Loading on the Cart Page –**</span> You can implement lazy loading on the cart page by by enabling the module from the back-end configuration *Admin &gt; Stores &gt; Configuration &gt; Lazy Loading- Enable "Yes".*

*[![image (95).jpg](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-95.jpg)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-95.jpg)*

### <span style="color: #3b82f6;">Configuration Settings for Image Optimizer</span> [](#bkmrk--10)

Go to *Admin &gt; Stores &gt; Configuration &gt; Scommerce Configuration &gt; Image Optimizer*

#### <span style="color: #f97316;">General Settings</span> [](#bkmrk--11)

- **Enabled -** Select "Yes" or "No" to enable or disable the module.
- **Compress Images while uploading -** Select available options to enable compression for new images uploaded via Magento admin. We recommend this to be enabled because all the new things will be compressed straight away.
- **Number of images to processed –** Define how many number of images you want to process when the cron job runs. Please note this number should be reasonable especially when you have multiple stores and many additional product images.
- **Minimum image size required after optimisation -**
- **Include folders –** Please select list of folders you want to include for compressing the image.
- **Compress Cached Product Images (Yes/No) –** Select "Yes" to compress cached product images generated by Magento. We could recommend to leave this setting turned off especially when you clear your cached images frequently and you have more than 5 additional images on the product page.
- **Image Compression Provider –** Please select image compression provider. **Provider API URL: Provider API URL. smush it –** [**http://api.resmush.it/ws.php?img=**](http://api.resmush.it/ws.php?img) **imageoptim –** [**https://im2.io/{ {username} }/full/**](https://im2.io/%7B%20%7Busername%7D%20%7D/full/) **kraken.io –** [**https://api.kraken.io./v1/url**](https://api.kraken.io/v1)
- **API Key –** Please enter API Key (if provider is kraken.io).
- **API Secret Key –** This will be required for certain providers like kraken.io
- **Exclude folders –** Please enter the list of folders you want to exclude from media directory (comma separated) for example foldername1, foldername2, /foldername /subfolder1, foldername/subfolder2
- **Backup Images (Yes/No) –** Select "Yes" to enable this feature to backup original images before compressing original file.
- **Debugging (Yes/No) –** Select "Yes" to enable debugging. This will write logs in var – log – imageoptimize.log
- **Image Optimiser Schedule –** Please define the Cron frequency to optimize images.

[![image - 2025-06-05T140548.184.png](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-2025-06-05t140548-184.png)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-2025-06-05t140548-184.png)

[![image - 2025-06-05T140637.713.png](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-2025-06-05t140637-713.png)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-2025-06-05t140637-713.png)

- <span style="color: #f97316;">**Compress/Optimize Product Image -**</span> You can compress product images by enabling module from *Admin &gt; Stores &gt; Configuration &gt; Scommerce Configuration &gt; Image Optimiser &gt; Enabled - "Yes" &gt; Compress Images while uploading - Select "Product ".*

*[![image (96).jpg](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-96.jpg)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-96.jpg)*

- <span style="color: #f97316;">**Compress/Optimize Category Image -**</span> You can compress category images by enabling module from *Admin &gt; Stores &gt; Configuration &gt; Scommerce Configuration &gt; Image Optimiser &gt; Enabled - "Yes" &gt; Compress Images while uploading - Select "Category ".*

*[![image (97).jpg](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-97.jpg)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-97.jpg)*

- <span style="color: #f97316;">**Compress/Optimize CMS Image -**</span> You can compress CMS images by enabling module from *Admin &gt; Stores &gt; Configuration &gt; Scommerce Configuration &gt; Image Optimiser &gt; Enabled - "Yes" &gt; Compress Images while uploading - Select "CMS ".*

*[![image (98).jpg](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-98.jpg)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-98.jpg)*

### <span style="color: #3b82f6;">Configuration Settings for Cache Warmer</span> [](#bkmrk--12)

Go to *Admin &gt; Stores &gt; Configuration &gt; Scommerce Configuration &gt; Cache Warmer*

#### <span style="color: #f97316;">General Settings</span> [](#bkmrk--13)

- **Enabled -** Select "Yes" or "No" to enable or disable the module
- **Regenerate cache after page update -** Please select "Yes" or "No" to regenerate cache for updated page.
- **Select Page -** Please select the page(s) from the multi-select option. This will regenerate the cache selected page(s) on page update.
- **Can Regenerate Cache Manually -** Please select " Yes" or "No". If set to "Yes" then you can regenerate cache manually from cache warmer grid.
- **Generate Log -** Select "Yes" to generate the log.

[![image - 2025-06-05T141001.711.png](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-2025-06-05t141001-711.png)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-2025-06-05t141001-711.png)

#### <span style="color: #f97316;">Cron Settings</span> [](#bkmrk--14)

- **Cache Cron Schedule -** Schedule cron job to regenerate the cache for all non cached page(s).
- **Number of Concurrent Regeneration request -** Please define the number of concurrent request.

[![image - 2025-06-05T141250.705.png](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-2025-06-05t141250-705.png)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-2025-06-05t141250-705.png)

### <span style="color: #3b82f6;">Cache Warmer Grid</span> [](#bkmrk--15)

When you enable the module and set *General Settings &gt; Can Regenerate Cache Manually &gt;* to **"Yes"** then it adds an additional option "Regenerate" under the "Actions -&gt;Select" drop-down at *Admin &gt; System &gt; Cache Warmer &gt; Actions.* This grid will have Id, Page URL, Page Type - (Home, Product, Category, CMS), Status - (Cached/Un-cached), Last Cached - (Date, Time), and Action- (Regenerate, Delete).

[![image (99).jpg](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-99.jpg)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-99.jpg)

- <span style="color: #f97316;">**Regenerate -**</span> It regenerates cache manually for Category/Product/CMS pages. By clicking on the "Regenerate" action you can regenerate cache manually for a specific URL.

[![image - 2025-06-05T141450.659.png](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-2025-06-05t141450-659.png)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-2025-06-05t141450-659.png)

### <span style="color: #3b82f6;">Console Commands</span> [](#bkmrk--16)

You can regenerate cache for Product/Category/CMS page(s) by running the following console commands: -

- <span style="color: #f97316;">**Category Page -**</span> If you want to regenerate cache for the category page then run this command **`scommerce:cachewarmer:category`**

**[![image - 2025-06-05T161924.946.png](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-2025-06-05t161924-946.png)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-2025-06-05t161924-946.png)**

- <span style="color: #f97316;">**Product Page -**</span> To regenerate cache for the product page(s), use this command **`scommerce:cachewarmer:product`**

**[![image - 2025-06-05T162021.190.png](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-2025-06-05t162021-190.png)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-2025-06-05t162021-190.png)**

- <span style="color: #f97316;">**CMS Page -**</span> To regenerate cache for CMS page please use this command **`scommerce:cachewarmer:cmspage`**

**[![image - 2025-06-05T162127.923.png](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-2025-06-05t162127-923.png)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-2025-06-05t162127-923.png)**

### <span style="color: #3b82f6;">Front-end Screenshots</span> [](#bkmrk--17)

- <span style="color: #f97316;">**Cache Hit for the category page after the execution of category page command -**</span> When you run the command for category then it regenerates the cache. On the front-end you can debug the cache and check the status "Hit" or "Miss" using browser tool (Inspect element) under *Network &gt; Select Page URL &gt; Header &gt; Cache Debug: HIT*

*[![image - 2025-06-05T162153.478.png](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-2025-06-05t162153-478.png)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-2025-06-05t162153-478.png)*

- <span style="color: #f97316;">**Cache Miss for the Category Page**</span> - Flush the cache by executing the command (**c:f)** and then check cache using browser tool .

- [ ] [![image (100).jpg](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/QQVimage-100.jpg)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/QQVimage-100.jpg)

### <span class="text-blue-500" style="background-color: rgb(255, 255, 255); color: rgb(53, 152, 219);">Set Primary Categories</span>


You can use a script provided with the extension to automatically add primary categories for products. Admin can exclude certain categories from primary category and also prioritise one category over the other to be picked as the primary category.

Go to Admin&gt;Catalog&gt;Categories select a category then scroll down to find the option "Primary Category Settings". Here click on "Exclude From Primary Category" to exclude this category from primary category or enter the priority 0 being the highes. The highest priority category will be picked first for the primary category.

[![image - 2025-06-05T162541.040.png](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-2025-06-05t162541-040.png)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-2025-06-05t162541-040.png)

To automatically assingn primary category for all products run the command given below by going into the root directory of your store.

```php
scommerce:seo-base:set-primary-category
```

<span style="color: rgb(224, 62, 45);">*<span class="text-red-500">**N.B -**</span>* *<span class="text-red-500">If you are using older version then run the script provided in the extension folder at the path Data/SetPrimaryCategoryM2.php from ssh</span>*</span>

### <span style="color: #3b82f6;">Google Page Speed Tests</span> [](#bkmrk--18)

#### <span style="color: #f97316;">Home Page Mobile</span> [](#bkmrk--19)

<span style="color: #f97316;">[![image - 2025-06-05T162752.442.jpg](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-2025-06-05t162752-442.jpg)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-2025-06-05t162752-442.jpg)</span>

#### <span style="color: #f97316;">Home Page Desktop</span> [](#bkmrk--20)

<span style="color: #f97316;">[![image - 2025-06-05T162857.598.jpg](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-2025-06-05t162857-598.jpg)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-2025-06-05t162857-598.jpg)</span>

#### <span style="color: #f97316;">Category Page Mobile</span> [](#bkmrk--21)

<span style="color: #f97316;">[![image - 2025-06-05T162943.469.jpg](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-2025-06-05t162943-469.jpg)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-2025-06-05t162943-469.jpg)</span>

#### <span style="color: #f97316;">Category Page Desktop</span> [](#bkmrk--22)

<span style="color: #f97316;">[![image - 2025-06-05T163044.294.jpg](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-2025-06-05t163044-294.jpg)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-2025-06-05t163044-294.jpg)</span>

#### <span style="color: #f97316;">Product Page Mobile</span> [](#bkmrk--23)

<span style="color: #f97316;">[![image - 2025-06-05T163113.373.jpg](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-2025-06-05t163113-373.jpg)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-2025-06-05t163113-373.jpg)</span>

#### <span style="color: #f97316;">Product Page Desktop</span> [](#bkmrk--24)

<span style="color: #f97316;">[![image - 2025-06-05T163143.522.jpg](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/scaled-1680-/image-2025-06-05t163143-522.jpg)](https://docs.scommerce-mage.com/uploads/images/gallery/2025-06/image-2025-06-05t163143-522.jpg)</span>

If you have a question related to this extension please check out our [**FAQ section**](https://www.scommerce-mage.com/magento-2-google-page-speed-optimizer.html#customfaq) first. If you can't find the answer you are looking for then please contact [**support@scommerce-mage.com**](mailto:core@scommerce-mage.com).