WP Optimisation

One of the very first things you should do when hosting your WordPress site is to determine where the majority of your visitors or customers are coming from. Why is this important? Because the location at which you host your website plays a significant factor in determining your overall network latency and TTFB. It also impacts your SFTP speeds and WordPress admin dashboard responsiveness.

Network Latency: This refers to the time and or delay that is involved in the transmission of data over a network. In other words, how long it takes for a packet of data to go from one point to another. Nowadays this is typically measured in milliseconds; however, it could be seconds depending upon the network. The closer to zero the better.

TTFB: This stands for time to first byte. To put it simply, this is a measurement of how long the browser has to wait before receiving its first byte of data from the server. The longer it takes to get that data, the longer it takes to display your page. Again, the closer to zero the better.

you need to know is that you want your network latency and TTFB to be as low as possible. One of the easiest ways to accomplish this is to choose a server closest to your visitors. You can determine the best location by following the tips below.

• Check the Geolocation of Your Visitors in Google Analytics
• Do a Quick Latency Test

Shared Hosting Vs Cloud Hosting Vs VPS Vs Dedicated Hosting

www.hostgator.com/cloud-hosting

tmdhosting.com/cloud-hosting

PHP 7 or Higher for the Best Performance

PHP is an open-source, server-side scripting and programming language that’s primarily used for web development. The bulk of the core WordPress software is written in PHP, along with your plugins and themes, which makes PHP a very important language for the WordPress community. You should ensure your WordPress host offers at least PHP 7 or higher.

There are different versions of PHP that your host will provide you on your server, with the newer PHP 7.3 offering huge performance improvements.

if you compare PHP 7.3 to PHP 5.6, it can handle 3x as many requests (transactions) per second! PHP 7.3 is also on average 9% faster than PHP 7.2. This can also impact your WordPress admin dashboard responsiveness.

WordPress 5.0 PHP benchmarks

Pick a Host That Uses NGINX

Behind the scenes, every WordPress host uses a web server to power your WordPress sites. The most common choices are NGINX and Apache.

We strongly recommend going with a host that uses NGINX because of its roots in performance optimization under scale. NGINX often outperforms other popular web servers in benchmark tests, especially in situations with static content or high concurrent requests, which is why Kinsta uses NGINX.

Faster speeds plus improved security, is why Kinsta always offers the most recent versions of PHP. You can change PHP versions with a single click.

Your Host’s Network Matters

When choosing a WordPress host you might not even think to ask or research into what network they’re using, but you should. The network can have a huge impact on your site’s performance and even the snappiness of your WordPress dashboard. Many hosts will leave this out of their marketing as they’ll opt for the cheapest network to cut costs.

Whenever someone lands on your site, their web browser “requests” (short for HTTP request) a list of files that are needed to “build” the page in your visitor’s browser. These requests include HTML, CSS, images, etc. And they even include external files and scripts, like your Google Analytics tracking code.

You saw an example of all these requests in the waterfall above (when you learned how to suss out slow plugins).

While each request can take different amounts of time, a good general rule is that more HTTP requests equals a slower website.

This is why tools like Pingdom and GTmetrix put the number of requests at your site front and center:

While some of the stuff that we’ve discussed – like using Autoptimize for concatenation – will help you reduce the number of requests at your WordPress site, you can also take things further with a more manual approach.

I don’t want to get too deep here because a full discussion takes a post of its own. But some quick wins for most WordPress sites are:

• Not using Google Fonts
• Disabling Font Awesome
• Turning off Gravatars

For example, to turn off Google Fonts and Font Awesome in your Elementor designs, you can add these two code snippets to a plugin like Code Snippets or your child theme:

add_filter( 'elementor/frontend/print_google_fonts', '__return_false' );
add_action( 'wp_enqueue_scripts', function() { wp_dequeue_style( 'font-awesome' ); }, 50 );

80% of the end-user response time is spent on the front-end. Most of this time is tied up in downloading all the components in the page: images, stylesheets, scripts, Flash, etc. Reducing the number of components in turn reduces the number of HTTP requests required to render the page. This is the key to faster pages.

One way to reduce the number of components in the page is to simplify the page's design. But is there a way to build pages with richer content while also achieving fast response times? Here are some techniques for reducing the number of HTTP requests, while still supporting rich page designs.

Combined files are a way to reduce the number of HTTP requests by combining all scripts into a single script, and similarly combining all CSS into a single stylesheet. Combining files is more challenging when the scripts and stylesheets vary from page to page, but making this part of your release process improves response times.

