How to speed up your WordPress site

Fast loading pages not only provide a better user experience, they also improve search rankings. Here are my favorite tactics.

Limit image size

Three factors are the main determinants of image filesize:

  • Image dimensions in pixels
  • Compression type (jpg, gif, png, webp, etc.)
  • Degree of compression

First let’s discuss compression type. The short answer: use JPG for photographic images and PNG for images with large areas of precisely uniform color; this is mainly computer art such as most logos. Read more about compression types here: Choosing between JPG, GIF, PNG, and WEBP for web images. When in doubt, try each. (Be wary of using webp since Safari does not support it.)

The WordPress plugin Imsanity can handle the problem of resizing image dimensions and degree of compression. Once installed, you can configure it for the maximum size image you will allow and for the degree of compression, if JPG. JPG lets you control quality vs. file size. I configure it to leave PNG files as PNG and leave JPG files as JPG, and I trust the author (me) to know when to use each in creating the image before upload.

Be careful of plugins

Some plugins such as Imsanity are only active during editing of web pages and posts. They will not slow down your site. Plugins that control the appearance of pages or monitor user activity risk slowing your pages. Use them only if their value exceeds the price you pay in slower page loading. Use GTmetrix and Pagespeed Insights to monitor the affect of plugins on your page speed.

Compress HTML, CSS, Javascript

The AutoOptimize plugin “minifies” HTML, CSS, and Javascript, reducing wasted characters. Install it and turn it on for all three.

If you have access to CPanel, turn on the Optimize Website application to compress everything. This uses gzip compression for files sent to the visitor’s browser.

Wake Forest users: everyone with a website on sites.wfu.edu has access to CPanel, nicknamed “Dashboard.” Go to sites.wfu.edu, and click Dashboard. Login if requested with your WFU Google Mail credentials. Then look for Optimize Website.

These two compression methods are complementary. Use them both.

Install a website caching plugin

WP-Supercache is another plugin well worth installing. WordPress is a complex program that must to build each web page everytime a visitors hits it. That takes time. WP-Supercache saves a copy of the webpage that was built the last time until you make changes, and it can serve this cached version quickly.

Leverage browser caching

If a web page has not changed since the last time a user visited, then there is no reason to download a new version. Web pages load faster for repeat visitors if the page is saved in the browser cache. However, unless you specify how often a file may change, the browser may not cache it. Here is the way to cache your images and css files. You can add other file types such as html if you are more aggressive. If you are comfortable editing your .htaccess file (and if you know what this means and how to do it), add the following to .htaccess:

#Add expires headers by default
<IfModule mod_expires.c>
  # Turn on the module.
   ExpiresActive on
   # Set the default expiry times.
   ExpiresDefault "access plus 2 days"
   ExpiresByType image/jpg "access plus 1 month"
   ExpiresByType image/gif "access plus 1 month"
   ExpiresByType image/jpeg "access plus 1 month"
   ExpiresByType image/png "access plus 1 month"
   ExpiresByType text/javascript "access plus 1 month"
   ExpiresByType application/javascript "access plus 1 month"
   ExpiresByType application/x-shockwave-flash "access plus 1 month"
   ExpiresByType text/css "now plus 1 month"
   ExpiresByType image/ico "access plus 1 month"
   ExpiresByType image/x-icon "access plus 1 month"
   ExpiresByType text/html "access plus 600 seconds"
</IfModule>

You can deduce what is happening here. I specify long expiry times for images, CSS, and external Javascript files, which I rarely replace, while HTML pages expire in an hour.

Thanks to Steve Stern (@sterndata) at WordPress.org for this tip.

Assessing your page speed

As mentioned earlier, GTmetrix and Pagespeed Insights are great websites to assess the speed of your pages. I encourage you to check these often as you build your site and add plugins.

What are your speed tips?

See also