Optimizing the loading speed of a website is a very important factor for better search engine rankings. Also it is a basic criterion for every user who browses the internet, everyone wants to visit fast loading websites.
In the case of e-commerce sites either in WordPress or OpenCart, it is a factor that can lead to a large increase in sales.
Image optimization
Most of the times the images uploaded by users are either huge resolution or in wrong format like *.png files.
An easy way to have optimized images is to reduce their resolution to the sizes you really need. Example in an eshop a product image just needs to have a resolution of 1000×1000 pixels to look perfect!
Also important to compress each before uploading to your website. The process can be done in bulk by simply going to tinypng.com where it compresses every image up to 5mb in size up to 3 – 4 times less.
By doing this process, you have definitely changed the loading of your website for the better.
Optimizing the .htaccess file
If you add the following lines to your .htaccess file (located in the public_html or httpdocs folder on your server) you will see an immediate improvement in your website's performance.
Leverage Browser Caching
One of the easiest ways to increase website speed and reduce server load is to leverage browser caching. Browser caching stores resources from your website page on a visitor's computer. This allows the cached copy of the image or other file type to be pulled from the visitor's computer saving bandwidth and server load when they visit another page or return to your site later.
There are two main ways to configure browser caching. The first step is to use ExpiresByType to set the cache time frame for each type. The second is to use the Cache-Control header.
ExpiresByType
To leverage browser caching using this method, you can simply use ExpiresByType followed by the type you want to optimize and the cache time period.
##### Optimize default expiration time - BEGIN ## Enable expiration control ExpiresActive On ## 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/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" ## Font files expiration: 1 week after request ExpiresByType application/x-font-ttf "now plus 1 week" ExpiresByType application/x-font-opentype "now plus 1 week" ExpiresByType application/x-font-woff "now plus 1 week" ExpiresByType font/woff2 "now plus 1 week" ExpiresByType image/svg+xml "now plus 1 week" ## Audio files expiration: 1 month after request ExpiresByType audio/ogg "now plus 1 month" ExpiresByType application/ ogg "now plus 1 month" 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/ mp3 "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" ##### Optimize default expiration time - END
The time frame tells the visitor's browser how long to use the locally cached copy. You can set it to your preferred time. The most common ones are “now + 1 day”, “now + 1 week”, “now + 1 month”, “now + 1 year”.
Cache-Control
The second method is to use the Header directive to declare a custom header.
To set the HTTP Cache-Control header use the code below.
##### 1 Month for most static resources Header set Cache-Control "max-age=2592000, public"
Compress your site
Another way you can speed up your site is to make it smaller. Of course if you can reduce or compress the images, it would be a very good choice.
You can also compress the files you send to each user's browser. This allows your website to transfer less data, faster.
The activation of gzip through the .htaccess file is done with the following code.
##### Compress resources AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/xml AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/javascript /x-javascript ##### Set Header Vary: Accept-Encoding Header append Vary: Accept-Encoding
Both methods of caching and compressing are considered absolutely necessary to see immediate results.