WordPress website page load speed optimization
When we talk about any website first thing that we consider is UI/UX design and the second is how fast the site loads. Then only we dig into features and services of the website.
Specially for people with shared hosting speed is the most important feature. In web development process, web page speed optimization matters a lot. Talking from search engine point of view the slower site decrease the search engine raking also. To be an optimized site for search engines, page speed has to be considered.
Here we will be discussing some basic things about site loading speed optimization using .htaccess file. Though there are a lot of factors that affect the loading speed of site, below are basic factors that help boost speed of any site.
- Compressing site resources
- Leveraging browser caching
- Keeping connection alive
- Reducing HTTP requests
What is .htaccess file?
.htaccess stands for “hypertext access”. It is a small text file that controls many aspects of webpage display. Generally it is located in the root directory of the website. Each folder also can have one .htacess file. By default it is hidden. But web host provides an option to see hidden files. For optimizing purpose we use the one that is in the root directory. Activities like redirects, enabling compression, rewriting URLs, leveraging browser caching and more can be accomplished by adding some code to this file. For your information even a small mistake while updating this file can make the site down. To be in safe side, before editing this file make sure to keep a backup copy.
How to compress site resources to increase page loading speed?
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_exclude mime ^image/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
# End compress site resources
Leveraging browser cache
Each time user visits a webpage, browser download the resources and cached in local machine. Leveraging means, next time when the user request the same resources then the cached resources are shown. This makes the page load faster for the second time. To liverage browser caching add below code at the top of the .htaccess file and save.
ExpiresByType image/jpg “access 1 year”
ExpiresByType image/jpeg “access 1 year”
ExpiresByType image/gif “access 1 year”
ExpiresByType image/png “access 1 year”
ExpiresByType text/css “access 1 month”
ExpiresByType text/html “access 1 month”
ExpiresByType application/pdf “access 1 month”
ExpiresByType application/x-shockwave-flash “access 1 month”
ExpiresByType image/x-icon “access 1 year”
ExpiresDefault “access 1 month”
# EXPIRES CACHING
Keeping Connection alive
It refers to the conversation between the web server and web browser. Also known as persistant connection, it allows the same TCP connection for HTTP conversation instead of openinng new conversation with new request so the same conversation grabs just more than one file at a time. Simply by adding below code in .htaccess file you can enable keep-alive connection.
<ifModule mod_headers.c> Header set Connection keep-alive </ifModule>
# Keep connection alive
Reducing HTTP requests
- Using less CSS file. We can combine CSS to one and decrease HTTP request.
- Using image sprites. Instead of using individual images like for icons and other small image. We can create single image sprite and use it with CSS. This helps to decrease the number of images hence the HTTP request.