Website Performance Optimization

Website Performance Optimization


Web performance optimization or website optimization is the field of knowledge about increasing the loading speed of your web pages and minimizing the time a page takes in getting downloaded and displayed on the user’s web browser.

With the average internet speed increasing globally, it is the requirement for website administrators and webmasters to consider the time it takes for websites to render for the visitor.

There are a lot of factors that play a vital role in affecting the speed of page load. Some aspects which can affect the speed of page load include browser/server cache, image optimization, and encryption (for example SSL), etc.

How to measure your webiste performance?

You can use online tools or portals to measure your websites performance. Some popular sites are:

Techniques to boost your website performance(Apache Servers Only)

Set Expire Headers in .htaccess

Expires headers tell the browser whether they should request a specific file from the server or whether they should grab it from the browser’s cache.

The whole idea behind Expires Headers is not only to reduce the load of downloads from the server but rather to reduce the number of HTTP requests for the server.

<IfModule mod_expires.c>
# Enable expirations
ExpiresActive On 
# Default directive
ExpiresDefault "access plus 1 month"
# My favicon
ExpiresByType image/x-icon "access plus 1 year"
# Images
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType image/jpg "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType text/css "access 1 month"
# Javascript
ExpiresByType application/javascript "access plus 1 year"

Enable gzip compression

Reduce the size of files sent from your server to increase the speed to which they are transferred to the browser.

When a user hits your website a call is made to your server to deliver the requested files. The bigger these files are the longer it’s going to take for them to get to your browser and appear on the screen.

Gzip compresses your webpages and style sheets before sending them over to the browser. This drastically reduces transfer time since the files are much smaller.

<IfModule mod_deflate.c>
  # Compress HTML, CSS, JavaScript, Text, XML and fonts
  AddOutputFilterByType DEFLATE application/javascript
  AddOutputFilterByType DEFLATE application/rss+xml
  AddOutputFilterByType DEFLATE application/
  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

Image Compression

Reduce the load times of pages by loading appropriately sized images.

If you don’t have any tools to optimize png/jpg images. Such as :


If your server does not server support mod_deflate and mod_gzip you can use the below php code at the top of your headers file.

if ( substr_count( $_SERVER['HTTP_ACCEPT_ENCODING'], 'gzip' ) ) {
    ob_start( "ob_gzhandler" );
else {

ET Tags

ETags (Entity Tags) are a mechanism that web servers and browsers use to determine if the component in the browser’s cache matches the original server.

To disable entity tags:

<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)(\.gz)?$">
Header unset ETag
FileETag None

Browser Caching

With browser caching, we’re instructing browsers to hold particular files for a specified period of time. So, when the file is needed again, the browser pulls from its local cache instead of requesting it from the server again.

– Add Expire Headers
– Add Cache Control Headers

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

**Note: Above website performance stats can be further optimized by using CDNs for images/css/js and by using minified javascript and css.

Reviews & Ratings Get your stoe online with Shopify in 60 minutes Shop Now