Caching and gzip compression plays a big role in improving page speed ranking/grade.
Caching website content, such as images, JS scripts, CSS and HTML plays a big role especially now because google has made mobile page speed as a ranking factor.
Page speed is the first step towards Search Engine Optimization (SEO) and to drastically improve website page speed, Leverage browser caching and gzip compression is highly recommended.
Also make sure, you start work on page speed only after site development work is completed. Because once you start caching your site, any future edits may take some time to reflect. You may have to constantly purge cache and at times you may have to clear cache more than once to test your edits. This would lead to slowing work, breaking development flow and end of the day we may feel quite drained and the feeling of nothing constructive happed through the day.
How to implement browser caching and gzip compression in Bitnami WordPress website hosted on AWS cloud?
AWS Bitnami WordPress set up is slightly different from the basic Linux hosting setup. Unlike in shared host, where we edit .htaccess to enable caching, instead here, we edit httpd-app.conf to do the same.
In Bitnami WP, we edit httpd-app.conf and enable expires to implement browser caching. And for gzip compression, we enable deflate module in the same.
Steps to implement leverage browser caching in Bitnami WP website
Step 1: Enable expires module
- Connect to your server using FileZilla or any other FTP client
- Go to /opt/bitnami/apache2/conf
- Download httpd.conf and open it
- Search for LoadModule expires_module modules/mod_expires.so
- Replace #LoadModule expires_module modules/mod_expires.so with LoadModule expires_module modules/mod_expires.so ( Remove #)
- Save and upload the file
Step 2: Add the Expires Headers
- Download httpd-app.conf and open it
- Copy and paste the code below just above
<filesMatch “.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$”>
Header set Cache-Control “max-age=2592000, public”ExpiresActive On
ExpiresByType image/jpg “access 1 year”
ExpiresByType image/jpeg “access 1 year”
ExpiresByType image/gif “access 1 year”
ExpiresByType image/png “access 1 year”
ExpiresByType text/css “access 1 month”
ExpiresByType application/pdf “access 1 month”
ExpiresByType text/x-javascript “access 1 month”
ExpiresByType application/x-shockwave-flash “access 1 month”
ExpiresByType image/x-icon “access 1 year”
ExpiresDefault “access 2 days”
- Save and upload the file
Step 3: Restart the Apache server
- Connect to your ec2 instance using SSH Client, am using PuTTy
- Restart Apache using the command sudo /opt/bitnami/ctlscript.sh restart
- That’s all! Test the performance see the changes.
Steps to implement GZIP Compression
- Open the downloaded httpd.conf
- Search for LoadModule deflate_module modules/mod_deflate.so
Replace # LoadModule deflate_module modules/mod_deflate.so with LoadModule deflate_module modules/mod_deflate.so
- Go to the end of the file and add the code given below
SetOutputFilter DEFLATE
# Compress HTML, CSS, JavaScript, Text, XML and fonts
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
AddOutputFilterByType DEFLATE application/x-font
AddOutputFilterByType DEFLATE application/x-font-opentype
AddOutputFilterByType DEFLATE application/x-font-otf
AddOutputFilterByType DEFLATE application/x-font-truetype
AddOutputFilterByType DEFLATE application/x-font-ttf
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE font/opentype
AddOutputFilterByType DEFLATE font/otf
AddOutputFilterByType DEFLATE font/ttf
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE image/x-icon
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/xml# Remove browser bugs (only needed for really old browsers)
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
Header append Vary User-Agent
- Save and upload the file
That’s it! You have enabled gzip compression module and added the optimization code as well. Test the performance again, you will see that page speed has improved.
Thank you so much for taking time and going through this tutorial, Hope it has been helpful to you.
Migrating WordPress website can get cumbersome and time consuming depending on the size and intricacies of the site content, such as plugins, images, DB tables and definitely internet speed too.
Read More