Since launching our website performance testing tool we have been getting a lot of questions about how to improve the speed and performance of WordPress websites. Many website owners are not aware how slow their sites are, so we are excited to help shed some light on the matter.
There are a number of different resources available to help you dive into the world of performance optimization. In this article, I want to create a proper foundation for any website owner to start thinking about performance optimization.
This basic guide should help website owners understand how to think about performance and which areas to focus on. This information is designed as a high-level overview, but it is structured so that if you were interested in more data, you can follow the links provided for additional research, details, and tutorials online that help you optimize your website at every layer.
Performance – Core Domains
First, we have to understand that website performance can be divided into three domains. These areas each affect the speed of your website in different ways.
The basic performance principles for each domain can be delineated as follows:
- Networking: Reduce distances
- Software: Do less things
- Hardware: Read and write faster
While this is a drastic oversimplification, it captures the essence of how optimization should be approached in each respective domain.
Software may be the simplest to understand. When it comes to programming, optimization attempts to make the compiled code run faster by doing less things. Less logic. Less code to process. The more optimized a piece of code is, the fewer instructions it takes to complete a given task. As a result, the software will run faster. The secret to making an application fast is to make it do practically nothing.
Networking is fundamentally different. Rather than doing less, it’s about reducing the time it takes to transfer bytes of information from point A to point B. Again, this is an oversimplification because the shortest distance is not always the fastest, but most networking optimization you can do at that level is about reducing distances to cut the overall transfer time.
Hardware is different from both the software and networking, where the here goal is to read and write faster to physical devices – specially disks and cards. This is an area that most webmasters do not have the ability to customize (outside their host server), as most of the hardware is in the cloud. We will talk a bit about it at the end as well.
Testing Performance
When testing your site, remember that not all things are created equal. There are multitude of options, but you won’t always be comparing apples to apples. A lot of the results and responses are relative in nature.
Here at Sucuri, we have two tools we use regularly when working with customers.
- Sucuri Global Performance Test: This tool helps us see how fast a page is loading around the globe. It looks at the connection time (how fast the first byte is returned) and the total time for each location. This is important because it helps us asses how the rest of the world is seeing a website.
- Pingdom Website Speed Test: This tool helps us see the performance of every asset loading on the site. Assets might include integration of API’s, images, etc. This detailed information helps drill into each page, allowing us to see how code is loading and what might be contributing to performance issues.
These are not perfect tools, but using both together gives us a good view of the current performance for any given site.
Optimizing WordPress
I want to focus on WordPress as it’s the most popular CMS platform on the market, and we get most of our questions from this community.
WordPress is an open-source piece of software that runs on PHP, which runs on top of your web server software (e.g., Apache, NGINX, etc.). Recall how we optimize software? We make it do less things.
For me, I divide WordPress performance into 6 areas that are readily at my disposal when thinking about WordPress performance optimization:
1. Caching.
The most impactful change you can make on website performance is to enable some form of caching.
When a visitor or “request” comes to the server, WordPress performs a series of actions to load code, resources, plugins, themes, media and content. Each action introduces some latency to the process. Multiple this by hundreds of requests and you quickly find yourself in trouble as it pertains to performance.
Caching allows your website to save instances of these actions in a file that can be readily accessible for later use on the next request. This cuts down all the work WordPress has to do on every request. If your site has 100 requests to the same feature page, why should each request initiate a series of actions? Caching makes it so that after the first request, the remaining 99 requests get a much faster responses from the already cached content.
The benefits of caching are exponential. Not only does this save local resources on your web server (enabling it to perform better) it also improves customer experience when they don’t have to wait.
Caching can be achieved at the application level using a plugin like WP Super-Cache or in the cloud via a Content Distribution Network (CDN) – like we do with the Sucuri Firewall. There is nothing wrong with using both in conjunction with one another. In most instances, CDNs are preferable because they empower website owners with more granular control over the type of caching available. For instance, via the Sucuri Firewall we enable page caching by default for WordPress without breaking wp-admin, comments and other dynamic elements of WordPress.
2. Less Add-Ons.
Only run the plugins you really need to get your site running. Remove any unused, testing, or debugging plugin rather than leaving them installed and disabled. Remember, when WordPress loads it’ll go through the list of plugins and themes. The less things to load, the faster your site will be. This is not only for performance, but for security as well. Less code means less potential vulnerabilities.
3. Less Scripts.
We live in the age of tracking pixels (ie. scripts). Almost every new marketing solution has a new pixel and these integrations help us better understand attribution for each initiative. However, every new tracker will adversely affect the performance of your site.
If you use the Pingdom tool we mentioned earlier, you can see exactly how each tracking pixel affects your overall performance. The main reason for that is that it adds more pieces for your browser to load, including new DNS requests, HTTP requests and more code for your browser to parse.
4. Caching Headers.
This point goes hand in hand with the first on resource caching, but this deserves its own explanation. If you set the proper caching headers on your site (Expire, Etag, and Cache-Control) it will minimize the number of requests to your site as users will simply re-use the content that’s stored in their local browser cache.
Most common browsers (i.e., Chrome, Firefox) ship with an implementation of HTTP cache. This means that if a server responds with the right HTTP header directives, the local browser will acknowledge and store the results. This means when the user is navigating the site, they will be seeing the cache that was already stored locally instead of making multiple requests to your application (and web server).
This can be done with the W3TC caching plugin (under Performance > Browser Cache). If you have server access, you can also do this via the .htaccess file. For those using Nginx, you can do that with:
location ~* \.(jpg|jpeg|png|gif|ico|css|js)$ { expires 10d; }
This snippet tells the local browser to cache static resources for 10 days.
5. Compression.
Compression helps with the networking and hardware domains. A compressed (smaller) page will be faster to read from your disks and transfer to the browser. Compressed files allow your web server to respond with a much smaller file, which reaches the destination a lot faster, providing for a better experience for your user. The most common form of compression today is Gzip.
There are a number of server configuration and options for compression, so look for your specific instance and deploy accordingly. If using nginx add the following to nginx.conf:
gzip on; gzip_disable "msie6"; gzip_types text/plain text/css application/x-javascript text/javascript application/javascript;
It is not recommended that you compress (gzip) images as they are generally already compressed and gain is marginal. More on that in a moment.
6. Optimize Images.
Working with images can be tough, but it’s important to pay special attention to the images being used on the site. We have made this mistake in the past. An image that is 10oMBs is going to load much slower than one that has been compressed to 100KBs.
Compressing and optimizing images for the web is a comprehensive topic, so we encourage you to spend some time researching. There is a great article by Google about their recommendations for optimizing image for the web, including vector and raster images, and when to use each. They also speak to using web fonts in the place of encoded texts, using CSS3 effects where possible. The goal is to retain to the quality of the image while reducing the overall size.
In WordPress, you might want to look at the Imsanity plugin which helps resize large images on upload. Another interesting option for image-heavy websites is an image-specific CDN’s like Photon.
Optimizing Your Web Server
Once WordPress is configured properly, we can also look into optimizing Apache (the most common software used for web servers). We can optimize WordPress performance by focusing here as well. Unfortunately, if you’re on a shared or managed server you won’t be able to do these things yourself (hopefully your host already did).
Apache is very simple to configure, but a few tweaks can better optimize the performance.
1. Enable Keep Alive.
Any time you visit a site, your browser starts the networking (3-way) handshake with the web server. If you visit one page and it contains ten images, you have to complete the 3-way handshake 11 times.
However, if you enable Keep Alive, your browser will only do the handshake once and reuse the same session to download all others files. As stated above: less things = faster software. Enabling keep alive also significantly reduces the number of network packets going back and forth.
To do this open your httpd.conf and add:
KeepAlive Only
2. Disable DNS Lookups.
This directive adds latency to every single request made to your webserver because it forces a DNS lookup before the request is finished. In Apache 1.3 this setting default to off, but it always good to verify. You can find this in your httpd.conf file as well, search or add this line:
HostnameLookups off
If you’re interested in more Apache specific tips, spend some time on the Apache Performance Tunning page.
Hardware & Networking
We won’t really dive into Networking and Hardware optimizations as they are heavily dependent on your host and ISPs. Few offer any control over this domain. There are however a few guidelines that we will suggest:
- Leverage SSD drives. If you have the option to choose SSD disks, do it. Most new servers come with it by default, but it has to be specified in the ordering process. When optimizing hardware, the goal is to focus on how it reads and writes, making that faster where possible, SSD helps achieve that goal, as they are much faster and more reliable than HDD.
- Leverage a CDN. In addition to caching common resources, CDNs help you optimize the networking aspect by shortening the distance between a site and its visitors. The Sucuri Firewall includes a Anycast CDN if you want to try it out, with many points of presence including our recent addition in Tokyo.
- Single purpose servers. Remember the “do less things” discussion? The less services running on your server the better. Disable all unnecessary services from your web server and keep only the required pieces to keep your site running. Too often the performance hits from servers whose resources are being consumed by other applications (i.e., mail servers.)
Performance and Security
While we didn’t originally set out to be in the performance domain, it became a prerequisite for us to accomplish our goals with a cloud-based WAF. As such, we’ve embraced it fully.
What really excites me is that most of the performance recommendations outlined here are dual purpose – they also help secure sites by improving the webmasters overall security posture.
The same way that making software do less things will make it run faster, the idea of reduction and isolation often makes applications more secure. Reducing your overall attack surface reduces the possible entry points for exploits. Uptime guarantees and website availability can also be considered part of website security. If you disable all unnecessary services, unused plugins, trackers and keep a lean server, it will be a lot harder to compromise.
We hope that this guide has been helpful to give you a basic understanding of how website performance works from all three aspects. If you want specific tips we recommend this WPBeginner article on WordPress performance.