Blog & News

Using htaccess to greatly increase website performance

Tips and tricks of using only htaccess file to dramatically increase website performance
In : Tutorial Comments : 0 Author : wdhadmin Date : 12 Apr 2016

Do you know you’ll be able to dramatically increase website performance using only .htaccess? Automated compression of assets, ETags and Expires Headers are frequently overlooked items that may greatly improve your web site’s performance. This article will try to explain in non-geek speak what they’re, what they do and the way to make use of them on your own websites.

How is it accomplished? This is where the rest of this article will get a bit complicated. You have to learn ALL of the comments and make decisions for your specific needs.

So how can I increase website performance via .htaccess file ?

There are a lot of existing articles discussing web site security using htaccess, therefore I’ll keep this mostly about performance. Within the following code there are many comments explaining what each item can do on your website. The primary features of this file that may speed up your website and increase website performance are Etags (Entity Tag), Expires Headers, and automatic compression of resources.

  1. Enable Gzip Compression helps to decrease the amount of data your server needs to send to your visitor browser, which automatically speeds up the load time of your site.
  2. ETag tells the browser caches that an image is one it has seen before and it doesn’t have to reload it by providing a time stamp and dimension of the file.
  3. Expires headers is similar to ETag however can have different expiration dates per file type. We’re telling the browser that this file should be refreshed every so many days/weeks/months.
  4. AddOutputFilterByType DEFLATE “minifies” the source code of your compiled HTML file by removing unnecessary line breaks and spaces.
########## Begin Optimize website performance

########## Begin - Enable 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

########## Begin - ETag Optimization
## This rule will create an ETag for files based only on the modification
## timestamp and their size. This works wonders if you are using rsync'ed
## servers, where the inode number of identical files differs.
## Note: It may cause problems on your server and you may need to remove it
FileETag MTime Size
########## End - ETag Optimization
########## Begin - Automatic compression of resources
# Compress text, html, javascript, css, xml, kudos to Komra.de
# May kill access to your site for old versions of Internet Explorer
# The server needs to be compiled with mod_deflate otherwise it will send HTTP 500 Error.
# mod_deflate is not available on Apache 1.x series. Can only be used with Apache 2.x server.
# AddOutputFilterByType is now deprecated by Apache. Use mod_filter in the future.
AddOutputFilterByType DEFLATE text/plain text/html text/xml text/css application/xml application/xhtml+xml application/rss+xml application/javascript application/x-javascript
########## Begin - Optimal default expiration time
## Note: this might cause problems and you might have to comment it out by
## placing a hash in front of this section's lines

	# Enable expiration control
	ExpiresActive On
 
	# Default expiration: 1 hour after request
	ExpiresDefault "now plus 1 hour"
 
	# CSS and JS expiration: 1 week after request
	ExpiresByType text/css "now plus 1 week"
	ExpiresByType application/javascript "now plus 1 week"
	ExpiresByType application/x-javascript "now plus 1 week"
 
	# Image files expiration: 1 month after request
	ExpiresByType image/bmp "now plus 1 month"
	ExpiresByType image/gif "now plus 1 month"
	ExpiresByType image/jpeg "now plus 1 month"
	ExpiresByType image/jp2 "now plus 1 month"
	ExpiresByType image/pipeg "now plus 1 month"
	ExpiresByType image/png "now plus 1 month"
	ExpiresByType image/svg+xml "now plus 1 month"
	ExpiresByType image/tiff "now plus 1 month"
	ExpiresByType image/vnd.microsoft.icon "now plus 1 month"
	ExpiresByType image/x-icon "now plus 1 month"
	ExpiresByType image/ico "now plus 1 month"
	ExpiresByType image/icon "now plus 1 month"
	ExpiresByType text/ico "now plus 1 month"
	ExpiresByType application/ico "now plus 1 month"
	ExpiresByType image/vnd.wap.wbmp "now plus 1 month"
	ExpiresByType application/vnd.wap.wbxml "now plus 1 month"
	ExpiresByType application/smil "now plus 1 month"
 
	# Audio files expiration: 1 month after request
	ExpiresByType audio/basic "now plus 1 month"
	ExpiresByType audio/mid "now plus 1 month"
	ExpiresByType audio/midi "now plus 1 month"
	ExpiresByType audio/mpeg "now plus 1 month"
	ExpiresByType audio/x-aiff "now plus 1 month"
	ExpiresByType audio/x-mpegurl "now plus 1 month"
	ExpiresByType audio/x-pn-realaudio "now plus 1 month"
	ExpiresByType audio/x-wav "now plus 1 month"
 
	# Movie files expiration: 1 month after request
	ExpiresByType application/x-shockwave-flash "now plus 1 month"
	ExpiresByType x-world/x-vrml "now plus 1 month"
	ExpiresByType video/x-msvideo "now plus 1 month"
	ExpiresByType video/mpeg "now plus 1 month"
	ExpiresByType video/mp4 "now plus 1 month"
	ExpiresByType video/quicktime "now plus 1 month"
	ExpiresByType video/x-la-asf "now plus 1 month"
	ExpiresByType video/x-ms-asf "now plus 1 month"

########## End - Optimal expiration time

Tips and Tricks

Not all servers are created equal. The default server settings vary from host to host and which means that some of the settings on this htaccess file may throw 500 Internal Server Errors. One of the simplest ways to narrow down exactly the reason for the error is to remove a piece of the code, upload, then check the site. If the error persists, replace the first chunk and remove another, then repeat the steps. It is useful to write down down the line numbers you’ve got tested till the culprit is found.

In case you find css or javascript files aren’t performing properly, use a tool like Firebug or Chromes element inspector to see what errors are being reports. 403 Forbidden errors will typically mean that you’ve blocked access to a folder or file type. Search for the path of the file in the error and create a RewriteRule to allow access to that folder as seen within the examples below.

RewriteRule ^wp-content\/themese\/your_theme_folder/ - [L]
## Let's say you want to use folder fonts for @fontface
RewriteRule ^wp-content\/themese\/your_theme_folder\/fonts/ - [L]

Disclaimer

This is not an ultimate tutorial, and never meant to be dropped into your WordPress web site as a replacement for the standard file without first customizing the code to suit your site and server. Understanding of the code on this .htaccess file is required or you’ll most certainly break (temporarily) your website instead of increase website performance. Try this out on a demo set up first and keep in mind, always make a backup.

Authenticating your MailChimp emails so they actually reach your subcribers

Leave a Reply