CSS Sprites are the preferred method for reducing the number of image requests. Combine your background images into a single image and use the CSS background-image and background-position properties to display the desired image segment.

Image maps combine multiple images into a single image. The overall size is about the same, but reducing the number of HTTP requests speeds up the page. Image maps only work if the images are contiguous in the page, such as a navigation bar. Defining the coordinates of image maps can be tedious and error prone. Using image maps for navigation is not accessible too, so it's not recommended.

Inline images use the data: URL scheme to embed the image data in the actual page. This can increase the size of your HTML document. Combining inline images into your (cached) stylesheets is a way to reduce HTTP requests and avoid increasing the size of your pages. Inline images are not yet supported across all major browsers.

Reducing the number of HTTP requests in your page is the place to start. This is the most important guideline for improving performance for first time visitors. As described in Tenni Theurer's blog post Browser Cache Usage - Exposed!, 40-60% of daily visitors to your site come in with an empty cache. Making your page fast for these first time visitors is key to a better user experience.

There are two different types of content delivery networks:

1. Traditional Pull CDN
2. Reverse Proxy CDN

Traditional pull CDNs cache a copy of all of your content and media, but a request from the client is still made directly to your hosting provider. KeyCDN and CDN77 are examples of traditional CDNs.

A reverse proxy CDN is slightly different. While it still acts likes a CDN, it intercepts all incoming requests and acts as an intermediary server between the client and your host. Cloudflare and Sucuri are examples of reverse proxy CDNs. This is one reason why you have to point your DNS directly to these providers instead of your host.

Additional CDN Optimizations

Here are a few additional CDN optimizations you might want to check out or think about.

• If you have a lot of comments, gravatars can generate a lot of requests. They load from secure.gravatar.com. Check out this tutorial on how to load gravatars from your CDN instead. We do this on the Kinsta website. 👍
• You can host your custom web fonts from your CDN or even Google fonts on your CDN. Check out our in-depth tutorial on local fonts.
• Make sure to load your favicon from your CDN. Even though it’s small, every request counts!

Pros:

1. Different domains
Browsers limit the number of concurrent connections (file downloads) to a single domain. Most permit four active connections so the fifth download is blocked until one of the previous files has been fully retrieved. You can often see this limit in action when downloading many large files from the same site.

CDN files are hosted on a different domain. In effect, a single CDN permits the browser to download a further four files at the same time.

2. Files may be pre-cached
jQuery is ubiquitous on the web. There’s a high probability that someone visiting your pages has already visited a site using the Google CDN. Therefore, the file has already been cached by your browser and won’t need to be downloaded again.

3. High-capacity infrastructures
You may have great hosting but I bet it doesn’t have the capacity or scalability offered by Google, Microsoft or Yahoo. The better CDNs offer higher availability, lower network latency and lower packet loss.

4. Distributed data centers
If your main web server is based in Dallas, users from Europe or Asia must make a number of trans-continental electronic hops when they access your files. Many CDNs provide localized data centers which are closer to the user and result in faster downloads.

5. Built-in version control
It’s usually possible to link to a specific version of a CSS file or JavaScript library. You can often request the “latest” version if required.

6. Usage analytics
Many commercial CDNs provide file usage reports since they generally charge per byte. Those reports can supplement your own website analytics and, in some cases, may offer a better impression of video views and downloads.

7. Boosts performance and saves money
A CDN can distribute the load, save bandwidth, boost performance and reduce your existing hosting costs — often for free.

Cons:

1. Additional complexity

A link to a CDN file won’t work if you’re developing offline. That’s rarely an issue, but some developers have temperamental internet connections or need to work on the move.

You also likely to require a build process or manual intervention when deploying your site to a live server. It will be necessary to CDN-ize local links to JavaScript libraries and other assets. It could become complicated if you’re using a service such as Amazon S3 to host some resources but not others.

2. Files may not be optimized
Consider a modular library such as Modernizr or YUI. Free CDN-hosted files are available but they generally provide all the common functionality within a large package that may exceed several hundred Kb.

If you just require a few features, you can use your own specialized versions and merge all CSS and JavaScript files to invoke fewer HTTP requests. The result is smaller files which download quicker and execute faster — especially on mobile devices.

That said, you could upload optimized files to a private CDN but you would need to consider the additional effort and cost that would incur.

3. There are no pre-caching guarantees
While there’s a higher probability a popular CDN file has been pre-cached, it’s not a given. In particular, mobile devices tend to have small and fairly inefficient caches. The advantages may be negligible, especially if you can host a smaller file on your local server.

