Website Speed Optimization Using .htaccess file

It is always important to optimize website speed for a smooth and inspiring user experience. And search engines also love faster page speed WordPress sites.

As we all love faster websites and want a speedy WordPress website. All the websites owner and especially beginners should know the tricks through which they can boost their websites. We will focus on some important tricks which I experienced and got a much faster website. Now at this stage, my website is scoring about 98% using these tricks. There are a lot of ways to increase the speed of WordPress website using .htaccess code.

This article will walk through the 6 best tricks for speed optimization using .htacess, however it is not an easy job. So I will recommend you to take some important steps before you go further. If you are a beginner, you must have to read the Prerequisites section to avoid making problems and or crash your WordPress website.

Check out: How to speed up your WordPress Website — Tips And Tricks

Before you start editing the .htaccess file, follow the below guidelines.

1. Create a backup of the .htaccess file. (you can reload it if the changes break your website)
2. Purge all cache and disable the cashing Plugin.
3. Check your website by refreshing it to ensure it’s still working.
4. Suppose you found that your website is not loading or not working. Find a possible solution for that error.

How to increase WordPress website Speed using the .htaccess file

First of all, we will take a brief overview of a list of .htaccess file tricks to enhance and increase speed. This list covers the major and recommended changes by most of the developers to increase website speed.

Check out: How to Improve HTTP Response Header In WordPress

1. Compression (Gzip and DEFLECT)
2. Enable “Keep-Alive”
3. Leverage Browser Cache
4. Disable Image Hotlinking
5. Activate mod_pagespeed option
6. Enable light speed server cache

Lets Start

1. Enable Compression (Gzip and DEFLATE)

The compression can minimize the size of JS, CSS, and HTML files by 60 to 80 percent. Add the below code in your WordPress .htaccess file to enable DEFLATE and Gzip Compression.

#GZIP COMPRESSION <IfModule mod_gzip.c> mod_gzip_on Yes mod_gzip_dechunk Yes mod_gzip_item_include file \.(html?|txt|css|js|php|pl)$ mod_gzip_item_include handler ^cgi-script$ mod_gzip_item_include mime ^text/.* mod_gzip_item_include mime ^application/x-javascript.* mod_gzip_item_exclude mime ^image/.* mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.* </IfModule> # END GZIP COMPRESSION

2. DEFLATE Compression

# START DEFLATE COMPRESSION
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE “application/atom+xml” \
“application/javascript” \
“application/json” \
“application/ld+json” \
“application/manifest+json” \
“application/rdf+xml” \
“application/rss+xml” \
“application/schema+json” \
“application/vnd.geo+json” \
“application/vnd.ms-fontobject” \
“application/x-font” \
“application/x-font-opentype” \
“application/x-font-otf” \
“application/x-font-truetype” \
“application/x-font-ttf” \
“application/x-javascript” \
“application/x-web-app-manifest+json” \
“application/xhtml+xml” \
“application/xml” \
“font/eot” \
“font/otf” \
“font/ttf” \
“font/opentype” \
“image/bmp” \
“image/svg+xml” \
“image/vnd.microsoft.icon” \
“image/x-icon” \
“text/cache-manifest” \
“text/css” \
“text/html” \
“text/javascript” \
“text/plain” \
“text/vcard” \
“text/vnd.rim.location.xloc” \
“text/vtt” \
“text/x-component” \
“text/x-cross-domain-policy” \
“text/xml”
</IfModule>
# END DEFLATE COMPRESSION

3. Enable Keep-Alive Option

This is a potent .htaccess trick which enables server and web browser to download resources from a single connection.

Copy and paste the below code in your .htaccess file to enable this function.

# START ENABLE KEEPALIVE
<ifModule mod_headers.c>
Header set Connection keep-alive
</ifModule>
# END ENABLE KEEPALIVE

4. Leverage the Browser Cache

This is one of the most important and recommended .htaccess tricks to optimize the WordPress website. Most of all, speed test tools like Google PageSpeed Insights, GTmatrix, and Pingdom recommend enabling Leverage browser caching. Browser Caching enabled websites to tell web browsers to keep/store website resources like CSS or JS files for a certain period.

Add the below code to the .htaccess file to leverage the browser cache.

