Speed Up Your Website Using .htaccess File

Speed optimization is a major work in the website development. There are many ways to improve the page loading time of the website. One of the solutions is a .htaccess file.

What is .htaccess?

Before using the .htaccess file, I would recommend you to know about it. .htaccess is short for Hypertext Access. The .htaccess file allows modifying the Apache web server configuration without modifying the main configuration file. It is a powerful configuration file which controls the directory it is placed in and all the sub-directories underneath it.

Tricks for Improving Site Speed with .htaccess

1. Turn on compression:

mod_gzip is an external extension module for Apache server which allows you to compress your files before you send them to the client. This is used to speed up your website and save your bandwidth. If your hosting provider has enabled the mod_gzip module, add the following lines of code in your .htaccess file to compress your content:

<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>
2. Add future Expires and Cache-Control headers

If you test your website using any optimization tools like Google PageSpeed Analysis, you might be received some advice to using browser cache to get a speed boost. When a new visitor enters your website all the files like JS scripts, CSS styles, and images are downloaded, there is no way to avoid it and it naturally produces several requests to your server but using the Expires and Cache-Control headers, you can make those files cacheable. So when the user returns to your site it will reload the files from the cache instead of downloading them all again. This is used to avoid unnecessary HTTP requests on subsequent page views.

To set your Expires headers add the following lines of code in your .htaccess:

<ifModule mod_expires.c>
    ExpiresActive On
    ExpiresDefault "access plus 5 seconds"
    ExpiresByType image/x-icon "access plus 2592000 seconds"
    ExpiresByType image/jpeg "access plus 2592000 seconds"
    ExpiresByType image/png "access plus 2592000 seconds"
    ExpiresByType image/gif "access plus 2592000 seconds"
    ExpiresByType application/x-shockwave-flash "access plus 2592000 seconds"
    ExpiresByType text/css "access plus 604800 seconds"
    ExpiresByType text/javascript "access plus 216000 seconds"
    ExpiresByType application/javascript "access plus 216000 seconds"
    ExpiresByType application/x-javascript "access plus 216000 seconds"
    ExpiresByType text/html "access plus 600 seconds"
    ExpiresByType application/xhtml+xml "access plus 600 seconds"
</ifModule>

and to set Cache-Control headers add the following lines of code in your .htaccess:

<ifModule mod_headers.c>
    <filesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|swf)$">
        Header set Cache-Control "max-age=2592000, public"
    </filesMatch>
    <filesMatch "\.(css)$">
        Header set Cache-Control "max-age=604800, public"
    </filesMatch>
    <filesMatch "\.(js)$">
        Header set Cache-Control "max-age=216000, private"
    </filesMatch>
    <filesMatch "\.(xml|txt)$">
        Header set Cache-Control "max-age=216000, public, must-revalidate"
    </filesMatch>
    <filesMatch "\.(html|htm|php)$">
        Header set Cache-Control "max-age=1, private, must-revalidate"
    </filesMatch>
</ifModule>
3. Turn off ETags

By removing the ETags, you can make the web page loads faster, decrease server load and reduce the bandwidth.

To disable ETags, add the following lines of code in your .htaccess:

<ifModule mod_headers.c>
    Header unset ETag
</ifModule>

FileETag None
4. Remove Last-Modified header

Don’t turn off both Last-Modified header and ETag, because it will totally eliminate If-Modified-Since and If-None-Match requests and their 304 Not Modified responses, so keep any one of them on.

To remove the Last-Modified header, add the following lines of code in your .htaccess:

<ifModule mod_headers.c>
    Header unset Last-Modified
</ifModule>
5. Prevent hotlinking

Hotlinking is a major problem which happens when people link to files and images on a different server and display them on their own website, this uses the bandwidth of the original owner at their expense. Thankfully, it’s possible to prevent other domains from hotlinking to your website. To ensure nobody is using your precious bandwidth, add this script to your .htaccess file:

#Prevent Hot Linking
RewriteEngine on
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?yourdomain.com [NC]
RewriteRule \.(jpg|jpeg|png|gif)$ - [NC,F,L]
6. Set up caching on static resources

Google recommends caching all static (permanent) resources – including Javascript, CSS, Media files, Images, etc. Caching saves these resources to the user’s local memory so the files no need to be downloaded for repeat visits. This modification alone can significantly reduce the page loading time.

While some servers will cache a few static resources by default, it’s best to explicitly tell your server to cache all of them. More importantly, the default expiration period for the cached entities is one hour, while Google recommends a minimum of one month, and even up to one year (but no more than that).

To ensure the server is caching all static resources and for the maximum time recommended by Google, we’ll be using mod_expires. Open .htaccess and paste the following inside:

# Set up caching on static resources for 1 year based on Google recommendations
<IfModule mod_expires.c>
    ExpiresActive On
    <FilesMatch "\.(flv|ico|pdf|avi|mov|ppt|doc|mp3|wmv|wav|js|css|gif|jpg|jpeg|png|swf)$">
        ExpiresDefault A29030400
    </FilesMatch>
</IfModule>

Hope this helps.

Leave a Reply

Your email address will not be published. Required fields are marked *