4. Blocked access
We live in a world with geographic, legal, political, and commercial boundaries. It’s not uncommon for organizations or whole countries to block the domains or IP address of popular free CDN services.

Similarly, companies such as Google and Microsoft must adhere with US export laws. There are known restrictions on use of data in Cuba, Iran, North Korea, Sudan and Syria. The list of blocked countries can change on the whim of any government.

5. Two points of failure
It’s catastrophic when your site goes down and, despite a good reliability record, CDNs aren’t infallible. There’s little you can do but wait for the service to resume.

It would be possible to use a CDN and fall-back to local files if the service isn’t available. It’s a solution which provides a good level of redundancy — at the expense of further development and complexity.

6. Security
If security is a major concern, don’t use a public CDN. When a remote file is called, information about the referrer is also sent. Remotely-hosted JavaScript libraries are particularly risky since the code could be modified to collect data about your users or systems.

Similarly, your CDN options will be more limited if you require HTTPS.

7. Loss of control
Are you happy handing control of website files to Google, Microsoft, Amazon or any other large web company? Are you concerned they’re collating information about your website and systems? Do those companies have too much control over the net? Perhaps it’s paranoia, but you have a reason to be paranoid when everyone’s out to exploit you!

developer.wordpress.com/docs/photon/

Photon is an image acceleration and modification service for Jetpack-connected WordPress sites. Converted images are cached automatically and served from the WordPress.com CDN. Images can be cropped, resized, and filtered by using a simple API controlled by GET query arguments.

statically.io/wordpress

Minimize CSS and javascript, optimize and add transformation capabilities to images, cache and deliver quickly.

Cloudflare

What is CloudFlare ? | How To Convert HTTP websites into HTTPS for FREE | Configure CloudFlare CDN - by Sid Talk

how you can create account in cloudflare & how CloudFlare can help you to get Free SSL certificate to convert your HTTP website into HTTPS free of cost. CloudFlare can also help you to provide global CDN (Content Delivery Network) for free

How To Setup CloudFlare to Your Website 2019 - by BM Tech Tips

How to Use Cloudflare to Improve the Speed & Security of WordPress Websites - Cloudflare 2018

Video Tuts of Cloudflare and W3Total Cache by Nayyar Shaikh

Must Use Page Rules for Everyone - by Cloudflare

Adding Dynamic caching to your WordPress site will have great effect on its speed. There are many services like Varnish and APC that can be used but all of them require a lot of server configuration and tweaking of your application to work correctly. This is why, we at SiteGround have created a tool called the SuperCacher. With it, all you need to do is install a small plugin and enable the Dynamic caching with a single click. For more information on how to use it, please check out siteground SuperCacher Tutorial.

• Page cache: it happens on the server and stores the entire HTML of a page (as WP Rocket does);
• Browser cache: it keeps storing the HTML but occurs on the browser;
• Object cache: it stores database queries;
• Bytecode cache: it’s a PHP extension and stores precompiled script bytecode in the memory;
• CDN cache: it occurs on the CDN-side and stores the HTML and all other static files (images, CSS and JS);
• Reverse proxy cache: it happens on the server’s side and stores all its responses to the client’s server.

wp-rocket.me (Premium Only)

W3 Total Cache By Frederick Townes

WP Super Cache By Automattic

WP Fastest Cache By Emre Vona

Cache Enabler - WordPress Cache By KeyCDN

LiteSpeed Cache By LiteSpeed Technologies(For Litespeed servers only)

WP-Optimize – Clean, Compress, Cache. By David Anderson, Ruhani Rabin, Team Updraft

Autoptimize By Frank Goossens (futtta)

Hummingbird � Speed Optimize, Cache, Minify & Defer Critical CSS/Javascript

Asset Cleanup Pro

wordpress.org/plugins/nitropack/

perfmatters.io

nitropack.io

Introduction to Varnish

Proxy Cache Purge By Mika Epstein

This plugin does not install nor configure a cache proxy. It acts as an interface with such services.

If you are using web browser that supports HTTP/2 I guarantee you can see HTTPS is way faster than HTTP. The difference increases when you refresh that page because of the session resumption feature of HTTP/2. There is also a benchmark on the official Go website: https://http2.golang.org/gophertiles. In this page, you might see a different kind of test. Like the first one, you can see HTTPS is way faster as well. Right, these tests in real are not about HTTP vs HTTPS, it is HTTP/1.1 vs HTTP/2. However, please be reminded that on every web browser, HTTP/2 is ONLY supported on the top of SSL/TLS.

HTTPS is faster than HTTP- Article by Snowball.digital

HTTP/2 - SiteGround

