Page speed plays a vital role in search engine rankings. So, it's better to know any website's loading speed and optimize it to perform better.
A lot of online applications are available for free that allows you to test your website's performance. Although, all these applications have the same motive, additional features they provide differ from each other. Here's a short list of such applications with their featues.
Caching static assets of a webpage should be enabled as it helps to load the webpage faster for the next time a visitor runs the same webpage. If you are working on a wordpress site, you can use external plugins like W3 Total Cache for that purpose. If you are working on a custom website then you can modify the .htaccess file as follows.
AddType text/javascript .js
<IfModule mod_expires.c>
ExpiresActive on
ExpiresByType image/jpg "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType text/css "access plus 1 month"
ExpiresByType text/javascript "access plus 1 month"
</IfModule>
<IfModule mod_headers.c>
<filesMatch ".(css|jpg|jpeg|png|gif|js|ico)$">
Header set Cache-Control "max-age=2628000, public"
</filesMatch>
</IfModule>
This helps the browser store static assets like images, stylesheets and javascript files which ultimately makes the webpage load faster in future.
Content Delivery Network (CDN) refers to a group of geographically distributed servers that work together to provide faster delivery of global internet contents like bootstrap stylesheets and scripts, font-awesome stylesheets and font files as well as google fonts. This allows a website to load using such files from the users closest server rather than retrieving them from the server from where the website is being hosted.
When we load the website stylesheets and javascript files unnecessarily in the <header> tag of our HTML page, it prevents the website contents being loaded prior to loading all those stylesheets and javascript files. That's what is called as render blocking stylesheets and javascript files. By default, all those files must be placed below the footer of a page right above the closing </body> tag. Only the styles that are needed to diplay above the fold contents which is the contents that appear on a page prior to scrolling should be placed inside the <header> tag inside a <style> tag. It helps the webpage display those above the fold contents faster and increase overall page loading speed.
All the stylesheets and script files should be minified which will reduce their file size and hence reduce the page loading speed.
Most of the images we add in a website are high quality and that probably means a larger size. But, for a better performing website, these images need to be optimized so that the quality is preserved and the size is reduced as much as possible. You can find a lot of image image optimization tools online but it's been made easier by GTmetrix and Google Page Speed Insights as they do it on their own and let us download and use those images. In this case Google Page Speed Insights has a upper hand on GTmetrics because images optimized by GTmetrics can further be optimized by Google Page Speed Insights.
Server response time is the amount of time taken by a browser to receive a response from the server. According to Google Page Speed Insights a searver's response time should be below 0.2s. If your server response time is still much higher than the time recommended by google page speed insights after all those optimizations, you need to go for a different and dedicated hosting service provider instead of the one you are using.
Leave a comment