First, we must understand that the performance of a website can be divided into three areas. Each of these areas affects the speed of the website in different ways.
The basic principles of performance:
- Software: Doing Less Things
- Network: reducing distances
- Hardware: Read and write faster
Surely this is a drastic simplification, but it captures the essence of how optimization should be addressed in each respective field.
Software: may be the easiest to understand
When it comes to programming, optimization tries to make the compiled code work as fast as possible, doing less. Less logical. 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 virtually nothing.
Networking: The network is very different
Rather than doing less, the question is to reduce the time it takes to transfer bytes of information from point A to point B. Again, this is a simplification because the shortest distance is not always the fastest, but what you can do to optimize the networking is to reduce the distances to cut the overall transfer time.
Hardware is different from both software and networking
The goal here is to read and write physical devices faster – especially disks. 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.
TEST THE PERFORMANCE
During the test, it must be remembered that not all things are equal. There are many options and a lot of results.
Sucuri Global Performance Test
This tool helps us to see how quickly a page is loading all over the world. It is oriented to the link time (the speed is returned the first byte) and the total time for each position. This is important because it helps us to evaluate how the rest of the world is seeing a website.
Speed Test Pingdom
This tool helps us to see the performance of each asset load on the site. Activities may include the integration of APIs, images, etc. This detailed information helps us to go into the detail of each page, and allows us to see how the code is loading and what could contribute to performance issues.
These are not perfect tools, but using both together gives us a good view of current performance for a given site.
OPTIMIZE WORDPRESS
As far as I’m concerned, I divide the performance of WordPress into 6 areas that I always take into account when it comes to optimizing the performance of WordPress:
1. Caching
The most incisive change you can make on the site performance is to allow some form of caching.
When a visitor or “request” arrives at the server, WordPress performs a series of actions to load code, resources, plugins, themes, media and content. Each action has a certain latency in the process. Multiply this by hundreds of requests and you’re immediately in trouble as far as performance is concerned.
Caching allows the website to save the instances of these actions in a file that can be easily accessed and used following the next request. This reduces all the work WordPress has to do on each request. If your site has 100 feature requests on the same page, why should each request initiate a series of actions? Caching makes sure that, after the first request, the remaining 99 requests get a much faster response from the cached content.
The advantages of caching are exponential. Not only does this save local resources on the web server (which allows you to do better) but it also improves the user experience, as you don’t have to wait.
Caching can be done at the application level using a plugin such as WP Super-Cache or in the cloud via a content distribution network (CDN). There is nothing wrong with using them in combination. In most cases, CDNs are preferable because they allow website owners more granular control over the type of caching available.
2. Less Add-Ons
Only run the plugins you really need. Remove any unused plugins, tests, debugging or plug-ins rather than leaving them installed and disabled. Remember, when WordPress loads it will parse the list of plugins and themes. The less things you load, the faster your site will be. This is not only for performance, but also for security. Less code means less potential vulnerabilities.
3. Fewer scripts.
We live in the age of pixel tracking (e.g. scripts). Almost every new marketing solution has a new pixel and these integrations help us to better understand how the site is visited. However, each new tracker negatively affects the performance of the site.
If you use the Pingdom tool, you can see exactly how each tracking pixel affects overall performance. The main reason for this is that you add more pieces for the browser to load, including new DNS requests, HTTP requests and other code to be analyzed for the browser.
4. Cached headers
This goes hand in hand with resource caching, but this deserves its own explanation. If you set the appropriate cache headers on your site (Expire, Etag, and Cache-Control) this will minimize the number of requests to your site and users can simply re-use the content stored in their local browser cache.
Most common browsers (i.e., Chrome, Firefox) have an HTTP cache implementation available. This means that if a server responds with the right HTTP header directives, the local browser will recognize and store the results. This means that when the user is browsing the site, they will be seeing the cache that has already been stored locally instead of making more requests for the application (and web server).
This can be done with the W3TC caching plugin (in Performance> Browser Cache). If you have access to the server, you can also do so via the .htaccess file. For those using Nginx, you can do it with:
location ~* \.(jpg|jpeg|png|gif|ico|css|js)$ {
expires 10d;
}
This fragment of code tells the local browser to cache static resources for 10 days.
5. Compression
Compression helps in network and hardware areas. A compressed (smaller) page will be read faster from the disks and transferred to the browser. Compressed files allow the web server to respond with a much smaller file, which reaches its destination much faster, providing a better user experience. The most common form of compression today is Gzip.
There are a number of configuration and compression options for the server, so look for the specific instance and distribute it accordingly. If you use 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 advisable to compress images (with gzip) as they are generally already compressed and the gain is marginal.
6. Optimize images
Working with images can be hard, but it is important to pay special attention to the images in use on the site. An image that is 10MBs will load much slower than the one that has been compressed to 100KBs.
Compression to optimize images for the web is a complete topic, so we invite you to devote some time to research.
In WordPress, you might want to look at the Imsanity plugin that helps you resize large images in uploads. Another interesting option for websites with heavy images is a specific CDN like Photon.
WEB SERVER OPTIMIZATION
Once WordPress is properly configured, we can also consider Apache optimization (the most common software used for web servers). We can optimize the performance of WordPress by focusing here as well. Unfortunately, if you are on a shared or managed server you will not be able to do these things yourself (hopefully your host has already done so).
Apache is very simple to configure, but a couple of changes are able to optimize performance.
1. Activate Keep Alive
Every time you visit a site, the browser starts handshaking (3-way) networking with the web server. If you visit one page and it contains ten images, you need to complete the 3-way handshake 11 times.
However, if you activate Keep Alive, your browser will only shake hands once and reuse the same session to download all the files of others. As mentioned above: less things = faster software. Activating keep alive also significantly reduces the number of network packets transferred.
To do this, open httpd.conf and add:
KeepAlive only
2. Disable DNS Lookups
This directive adds latency for each individual request made to the web server because it forces a DNS search before the request is terminated. In Apache 1.3 this setting is default to off, but it is always good to check. You can find this in the httpd.conf file, so, search or add this line:
HostnameLookups off
HARDWARE AND NETWORKING
We will not deal in depth with network and hardware as they are heavily dependent on hosts and ISPs. Few offer any control over this domain. However, there are some guidelines that we will suggest:
Leverage SSD Drive
If you have the option to choose SSD disks, do so. Most new servers come with defaults, but must be specified in the ordering process. During hardware optimization, the goal is to focus on how to read and write, making it faster where possible, SSD helps to achieve this goal, as they are much faster and more reliable than HDDs.
Take advantage of a CDN
In addition to caching common resources, CDNs allow you to optimize the network aspect by shortening the distance between a site and its visitors. The Sucuri Firewall includes an Anycast CDN, with many points of presence.
Disable all unnecessary services from the web server and keep only the pieces needed to keep your site running. Too often server performance is slowed down as resources are consumed by other applications (such as mail servers.)