Let’s Encrypt - SiteGround

Images are essential part of every website. It is important to have them optimized. There are few things regarding your images that you should have in mind when developing your WordPress site:

• Use images with the proper size. Do not upload big images and then scale them with HTML. Make sure that your photos and other images are not bigger than the size you're actually displaying them in.
• If possible, use Sprites for your themes. Using sprites is a CSS technique that uses a single image to show multiple design elements on your pages. This way instead of loading dozens of small images (making http requests each time), your site will open a single one. Sprites, however, must be considered when the theme is designed. So always look for themes that utilize sprites.

tinypng.com - Image Optimization

tinyjpg.com - Image Optimization

Imagify – WebP & Image Compression and Optimization - by WP Media

Smush Image Optimization, Compression, and Lazy Load By WPMU DEV

EWWW Image Optimizer By Exactly WWW

Image optimization & Lazy Load by Optimole By Optimole

ShortPixel Image Optimizer By ShortPixel

shortpixel.com/pricing-one-time

wordpress.org/plugins/shortpixel-adaptive-images/

Shortpixel Image Optimizer vs Shortpixel Adaptive Images

Video Tuts by WPLearningLab - Dec 17, 2019

wordpress.org/plugins/media-cleaner/

Media Cleaner cleans your Media Library from the media entries (and files) which aren�t used in your website, as well as broken entries. An internal trash allows you to make sure everything works properly before deleting the media entries (and files) permanently. It uses a smart analysis powered by many implementations for specific plugins and themes.

wordpress.org/plugins/wps-cleaner/

The WPS Cleaner plugin allows you to clean up: posts, comments, terms, options, extensions, themes, media and files. Each with their own tab and cleaning options.

remove-unused-image-media-sizes-wordpress-theme/

An Article by wpbeaches.com

Lazy loading images means loading images on websites asynchronously � that is, after the above-the-fold content is fully loaded, or even conditionally, only when they appear in the browser's viewport. This means that if users don't scroll all the way down, images placed at the bottom of the page won't even be loaded

wordpress.org/plugins/a3-lazy-load/

Five Techniques to Lazy Load Images for Website Performance

by Sitepoint

github.com/verlok/vanilla-lazyload

wordpress.org/plugins/a3-lazy-load/

web.dev/lazy-loading-video/

www.cssscript.com/lazy-load-youtube-video-llyv/

Ensure text remains visible during webfont load

web.dev/font-display/

Preload web fonts to improve loading speed

https://web.dev/codelab-preload-web-fonts/

web.dev/extract-critical-css/

web.dev/render-blocking-resources/

Browsers have to build a DOM tree by parsing HTML before they can render a page. If your browser encounters a script during this process, it has to stop and execute it before it can continue. 

Google suggests avoiding and minimizing the use of blocking JavaScript.

How to Defer Parsing of JavaScript in WordPress

An article by hostinger.co.uk

wordpress.org/plugins/async-javascript/

wordpress.org/plugins/flying-scripts/

Paste the code in functions.php

  function defer_parsing_of_js( $url ) {
  if ( is_user_logged_in() ) return $url; //don't break WP Admin
  if ( FALSE === strpos( $url, '.js' ) ) return $url;
  if ( strpos( $url, 'jquery.js' ) ) return $url;
  return str_replace( ' src', ' defer src', $url );
  }
  add_filter( 'script_loader_tag', 'defer_parsing_of_js', 10 );
  

Minification and combination are two techniques with one purpose - to reduce the size and number of JavaScript and CSS files that your site loads. Minification strips all unnecessary symbols by removing precious bites from being loaded every time you request an URL.

Combination on the other hand, combines multiple JavaScript and CSS files into one. This reduces the number of requests your site makes. There are a few plugins that do this really well. Either WP Rocket, a premium option or WP Super Minify, a good free plugin, can do the job.

cssminifier.com

developers.google.com/closure/compiler

www.crockford.com/jsmin

jscompress.com

Remove unused JavaScript

Find Unused JavaScript And CSS Code With The Coverage Tab In Chrome DevTools

How to remove unused CSS & JS | Increase website speed 2x

Video Tuts by Technical Academy - June 21, 2020

wordpress.org/plugins/wp-asset-clean-up/

How to Remove CSS From Your Wordpress Website - Removing Emoji CSS from WordPress

Video Tuts by Joshua Herbison - Nov 4, 2019

keycdn.com/blog/remove-unused-css

purifycss.online/

Eliminate render-blocking resources

Remove unused code

The concept of Code-splitting is to split the code into separate bundles, and dynamically load them only when you need it.

