Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Google Page Speed Optimizer

11,493 views

Published on

Make your store much more Google and user-friendly by optimizing your code structure. Automatically compress product images and use advanced JS/CSS minification options to improve your website performance and get higher score in Google PageSpeed Insights.

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Google Page Speed Optimizer

  1. 1. User Guide: Google Page Speed Optimizer Page 1 Google Page Speed Optimizer Magento Extension User Guide Official extension page: Google Page Speed Optimizer Support: http://amasty.com/contacts/
  2. 2. Page 2 Table of contents: 1. JavaScripts minification settings…………………………………………………………………..3 2. CSS minification settings………………………………………………………………………….…..5 3. Fingerprints settings…………………………………………………………………………………....6 4. Render-blocking content settings………………………………………………………….……….7 5. Images Optimization………………………………………………………………………….…………8 6. Debug settings……………………………………………………………………………………………..10 7. Optimization results in Google PageSpeed Insights……………………………..…….…….11 Support: http://amasty.com/contacts/ User Guide: Google Page Speed Optimizer
  3. 3. Page 3 1. JavaScript minification settings Support: http://amasty.com/contacts/ User Guide: Google Page Speed Optimizer To configure extension settings please go to System -> Configuration - > Google PageSpeed Optimizer
  4. 4. Page 4 Choose the minification level. Click here to read more about minification levels. Support: http://amasty.com/contacts/ User Guide: Google Page Speed Optimizer Enable JavaScript minification. NOTE: For JS minification the module uses the Google Closure Compiler tool. 1. JavaScript minification settings
  5. 5. Page 5 Support: http://amasty.com/contacts/ Set the option to ‘Yes’ to enable CSS code minification. During the minification process all unnecessary characters like new lines, comments and others will be accurately removed without affecting your source code. User Guide: Google Page Speed Optimizer 2. CSS minification settings
  6. 6. Page 6 The option adds Timestamp to all JS and CSS files to make browser automatically update cached values once they are changed. Support: http://amasty.com/contacts/ User Guide: Google Page Speed Optimizer 3. Fingerprints settings
  7. 7. Page 7 Support: http://amasty.com/contacts/ User Guide: Google Page Speed Optimizer Enable this option to move all JavaScripts to footer to make pages render much faster. 4. Render - blocking content settings
  8. 8. Page 8 Support: http://amasty.com/contacts/ User Guide: Google Page Speed Optimizer Enable the option to automatically compress all product images generated by Magento. Install these utilities for images optimization to your server . In case you don’t want to install them to the server, but only to your website you need to specify the path to the utilities here. 5. Images Optimization NOTE: Please follow the step-by- step instruction to properly configure images optimization.
  9. 9. Page 9 Support: http://amasty.com/contacts/ User Guide: Google Page Speed Optimizer 5. Images Optimization For correct image optimization please follow these steps: 1. Install jpegoptim, optipng and gifsicle %f -o %f utilities to your server. 2. Set the option to ‘Yes’ to enable automatic product images optimization. 3 . Then go to System -> Cache Management and click the ‘Flush Catalog Images’ button to optimize new images. 4. To optimize images stored in skin and media folders you need to enter your server via ssh, open Magento root directory and run the command: php -f shell/amoptimization.php -- optimize
  10. 10. Page 10 6. Debug settings Support: http://amasty.com/contacts/ User Guide: Google Page Speed Optimizer Activate this option to add all possible minification errors to log.
  11. 11. Page 11 Support: http://amasty.com/contacts/ User Guide: Google Page Speed Optimizer Use Google PageSpeed Insights tool to check out your desktop website performance. 7. Optimization results in Google PageSpeed Insights See the example of PageSpeed Insights results before and after using Google Page Speed Optimization extension.
  12. 12. Thank you! Your feedback is absolutely welcome! Should you have any questions or feature suggestions, please contact us at: http://amasty.com/contacts/ Page 12 Support: http://amasty.com/contacts/ User Guide: Google Page Speed Optimizer

×