Performance

Optimal PageSpeed Configuration

By 15th July 2014September 9th, 2021No Comments

We know there can be some confusion in the most optimal settings for a store running Pagespeed, below you'll find configurations (continually updated) to reflect the most optimal configuration.

Configuration

The exact configuration differs slightly depending on whether your store is using Magento 1 or 2.

Please see below for reference depending on the version you're using.

For both versions of Magento:

Create/domains/example.com/___general/example.com.pagespeed.conf, and replace the following to suit your stack,

  • lb1.i
  • example.com

Then copy one of the below configurations into this new file.


Magento 1

# Enable PageSpeed
pagespeed on;
pagespeed Domain *.example.com;

pagespeed DownstreamCachePurgeLocationPrefix https://lb1.i;
pagespeed DownstreamCachePurgeMethod PURGE;
pagespeed DownstreamCacheRewrittenPercentageThreshold 95;

# PageSpeed should be disabled on the Magento admin (adjust to suit custom admin URLs)
pagespeed Disallow "*/admin/*";
# Use the MageStack image optimiser for catalogue images, see https://www.sonassi.com/help/performance/optimise-images
pagespeed Disallow "*/media/catalog/product/*";

# This setting should be enabled when using HTTPS
# Take care when using HTTP > HTTPS redirection to avoid loops
#pagespeed MapOriginDomain http://www.example.com https://www.example.com;

# If using Varnish with PageSpeed, consider uncommenting the following line
# as beacons may not have a true chance to operate (they require several page loads)
#pagespeed CriticalImagesBeaconEnabled false;

pagespeed EnableFilters extend_cache;

pagespeed EnableFilters lazyload_images;
pagespeed LazyloadImagesAfterOnload off;
pagespeed LazyloadImagesBlankUrl "https://www.gstatic.com/psa/static/1.gif";
pagespeed EnableFilters rewrite_images;
# Not all browsers support WebP and if using Varnish, you can improve hit rate
# by not converting images to webp. Contact Sonassi support if using Varnish with PageSpeed to
# improve hit rate
pagespeed DisableFilters convert_jpeg_to_webp,convert_to_webp_lossless,convert_to_webp_animated,recompress_webp;
# This should be tested, or it can produce undesirable results with JS sliders
#pagespeed EnableFilters insert_image_dimensions;

# This can cause issues with the Magento admin image uploader
pagespeed EnableFilters collapse_whitespace;

# Do not use this option in conjunction with EcomDev_Varnish
pagespeed EnableFilters remove_comments;

pagespeed EnableFilters move_css_above_scripts;
# It is preferred to use Lesti Merge, versus using these settings
#pagespeed EnableFilters rewrite_css;
#pagespeed EnableFilters combine_css;

pagespeed EnableFilters inline_javascript;
pagespeed EnableFilters defer_javascript;
# It is preferred to use Lesti Merge, versus using these settings
#pagespeed EnableFilters combine_javascript;
#pagespeed EnableFilters rewrite_javascript;

pagespeed MaxCombinedJsBytes 300000;
pagespeed CombineAcrossPaths on;

Magento 2

# Enable PageSpeed
pagespeed on;
pagespeed Domain *.example.com;

pagespeed DownstreamCachePurgeLocationPrefix https://lb1.i;
pagespeed DownstreamCachePurgeMethod PURGE;
pagespeed DownstreamCacheRewrittenPercentageThreshold 95;

# PageSpeed should be disabled on the Magento admin (adjust to suit custom admin URLs)
pagespeed Disallow "*/admin/*";
# Use the MageStack image optimiser for catalogue images, see https://www.sonassi.com/help/performance/optimise-images
pagespeed Disallow "*/media/catalog/product/*";

# Change the domain name specified below to suit your domain name
pagespeed MapOriginDomain http://www.example.com https://www.example.com;

# Beaconing support is disabled by default - please see the note below this configuration for further information
pagespeed CriticalImagesBeaconEnabled false;

pagespeed EnableFilters extend_cache;

pagespeed EnableFilters lazyload_images;
pagespeed LazyloadImagesAfterOnload off;
pagespeed LazyloadImagesBlankUrl "https://www.gstatic.com/psa/static/1.gif";
pagespeed EnableFilters rewrite_images;

# Please note that not all browsers support WebP 
# If using Varnish, the default configuration will separate it's cache based on a browser's capabilities
# This avoids serving WebP images to browsers which don't support it, instead falling back to JPG/PNG/GIF
pagespeed DisableFilters convert_jpeg_to_webp,convert_to_webp_lossless,convert_to_webp_animated,recompress_webp;

# This should be tested, or it can produce undesirable results with JS sliders
#pagespeed EnableFilters insert_image_dimensions;

# This can cause issues with the Magento admin image uploader
pagespeed EnableFilters collapse_whitespace;

pagespeed EnableFilters move_css_above_scripts;

pagespeed EnableFilters inline_javascript;
pagespeed EnableFilters defer_javascript;

# Magento 2 natively supports Javascript bundling and CSS minfiication, which is preferred over the following filters
#pagespeed EnableFilters rewrite_css;
#pagespeed EnableFilters combine_css;
#pagespeed EnableFilters combine_javascript;
#pagespeed EnableFilters rewrite_javascript;

pagespeed MaxCombinedJsBytes 300000;
pagespeed CombineAcrossPaths on;

The stack also supports Pagespeed's filters which rely on beaconing, such as prioritize_critical_css.

Beaconing is optional and is disabled by default, as it requires some traffic to be passed through the stack's Varnish cache.

Please raise a ticket with the Sonassi support team if you'd like this enabling.

Once enabled, enable the CriticalImagesBeaconEnabled filter in your Pagespeed configuration to enable beaconing support:

pagespeed CriticalImagesBeaconEnabled true

And enable the filters which rely on this beaconing:

pagespeed EnableFilters inline_images;
pagespeed EnableFilters inline_preview_images;
pagespeed EnableFilters lazyload_images;
pagespeed EnableFilters prioritize_critical_css;

Activation

Then at the top of ___general/example.com.conf add the following,

include /microcloud/domains/example/domains/example.com/___general/example.com.pagespeed.conf;

Then reload Nginx by running /etc/init.d/nginx reload