There are a few ways you can look at code splitting, you can: split code based on URL routes, so you don’t have to load the code for page 2 on Page 1. Or you can split the large code style.css into multiple files and inject the required files into the respective pages.

Splitting files seems easy, but figuring out which page uses which elements is extremely difficult in WordPress. It’s because all other plugins or custom HTML elements might be using them.

To decrease the size of data that's being transferred between your server and your visitors, you can enable the gZIP compression for your images, CSS and JavaScript files. By doing this, the web server will compress (like creating a ZIP file for example) this content before it's transferred over the Internet to your browser. On the other side, the browser decompresses the content before rendering it. This significantly lowers the size of information that's being transferred lowering the loading times of your website's pages.

The easiest way to enable the gZIP compression for your images, CSS and JS files is to add these lines to your .htaccess file in the root WordPress folder:

## ENABLE GZIP COMPRESSION ##
<IfModule mod_deflate.c>
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
AddOutputFilterByType DEFLATE application/x-javascript
</IfModule>
## ENABLE GZIP COMPRESSION ##

From Plugin example:

Leveraging the browser caching means that you can specify for how long your visitors' browsers should cache your images, CSS, JS and flash files. However, if any of those resources is cached, your server will notify the visitor's browser and the cached content will be replaced with the new one. You can add the following lines to the .htaccess file of your WordPress in order to enable this technique.

  ## LEVERAGE BROWSER CACHING ##
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access 1 year"
ExpiresByType image/jpeg "access 1 year"
ExpiresByType image/gif "access 1 year"
ExpiresByType image/png "access 1 year"
ExpiresByType text/css "access 1 month"
ExpiresByType application/pdf "access 1 month"
ExpiresByType application/x-javascript "access 1 month"
ExpiresByType application/javascript "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresDefault "access 2 days"
</IfModule>
## LEVERAGE BROWSER CACHING ##
  

<filesMatch ".(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
Header set Cache-Control "max-age=84600, public"

How to Add mod_expires to your .htaccess

Leverage Browser Caching In WordPress

Leverage Browser Caching for 3rd Party JavaScript

PageSpeed Insights 99/100 because of Google Analytics - How can I cache GA?

Avoid a Character Set in the Meta Tag

Video and audio assets tend to be much heavier than images. Although your website might not use as many of them, they can still cause serious issues for your site speed if you don’t add them to a page wisely.

Unlike images that can be uploaded as media, all video and audio files should be stored on an external drive.

One of the most common ways to do this is to upload videos to YouTube or Vimeo and them embed with a shortcode on the page. This way, when the page loads, your server doesn’t have to worry about pulling that video asset up. The video storage service does all of the work.

With drag-and-drop builders — including WordPress’s new Gutenberg editor — all you have to do is add a block for video or audio and then provide a link:

Everything that generates a request has an impact on your site’s performance in one way or another. For sites with hosting hundreds of thousands of files or large media, it may be wise offload this completely. Offloading is different than serving it up via a CDN. With a CDN the original data still resides at your host, the CDN simply has multiple copies of it.

When caching expires on your CDN assets it re-queries your host for the latest copies of the files. CDNs are meant to cache files for long periods of time. But due to the fact that they have so many POPs, there could be a lot of re-querying going on as cache expires in different regions.

When you offload media or files it means actually moving the original physical location of them off of your hosting provider. So while it might appear that the files are served from your site, they are really located somewhere else entirely. Besides reducing additional queries back to the host, the number one reason obviously is to also save on disk space.

• Offload Media to Amazon S3
• Offload Media to Google Cloud Storage

It’s always great when someone likes your site enough to link back to it. What’s not so great, though, is when they like your images so much that they decide to pull them directly from your server.

To clarify, this doesn’t mean someone right-clicked an image from your site and saved it to their drive. Or that they took a screenshot. This means that they’re using a link to the image file on your server to load it on their own website. So, whenever someone views the web page where that hotlinked image lives, your server has to do the work of loading it; not theirs.

To prevent this from happening, disable hotlinks using your security plugin.

It’s easy to block hotlinking, just add this short code snippet to your site’s .htaccess file:

RewriteEngine on
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http://(www\.)example.com/.*$ [NC]
RewriteRule \.(gif|jpg|jpeg|bmp|zip|rar|mp3|flv|swf|xml|php|png|css|pdf)$ - [F]

Every time you hit the “Save” button on a page or post, it saves a copy of the old version on your server. You can override this setting and put a limit on how many revisions are saved, but it requires some coding in the wp-config.php file.

