How to improve the performance of your website?
Table of Contents
Optimizing a website in many cases is tightly related to the application itself. However, there are a few issues that might affect most websites be it a WordPress, Joomla! 3.x, Drupal, etc. You may find more details about such common issues and how to resolve them in the article below.
Leverage Browser Caching
What browser caching does is to memorize the resources that the browser has already loaded. When a visitor goes to another page on your website, and the new page is using the same resources as the previously visited pages (e.g. your logo, CSS files, etc.), those do not need to be loaded again.
This means that the browser will not initiate a new connection to fetch these resources, but instead, it will load them from its local cache. This is because the browser already memorized and saved them. This is quite useful for speeding up a website as when you leverage browser caching, the necessary caching files will be stored locally.
Leverage browser caching is by default enabled on all our servers.
Brotli/gZIP compression
Brotli and gZIP decrease the size of the data that is being transferred between your server and your visitors by compressing images, CSS and JavaScript files. When your visitors’ browser receives the compressed elements it decompresses them before rendering. This significantly lowers the size of information that is being transferred lowering the loading times of your website’s pages.
Both Brotli and gZIP are enabled by default for all websites on our servers.
Use the latest available PHP version
Newer PHP versions usually provide many performance improvements and so it is recommended to always use the most recent PHP version for your website. You can easily switch between the available PHP versions from your Site Tools -> Devs -> PHP Manager.
Use Server-Side Caching
Using server-side caching system is also quite important for your website’s performance. We provide server-side caching in three different layers – NGINX Direct Delivery which is for static content such as images, HTML files, etc., Dynamic Cache – for dynamic content such as PHP script and Memcached – for the results of the execution of database queries. You may find more information about our SuperCacher caching tool here.
Optimize Images
Images are an essential part of your website and it is important to have them optimized as much as possible. By a simple resize, compress and optimization of your image files you may decrease your home page’s size significantly, speed up your website and improve your score in online speed testers. There are many plugins and online tools that may help you optimize your images and save you lots of time.
For WordPress you can use the SiteGround Optimizer plugin Image Optimization functionality.
Serve Scaled Images
A scaled image is an image that has been scaled down to match the size in which it is displayed. Avoid using images with higher dimension than you need. This is not efficient due to the fact the browser has to download the large image and then scale it to the necessary size. For example, if you have an image that is displayed 40×40 on your website, there is no need to keep the physical file with dimensions 400×400. Make sure that the file is resized to the dimension that would be displayed.
Defer Parsing of JavaScript
This means that your JavaScript files should be moved from the HEAD part of the HTML to the absolute bottom, just before the closing HTML tag. By doing so, you are allowing all other content to be loaded before the JS files are executed in the browser, which eventually makes your website look faster.
Minify CSS and JS files
Minifying your CSS and JavaScript files means that all the unnecessary data from them like double spaces, empty new lines, comments, etc. will be removed from the files lowering their size. This makes the amount of data that needs to be transferred to the visitors’ browsers less and thus making the website load faster.
For WordPress you can use the SiteGround Optimizer plugin to easily enable automatic minification for CSS and JS elements.
Use Content Delivery Network (CDN)
Loading your content through a CDN would both reduce the load on the server and the loading time of the site. Content delivery networks (CDN) are server networks that clone your site on all of their location nodes. This means that when your visitors request your site, it will be served by the closest server location, rather than the location of your server. We have developed an in-house CDN service for our clients and enabling it on your website is a rather easy process — you just need to enable it through your Site Tools. We also have an article on how to enable CDN here.
Avoid Redirect Chains
A redirect chain occurs when there is more than one redirect between the initial and destination URL. Having more than one redirect between them would additionally slow down the website with the redirects waiting time.
In most cases, such redirect chains occur when there is one redirect from the non-www domain to the www domain (both non-HTTPS), and then another redirect from the non-HTTPS www domain to HTTPS and www. The best course of action here is to combine them and create a single redirect from the non-HTTPS non-www domain (http://domain.com) to the HTTPS www domain (https://www.domain.com).
Avoid HTTP errors
If your website’s page renders a URL resulting in 403, 404, 500, 502 or another HTTP error, that might significantly slow down the website’s overall performance. Your website would try to load the faulty resource for a certain amount of time until an error is finally received as a response. You may check your website for such links using the Network tab of your preferred browser console or by using an online speed testing tool. For example – with GTmetrix you may review those resources in the Waterfall tab and in Pingdom – in the Response codes section.
Avoid Big Homepages
Having a big homepage can impact your website’s loading speed a lot. So make sure to keep only the necessary resources on the page and as mentioned above – use well optimized and scaled images. Another tip for keeping the page optimized is to embed videos from an external source (e.g. YouTube) instead of uploading them to your website.