# START EXPIRES CACHING #
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType text/css “access 1 month”
ExpiresByType text/html “access 1 month”
ExpiresByType image/gif “access 1 year”
ExpiresByType image/png “access 1 year”
ExpiresByType image/jpg “access 1 year”
ExpiresByType image/jpeg “access 1 year”
ExpiresByType image/x-icon “access 1 year”
ExpiresByType image/svg+xml “access plus 1 month”
ExpiresByType audio/ogg “access plus 1 year”
ExpiresByType video/mp4 “access plus 1 year”
ExpiresByType video/ogg “access plus 1 year”
ExpiresByType video/webm “access plus 1 year”
ExpiresByType application/atom+xml “access plus 1 hour”
ExpiresByType application/rss+xml “access plus 1 hour”
ExpiresByType application/pdf “access 1 month”
ExpiresByType application/javascript “access 1 month”
ExpiresByType text/x-javascript “access 1 month”
ExpiresByType text/x-component “access plus 1 month”
ExpiresByType application/x-shockwave-flash “access 1 month”
ExpiresByType font/opentype “access plus 1 month”
ExpiresByType application/vnd.ms-fontobject “access plus 1 month”
ExpiresByType application/x-font-ttf “access plus 1 month”
ExpiresByType application/font-woff “access plus 1 month”
ExpiresByType application/font-woff2 “access plus 1 month”
ExpiresDefault “access 1 month”
</IfModule>
# END EXPIRES CACHING #

5. Add Cache-control headers to enhance Page Speed. Copy and paste the below code into the .htaccess file

# BEGIN Cache-Control Headers
<ifModule mod_headers.c>
<filesMatch “\.(ico|jpe?g|png|gif|swf)$”>
Header set Cache-Control “public”
</filesMatch>
<filesMatch “\.(css)$”>
Header set Cache-Control “public”
</filesMatch>
<filesMatch “\.(js)$”>
Header set Cache-Control “private”
</filesMatch>
<filesMatch “\.(x?html?|php)$”>
Header set Cache-Control “private, must-revalidate”
</filesMatch>
</ifModule>
#END Cache-Control Headers

6. Disable Image Hotlinking in the .htaccess file

This trick is to restrict other sources from using your website images. There are huge chances that spammers can use your image link to their website. Every time someone visits their page, the linked images will be loaded from your website/server. This is called image Hotlinking.

So you copy and paste the below code into your .httaccess file to prevent image Hotlinking.

# DISABLE IMAGE HOTLINKING START
RewriteEngine on
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?sample.com [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?google.com [NC]
RewriteRule \.(jpg|jpeg|png|gif)$ – [NC,F,L]
# DISABLE IMAGE HOTLINKING END

7. Active mod_pagespeed

This trick is to enhance and optimize your website, especially relevant and works with Apache Server. Google develops the Mod_pagespeed module and now a few major hosting providers like DreamHost, SiteGround, and Godaddy to increase its page speed. However, this module could be installed using SSh on your Cpanel.

Copy and paste the below code to the .htaccess file to enable this module.

# ENABLE MOD PAGESPEED START
# COMBINE CSS, COMPRESS IMAGES, REMOVE HTML WHITE SPACE AND COMMENTS
<IfModule pagespeed_module>
ModPagespeed on
ModPagespeedEnableFilters rewrite_css,combine_css
ModPagespeedEnableFilters recompress_images
ModPagespeedEnableFilters convert_png_to_jpeg,convert_jpeg_to_webp
ModPagespeedEnableFilters collapse_whitespace,remove_comments
</IfModule>

8. LightSpeed Cache

Suppose you are using a lightspeed Server to run your website. You should use the below code to enable LightSpeed Cache Option.

# ENABLE LITESPEED CACHE START
<IfModule LiteSpeed>
CacheEnable public
RewriteEngine On
RewriteCond %{REQUEST_METHOD} ^GET|HEAD$
RewriteCond %{HTTP_HOST} ^sample.com|sample.net|sample.org [NC]
RewriteCond %{REQUEST_URI} !login|admin|register|post|cron
RewriteCond %{QUERY_STRING} !nocache
RewriteRule .* – [E=Cache-Control:max-age=300]
</IfModule>
#ENABLE LITESPEED CACHE ENDerver level caching.

Important Note: – you should add/edit the mentioned module codes one by one in your website .htaccess file. Check your website every time you add/edit a module, so it will help you to know which module is not fit for your website.

Bonus tip

To prevent the chances of being hacked, it is essential to add the following code at the bottom of your website’s .htaccess file. This will help to hide your server signatures.

# Disable server signature #
ServerSignature Off
# End Disable server signature #