If you’re not comfortable doing this, you can use your database optimization plugin (WP-Optimize or WP-Sweep) to clean out excess revisions every couple of months.

Limit Revisions

Another good strategy is to limit the number of revisions that can be stored per post or page. Even setting it to something like ten will keep revisions from getting out of hand, especially if you do a lot of updating.

To limit revisions, you can add the following code to your wp-config.php file. The code below needs to be inserted above the ‘ABSPATH’ otherwise it won’t work. You can change the number to however many revisions you want to keep stored in your database.

define('WP_POST_REVISIONS', 10);

Limit post revisions in wp-config.php

Or you can utilize a plugin like Perfmatters to limit revisions.

Limit post revisions with Perfmatters plugin

3. Disable Revisions

And last but not least, you can also disable revisions on your site altogether. If you’re going this route, we highly recommend following the first option above to delete revisions and then disabling them afterward. This way your database is completely free from all old revisions and no new ones will be added going forward.

To disable revisions, you can add the following code to your wp-config.php file. The code below needs to be inserted above the ‘ABSPATH’ otherwise it won’t work.

define('WP_POST_REVISIONS', false);

Disable post revisions in wp-config.php

Or you can utilize a plugin like Perfmatters to disable revisions.

Disable post revisions with Perfmatters plugin

In general, comments in WordPress aren’t lengthy discourses. However, it’s not really the size of the comments that matters to performance. It’s the quantity of comments each of your posts receives.

Similar to how you use the Reading Settings to break up long post pages, you want to use the Discussion Settings to break up lengthy comments sections:

By default, WordPress will leave comment boards open for 14 days and store 50 comments on each page. That’s too much.

Update the timeframe to keep comment submissions under control — this will also encourage readers to comment on topics that are timely instead of ones that are old and out of circulation.

Reduce the total numbers of comments allowed per page to 10.

One last thing to do here is disable pingbacks and trackbacks. These are notifications you receive when someone shares a link to your blog on their website. They might seem necessary, but they just add more data to your server. Instead, set up a Google Alert if you want to stay on top of who’s mentioning your brand or website.

With the hosting stuff out of the way, it’s time to look at what more you can do inside of WordPress to speed up your WordPress website.

The first place to start is by creating a system for managing your WordPress updates.

As you can see in the image above, your WordPress dashboard will let you know as soon as updates are available to:

• The WordPress core
• Installed plugins
• Installed themes

There’s a number of reasons a developer might push an update out for their WordPress software. It could be to fix a bug or security issue. It could be to add new features. Or it could be to improve performance problems. Either way, you want to have a process in place that ensures you stay on top of issuing these updates when they’re ready. WordPress will take care of the most critical security updates for you, but it’s your responsibility to handle all of the rest.

You have two options in this case.

The first is to manually make the update from your WordPress dashboard like so:

Or you can use a tool that automates the process for you. There are WordPress plugins like Easy Updates Manager that enable you to automate all updates.

Just be careful. While it may save you time from having to check on updates and do them yourself, there is a small possibility that a future update could prevent certain features from working or break your site entirely. If you can, it’s best to manage these on your own.

The quality and size of WordPress themes can be problematic for WordPress, too. While WordPress does vet the quality of code before it allows a theme to show up in its repository, there’s a reason why plugins and themes are frequently updated.

Now, unless you’re a skilled coder or theme developer, it’s not likely that you’ll be able to poke around the theme to assess its quality. However, you can use two things to help you make this judgment.

The first is user reviews. They are available in the WordPress repository as well as in theme marketplaces like ThemeForest. Grab a handful of reviews and see if anyone has had problems with the theme slowing down their website. If so, find another one to use.

Also, look at what comes with the theme. For example, there are some premium themes that come jam-packed with templates, plugins, builder tools, and add-ons from third parties. If you don’t have a use for them, you shouldn’t install a theme package of that size on your server. It’s a waste of space and a drain on your resources. So, choose wisely.

If you go back to the speed testing tool, you’ll see that the same website will register different scores for desktop and mobile. That’s because mobile can’t handle websites the same way the bigger screens on desktops can.

As such, if you want to ensure that speeds are high across all devices, you’ll need to create a custom design strictly for mobile users. This means cutting down on nice-to-have-but-not-necessary design elements or sections (like pop-ups or ads), reducing the numbers of images used, and making pages shorter.

There are a number of ways in which our plugins create extra work for the server. As already mentioned, plugins like analytics and social media make regular requests to external services which requires your server to work repeatedly to process those updates.

The same thing happens when you leave AJAX cart fragments enabled in WooCommerce.

