The tolerance of people for poor experience is declining over time and most of them will bounce from your website if it doesn't load in the first few seconds. Below are a few measures that can increase the performance of your website.
1. Compress components with gzip
Include the following lines in your .htaccess file. Make sure your hosting service has compression support.
<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 expire headers (Browser caching)
Include the following lines in your .htaccess file. This will enable the caching of our page assets in browsers for the specified time interval.
<IfModule mod_expires.c>
ExpiresActive On
# Images
ExpiresByType image/jpeg "access plus 1 year"
ExpiresByType image/gif "access plus 1 year"
ExpiresByType image/png "access plus 1 year"
ExpiresByType image/webp "access plus 1 year"
ExpiresByType image/svg+xml "access plus 1 year"
ExpiresByType image/x-icon "access plus 1 year"
# Video
ExpiresByType video/mp4 "access plus 1 year"
ExpiresByType video/mpeg "access plus 1 year"
# CSS, JavaScript
ExpiresByType text/css "access plus 1 month"
ExpiresByType text/javascript "access plus 1 month"
ExpiresByType application/javascript "access plus 1 month"
# Others
ExpiresByType application/pdf "access plus 1 month"
ExpiresByType application/x-shockwave-flash "access plus 1 month"
ExpiresDefault "access 2 days"
</IfModule>
3. Avoid URL redirects
Include the following lines in your .htaccess file.
RewriteEngine On
RewriteCond %{HTTP_HOST} ^www.example.com [NC]
RewriteRule (.*)$ http://example.com/$1 [R=301,L]
4. Reduce DNS lookups
Built over time by domain authority and other factors.
5. Make fewer HTTP requests
Reduce the number of files i.e. combine CSS, js, etc.
6. Avoid empty src or href
Avoid <video poster="">, <script src=""> etc.
7. Minify HTML, CSS and JS
Minify all files thus reducing file size.
8. Specify image dimensions
Include the height and weight of images.
<img src="image.jpg" width="200" height="200" />
9. Avoid bad requests
Ensure all requests have a proper response and do not yield 404 or 410 status codes.
10. Defer parsing of JavaScript
Javascript parsing will block all other processes. Therefore a bulk code can slow down the rendering. Use the following code to delay the parsing.
<script type="text/javascript">
function downloadJSAtOnload() {
var element = document.createElement("script");
element.src = "example.js";
document.body.appendChild(element);
}
if (window.addEventListener)
window.addEventListener("load", downloadJSAtOnload, false);
else if (window.attachEvent)
window.attachEvent("onload", downloadJSAtOnload);
else window.onload = downloadJSAtOnload;
</script>
Read the full list here.
Happy coding!
Top comments (0)