When enabled, users immediately see their new item added to the cart icon in the corner of the site. While it’s a nice feature to have, e-commerce sites with lots of activity and sales are going to put their servers into overdrive if they leave them on.

Instead, turn off the AJAX cart fragments and enable the redirect option. This way, your shoppers won’t be confused if the new item doesn’t show up in the cart. They’ll be redirected to the cart page where they can see it for themselves.

Whether your website gathers user data from e-commerce gateway, contact forms, reservation tools, or something else, it’s a good idea not to store that user data on your WordPress site and server.

This is true both for the performance side of things as well as the security piece. By keeping user data in a remote and secure location, you’ll conserve space on your server while also keeping it out of harm’s way if a hacker were to find their way inside your site.

A pingback is an automated comment that gets created when another blog links to you. There can also be self-pingbacks which are created when you link to an article within your own blog.

We recommend simply disabling these as they generate worthless queries and additional spam on your site. Remember, the less calls your WordPress site has to make the better, especially on high-traffic sites. Not to mention the fact that a pingback on your own website is just downright annoying. Follow the steps below to disable pingbacks.

Step 1 – Disable Pingbacks From Other Blogs

In your WordPress dashboard, click into “Settings → Discussion.” Under the Discussion Settings section uncheck the option “Allow link notifications from other blogs (pingbacks and trackbacks) on new articles.”

Step 2 – Disable Self-Pingbacks

When it comes to disabling self-pingbacks you have a couple of options. You can use the free No Self Pings plugin. Or you can use a premium plugin like Perfmatters.

Disable self-pingbacks with Perfmatters

Alternatively, you could also disable self-pingbacks by adding the following code to your WordPress theme’s functions.php file. Warning, editing the source of a WordPress theme could break your site if not done correctly. Tip, you can easily add PHP snippets like this with the free Code Snippets plugin. This means you never have to touch your theme.

function wpsites_disable_self_pingbacks( &$links ) {
  foreach ( $links as $l => $link )
        if ( 0 === strpos( $link, get_option( 'home' ) ) )
            unset($links[$l]);
}

add_action( 'pre_ping', 'wpsites_disable_self_pingbacks' );

Whether your blog feed is set as your homepage or is another page of your site, you don’t need 50 thumbnails all loading at the same time. For those that run high-traffic blogs, your homepage is the most important page of your site, and you want this to load fast. The fewer requests and media the better in terms of performance.

Also, this is precisely why pagination was invented (as seen below). Pagination is what you see at the end of blog feeds that allow you to browse to the next page. Typically these are numbers, or they might use “next/previous” posts. Your WordPress theme will most likely already have customized pagination built-in.

Pagination

WordPress by default sets the limit on fresh WordPress installations to 10, but we’ve seen this changed so many times we’ve lost count. So make sure to double-check what value you’re using. We recommend somewhere between 8 and 12. If you’re curious, we are using 12 on our Kinsta blog homepage.

You can find this option in your WordPress admin dashboard under “Settings → Reading.” You can then change the value for “Blog pages show at most.”

WordPress limit blog feed

Another place that’s going to need ongoing cleaning is your content:

• Posts
• Pages
• Media
• Comments
• Projects
• Categories
• Tags
• Products

When was the last time you looked through your content?

There may be old drafts you won’t ever publish. Or really old, outdated content that serves no purpose today. Comments, categories, and tags can get especially messy if you don’t keep an eye on them.

Users fall into this category as well. Go through your user list and make sure only the people who should have access to the site still do. The rest can be deleted.

Your site’s database is where all of your content and settings are stored. Over time, it will pick up a ton of trash in the form of:

• Post revisions
• Trashed posts/comments
• Etc.

While we’re on the subject of cleanup, your database could use some cleaning too.

Every time you install a new plugin or theme, add a new user, receive a new comment, and so on, your database logs it. And each of these files add up. To keep your web server from having to process each and every one of these, you should keep your files clean.

When you work on your scheduled plugin and theme cleanup, make some time for this as well. All you have to do is install a database cleanup plugin like WP-Optimize.

It will go through and clean out unused or unnecessary data while also optimizing the rest of your database for speed.

Optimize Database after Deleting Revisions By CAGE Web Design | Rolf van Gelder, Eindhoven, The Netherlands

wordpress.org/plugins/advanced-database-cleaner

wordpress.org/plugins/query-monitor

Query Monitor is the developer tools panel for WordPress. It enables debugging of database queries, PHP errors, hooks and actions, block editor blocks, enqueued scripts and stylesheets, HTTP API calls, and more.

It includes some advanced features such as debugging of Ajax calls, REST API calls, and user capability checks. It includes the ability to narrow down much of its output by plugin or theme, allowing you to quickly determine poorly performing plugins, themes, or functions.

Use the InnoDB MySQL Storage Engine

A lot of older sites are still using the MyISAM storage engine in their database. Over recent years, InnoDB has shown to perform better and be more reliable.

Here are a couple of advantages of InnoDB over MyISAM:

• InnoDB has row-level locking. MyISAM only has full table-level locking. This allows your queries to process faster.
• InnoDB has what is called referential integrity which involves supporting foreign keys (RDBMS) and relationship constraints, MyISAM does not (DMBS).
• InnoDB supports transactions, which means you can commit and roll back. MyISAM does not.
• InnoDB is more reliable as it uses transactional logs for auto recovery. MyISAM does not.

So now you might be wondering, are you running InnoDB or MyISAM? If you are running on a fairly new WordPress site chances are you are already using the InnoDB MySQL storage engine. But with older WordPress sites you might want to do a quick check. Some sites might even have mixed and matched MyISAM and InnoDB tables, in which you could see improvements by converting them all over.

Follow these simple steps below to check.

Step 1

Login to phpMyAdmin and click on your MySQL database.

phpMyAdmin database

Step 2

Do a quick scan or sort of the “Type” column, and you can see which Storage Engine types your tables are using. In this example below, you can see that two of the tables are still using MyISAM.

MyISAM database tables

If you found some, then it’s probably time to move them to InnoDB. We always recommend reaching out to your host and asking if they can do this for you. At Kinsta, every client’s database tables automatically get converted to InnoDB by our migration team.

But you can always follow these tutorials below to convert your MyISAM tables to InnoDB manually:

• Convert MyISAM to InnoDB with phpMyAdmin
• Convert MyISAM to InnoDB with WP-CLI

Disable/Enable All WordPress Plugins via the Database

WordPress plugins are great because they help even the least tech-savvy user build advanced features into a website. But plugins suffer from similar performance issues as themes, which can make it tricky to use them.

Here’s what you need to do to confirm your plugins won’t hurt speed:

1. Always check the reviews of any plugin you want to use. Again, if there are known performance issues, plenty of people will have chimed in already.

1. See how many people have installed the plugin. If there are under 5,000 users, you might want to find a more established replacement. This doesn’t mean that newer plugins aren’t worth trying out. However, it’s a big risk to take if you don’t know how the plugin affects site performance.

1. Only use the plugins you absolutely need. If any of them overlap in terms of functionality, get rid of one of them. The fewer plugins you have installed, the better.

There are also some plugins that tend to be a huge drain on websites because of how many external scripts they call (e.g. plugins for external analytics or social media have issues with this).

There are other times when a plugin will do the same exact thing that your web hosting does, which makes the plugin unnecessary.

So, see what your web host says if you’re on the fence about a plugin.

One Big Issue with WordPress Plugins

One big issue with WordPress plugins is the uninstall process. Whenever you install a WordPress plugin or theme, it stores the data in the database. The problem is that when you delete a plugin using one of the standard methods, it typically leaves behind tables and rows in your database. Over time this can add up to a lot of data and even begin to slow your site down. In our example, we uninstalled the Wordfence security plugin, and it left behind 24 tables in our database (as seen below). It’s even worse if they’re behind data in your wp_options table.

WordFence tables

And besides the database, a lot of plugins also leave behind additional folders and files. In our experience, this is commonly seen with security and caching plugins which create additional directories for logging. For example, after the Wordfence plugin was deleted, we were left with a “wflogs” folder in our wp-content directory. And we aren’t trying to pick on Wordfence, the majority of plugins and themes on the market work this way.

You can also enable error logs by adding some code to your wp-config.php file. First, you will want to connect to your site via SFTP. Then download your wp-config.php so you can edit it. Note: Always make a backup of this file first!

Download wp-config.php file

Find the line that says /* That's all, stop editing! Happy blogging. */ and just before it, add the following (as seen below):

define( 'WP_DEBUG', true );

WP_DEBUG

If the above code already exists in your wp-config.php file but is set to “false,” simply change it to “true.” This will enable debug mode. Note: You will also see warnings or error in your WordPress admin if they exist.

You can then enable the debug log to send all errors to a file by adding the following code just after the WP_DEBUG line (as seen below):

define( 'WP_DEBUG_LOG', true );

WP_DEBUG_LOG

Save your changes and re-upload this to your server. The errors will then get logged to the debug.log file within your /wp-content/ folder. If for some reason you don’t see this file, you can always create one.