2020 The Ultimate Guide to Boost The Speed of Your WordPress Website
Are you looking to accelerate your WordPress Website? Here is your complete guide on how to do that. Here, you will find all relevant steps on how you can speed up your sluggish website, without getting too much technical or “code-based”. In fact, we have tried to not use code examples here.
Introduction
Over the years, we have been experimenting, testing, studying, and seeing many things related to websites improvement. Now that Google is putting an increasing amount of pressure on website speed, this issue is an absolute priority to business owners, IT departments and Marketing Teams.
Broadly speaking, turning websites faster is part of a bigger issue: Website Performance Optimization. This is the process of using relevant and effective techniques and tools to improve the performance or results of a website. Usually, the general idea is that website optimization only means speed improvement, which is literarily not so.
Basically, website performance optimization entails the general improvement of a website for Search Engine Optimization (SEO), Speed and Conversion Rate Optimization (CRO). For a business to achieve maximum results through its website, there must be an optimization link between SEO, speed and CRO, thus the emergence of website optimization really plays an important role in business growth.
In this article, we will be focusing on Speed, but all 3 areas are highly interconnected and dependent of each other to produce great results.
We will discuss the why, what and how to speed up a WordPress website (of course that every website must and should be optimized, and in fact, many of the conclusions, tactics and tools presented in this article, can be used in all type of websites. We have chosen to focus on WordPress, because it is one (if not the most) used platforms in the World (in fact, that is one of our favourites).
Over one-third of the internet is currently powered by WordPress. While this is incredible, it likewise suggests there are countless various motifs, plugins, and technologies all having to coexist. For the day-to-day WordPress customer, this can swiftly develop into a problem when their website starts to traffic jam and they do not recognize why and even where to begin troubleshooting.
So today we are going to show to you everything you need to know concerning turbocharging WordPress, over years of experience as well as hard lessons discovered, done in one best guide. Whether you are simply starting to use WordPress or are an experienced developer, we guarantee you will find something beneficial in this overview!
We will be diving right into suitable actions you can take right now to see enhancements by yourself on your WordPress websites. We will additionally share some sources that have been especially useful to us.
Why Boost the Speed of Your WordPress Business Website?
Speeding up your business website is one of the easiest ways to achieving all-round success, and it is one of the best investments you will ever do in your website. Business owners should not be skeptical about business website speed optimization due to its effectiveness. Here are few of the numerous reasons you should do it:
- To Improve User Experience & Satisfaction: Having a faster website will improve user experience. Website speed increases visitor retention and loyalty. Users tend to stick to websites with faster page load time and good download rate. If your website is swift enough to be called user-friendly, then you can expect to get more visitors click on it. Every user wants to visit websites that will offer the best experience.
- To Increase Website Traffic: Google loves fast websites. Period! Optimizing your website for SEO will help improve its ranking on search engines. In return, you will get more visitors on your website. Google is the most popular search engine in existence.
Research statistics done in April 2019 shows that Google have a whopping 88.47% of the total search engine users across the globe. This implies majority of search engine users prefer Google. You can imagine the number of visitors a business ranked high on Google search engine would get daily. Research also shows that Google algorithm favor websites with faster speed when ranking.
The speed of a website influences the experience of users. This makes it a considerable criterion for Google when ranking websites. Google website speed optimization is essential to improving Google ranking.
- To Increase Advertising Efficiency: If you use Google Ads to get traffic, you are paying clicks accordingly to your bid offer and quality score/landing page user-experience, right? So, the fastest the page, the better-quality score and lower price you pay per click. If fact, in many cases, this positive effect per se more than justifies the investment on optimizing for speed.
- And oogle loves fast websites. Period! Optimizing your website for SEO will help improve its ranking on search engines. In return, you will get more visitors on your website. Google is the most popular search engine in existence.
- To Improve Business Result: Website performance optimization is the easiest and most effective way to improve business results, many times way cheaper than simply getting more and more traffic. Effectively optimizing your website for the search engine and conversions will increase your sales, and speed is an arguably factor for improving both.
But speed is not an absolute definition. What really matters is how fast your website is perceived, compared to your competitors in the different regions of the globe where your potential customer interacts online. If all your competitors have “10 sec” websites and you have a magnificent “5 sec”, it means that you may have an advantage.
For Google, there seems to be a maximum barrier of 3 seconds, so, there is a huge work ahead of us, to comply with this rule.
Different Problems, Mean Differentiated Solutions
Having known the benefits of website speed performance optimization, how then can you optimize your WP site for speed? Well, it all starts… in the beginning 😊. What we mean is: there are no two websites alike, the same way that there are no businesses alike or equal persons (Lapalisse’s truth, right?), so, the beginning is to comprehend the type of WordPress site that you have.
By type, we mean: static vs dynamic, passing-through vs consuming. Static would normally include websites such as blogs, local business/institutional websites, lower quantity information sites, individual, photography, and so on. By static, we suggest that the information on these WordPress sites is not changing frequently (perhaps a couple of times a month). This indicates they will have fewer database requests and not as numerous resources will certainly be needed to achieve good performance.
This may have an impact on the best strategy to improve your website. The more static your website is, the most cacheable it is (we will discuss this later).
On the other hand, if you have an extremely vibrant website (such as eCommerce, community, subscription, online forums, etc…), we suggest that the data on these WordPress sites is frequently changing (web server deals are occurring every couple of mins or also every second). This means that not all requests to the server can be served straight from cache and need added server sources and database queries.
On a passing-through WordPress website which is primarily informational, a visitor could stay for 5 or 10 mins until they locate what they need and leave. On consuming websites, you have the contrary taking place. These websites additionally generally have a lot of simultaneous visitors as well as sessions. For example, if they are undergoing an on-line training course, it is not uncommon for them to remain for hrs.
You can see where this is going. The simultaneous visitors linked to your WordPress host accumulates quickly. To make it even worse, you after that have a lot of simultaneous site visitors in addition to an “uncacheable web content” issue.
The conclusion is that you cannot deal with all WordPress sites the exact same way when it comes to efficiency and speed optimization.
What To Do and How to Improve Speed Performance?
Backup, Staging & Testing
Please, never, but never try to optimize your website’s speed on live website. Always do backup and try all your stuff (more on this ahead) on a testing or staging environment. Personally, the strategy that we usually follow is: backup the website (here’s a list of a few plugins that will help you with that task) to a new subdomain (something like: testing.domain.com) and do your work on it.
Where you are satisfied (and only then) incorporate your changes in your live website. Check for any errors and voilá… your website is now speed optimized and leaving your competitors behind.
The Critical Importance of Hosting
Finally, let us start grabbing the bull by its horns, and discuss every strategy and tool that we use (and not use) to boost WordPress websites speed.
In the world of websites speed (as in many other areas of life), if you pay peanuts, you get monkeys… The time it takes a website to load, hugely depends on the server response time. Server response time is the amount of time it takes your hosting server to translate your website URL into page content. If your hosting server is slow, it will also slow down the speed of your website. There is no way to escape it!
High-Performance WordPress Hosting
A WordPress host is a firm that stores every one of your website’s data. You enroll in a strategy and all your images, web content, videos, and so on, reside on a web server sitting in the host’s data center. The WordPress host offers you a simple means to access the data, manage it, as well as course it to your visitors. Pretty simple right? Well, not fairly. There are three different sorts of WordPress hosts you will run into around the internet. Allow us to dive into the advantages and disadvantages of each. It is crucial you choose the ideal one from the start, or else, you will just trigger on your own frustrations and lost time later.
- Shared WordPress Hosting: The initial and usually most preferred kind of WordPress holding is what we call shared hosting. These include the largest hosts in the sector such as Bluehost as well as HostGator along with suppliers like Siteground, as well as InMotion Hosting. They normally use cPanel, as well as the typical consumer typically pays in between $3 to $30 a month.
Any person using this sort of organizing will at some time experience problems, it is simply a question of time. Why? Since hosts tend to overcrowd their web servers, which in turn can affect the efficiency of your website. Site suspensions or seeing frequent 500 errors is a heartbreaking reality, because they must place restrictions on everything and combine sources to make it through. And even worse, site downtime. Even though you do not recognize it (unless you have a monitoring tool such as Sucuri).
For a website with some dynamics or users pressure, shared hosting usually will not be the greatest option for performance (but can be very cost effective, so you must do your own math and evaluate your ROI in this tradeoff: performance vs cost). When it pertains to shared hosting, the golden rule applies – you generally get what you spend for.
- Virtual Private Server (Not Managed): The 2nd sort of WordPress hosting is DIY VPS, or “Do it on your own on a virtual private server.” This crowd is generally comprised of bootstrap startups and users with a bit more advancement, server management, and WordPress experience. They are the DIY crowd. These folks are normally still attempting to conserve cash, but they are additionally typically interested in efficiency and realize its importance in the success of their organization. Common configurations may include utilizing a third-party VPS carrier such as Digital Ocean, Linode, or Vultr; along with a tool like ServerPilot to handle it extra easily.
A little VPS from Digital Ocean begins at $5 a month and the popular plan at ServerPilot begins at $10 a month. So, relying on your setup, you might be considering a cost of between $5 to $15 or more a month. The DIY strategy can reduce expenses, but it also suggests that you are accountable if something breaks, and for maximizing your web server for efficiency. The DIY strategy can be excellent, but it can also backfire on you if you are not careful. Do not go this route if you are not tech-savvy or even if you wish to dabble! Your time deserves cash as well as you ought to be spending it on growing your organization.
- Managed WordPress Hosting: The third kind of holding is managed WordPress holding, for example from Kinsta, Cloudways, WP Engine, Flywheel. These kinds of hosts manage all the back-end web server relevant tasks for you, while offering support when you need it. They are usually fine-tuned to deal with WordPress as well as usually include attributes such as one-click staging atmospheres and automated back-ups. Their assistance groups will certainly be much more educated when it comes to understanding their means around the CMS as they are concentrated on one system daily. If you want to conserve time, energy and good spirits, managed WordPress holding is the method to go!
Options for managed WordPress hosting generally range anywhere from $25 to $150 a month or more depending upon the size of your site and requirements.
Use the Latest Updates: PHP & Database
PHP is an open-source, server-side scripting and language that is largely utilized for web development. The core of WordPress software program is written in PHP, in addition to your plugins, which makes PHP a very vital language for the WordPress community.
You ought to guarantee your WordPress host supplies at least PHP 7 or greater (or 8, or 9… whatever is the latest stable version), because, the latest versions usually are much better for efficiency and performance. Check this document for some more info regarding PHP version differences. The same principle for Databases Engines: MySQL, MariaDB.
Use a CDN for Different Geo Locations
Content delivery network (CDN) is a collection of servers that allow contents to be geographically distributed. This is amazingly effective for websites with wider user base. Whenever a user requests your website URL from any location, CDN would deliver the content to the user in no time.
Among the very first things you should do when organizing your WordPress site is to figure out where most of your site visitors or clients are originating from. Why is this crucial? Because the location at which you host your internet site plays a considerable variable in determining your total network latency and TTFB, or in more common words: the time that your website takes to arrive into your clients.
So, check the geolocation of your visitors in Google Analytics (or other similar system). You can discover this under “Audience/ Geo/ Location.” If most of your visitors come from one single location, then you must optimize your website in respect to that location. If on the other hand, there is some distribution of geo origins, then, using a CDN is an absolute must, so that you may offer cached properties from POPs around the globe. This helps negate the network latency for visitors that may not be close to your host web server.
There are a lot of CDN’s, each with its own flavour, depending on specific needs, regions, dimension, among other specificities. Here’s a few CDNs you can chose from: Cloudflare , StackPath, among others.
If you go with Cloudways, you will have access to its CDN, and that is a great advantage in terms of daily management. In the same panel you can control everything related to your hosting.
The Core of Your Website: Your Selected Themes
I am sure that you love a beautiful design, full of “bells & whistles”, with a lot of options and configurations, and every feature plus one, however beware… regarding website speed: less is usually more – that means if you have more and more stuff, it will (almost certainly) lower the speed of your website.
The quality of your theme and plugins is especially important, so always go with tested and reliable suppliers. There is no more certain way to dramatically shoot yourself in the foot than having some poorly coded theme or plugin consuming resources of your server and putting down all your website speed optimization efforts.
There are a whole lot of distinctions when it comes to complimentary vs. paid themes. In relation to performance, every component you see in a theme has some effect on the total speed of your web site. And with thousands of motifs out in the wild, there are both good ones and negative ones.
So exactly how are you meant to know which one to select? We recommend going with among the following 2 options:
- A quick lightweight WordPress style that is developed with only the features you need, nothing even more.
- A much more feature-rich WordPress template, however you can disable functions that aren’t in usage.
Points such as Google Fonts, Font Awesome icons, sliders, galleries, video and parallax manuscripts, and so on – If you are not utilizing them, these are simply a few of the many things that you must be able to transform off. You do not desire to be attempting to tweak these by hand after the reality.
As well as we are not most likely to reveal you 50 different ways to remove points out. Rather, you should begin or switch to a WordPress theme that is either lightweight from the get go or gives you these alternatives.
So, in terms of accelerating your website, always turn off every feature you are not using or, if using it please evaluate its importance and return – is it so important?
In every process of speed optimization, this is one of the first things we do – checking the theme, its options, and hopefully identifying things to turn off.
Below are several WordPress themes that we advise and that you cannot go wrong with! 🙂
Every theme mentioned below is totally compatible with WooCommerce as well as Easy Digital Downloads, WPML, BuddyPress, and bbPress. We run a couple of rate examinations with each style utilizing the adhering to configuration:
GeneratePress is a quick, and fast, mobile responsive WordPress theme constructed with speed, SEO and use in mind.
There is both a premium and cost-free version offered. If you take an appearance at the WordPress database, the cost-free variation presently has over 200,000 active installs, 2+ million downloads, and a remarkable 5 out of 5-star ranking (over 850 people have provided it 5 celebrities).
Among the excellent features of GeneratePress is that all the alternatives make use of the indigenous WordPress Customizer, suggesting you can see every change you make instantaneously before pressing the publish switch. This additionally suggests you do not have to learn a new theme control board.
The OceanWP is highly extendable and light weight. It enables you to produce practically any type of sort of web site, such as a blog, profile, service website or WooCommerce store with an attractive & expert layout. It is also actively upgraded and well sustained.
Like GeneratePress, there is both a free and superior version readily available. If you have a look at the WordPress database, the complimentary variation currently has more than 400,000 active installs, and another outstanding 5 out of 5-star ranking (over 2,600 people have provided it 5 stars).
Astra is a quickly, gorgeous & completely customizable motif suitable for blog sites, personal profiles, organization websites, as well as WooCommerce storefronts. Built by the team at Brainstorm Force, it is proactively upgraded and well supported. You could recognize them as the developers of the popular All In One Schema Rich Snippets plugin which has actually been around for numerous years.
Similar to with GeneratePress as well as OceanWP, there is both a complimentary and exceptional version readily available. If you have a look at the WordPress database, the totally free variation presently has more than 400,000 energetic installs, 1.6+ million downloads, and also another impressive 5 out of 5-star score (over 2,500 people have given it 5 celebrities).
Neve’s mobile-first approach, compatibility with AMP and popular page-builders makes website building accessible for everyone. It is accompanied by several pre-made business sector templates and some extras.
It loads in less than 1 Second and has a very reduced weight.
If you already have your theme installed and working, look at each option, turn it off and test its effects on speed.
The Temptation: Plugins and More Plugins
Now for the scoop on WordPress plugins. I am sure that you already heard somewhere that you should not set up so many plugins or it would certainly slow down your WordPress website. While this is sometimes real, it is not one of the most important factors. The variety of plugins is not as essential as the top quality of the plugins.
Like with styles, it matters exactly how the plugin is established as well as if it were constructed with efficiency in mind. While it is enjoyable to add code and features to your website, this is not constantly practical because of all sort of problems they create.
Some hosting companies go a step further and do not allow some plugins in their servers. For example: Kinsta prohibited plugins are usually due to performance issues.
One huge problem with WordPress plugins is the uninstall process. The issue is that when you erase a plugin using one of the basic methods, it normally leaves behind tables as well as rows in your database. Besides the database, a great deal of plugins additionally leaves extra folders and documents and active cron jobs. You are probably asking yourself, why do not designers have self cleanup choices when you uninstall as well as delete a plugin? Well, they do (some of them!).
So, as part of the process of accelerating your WordPress, you must also check every plugin, its options, and resources consumption and involvements. Later in this article, we will discuss how to optimize plugins, by selectively activating/deactivating according to some rules. This alone, can pose a huge performance impact on your website speed.
Some Generic Settings
Some generic settings on your WordPress, will have indirect impact on its performance, mostly by working as a security measure, thus pushing way bad traffic and its (many times) huge resources consumption.
Here are a pair of adjustments you can make to assist speed up your WordPress website. Most of these are extremely subtle changes, yet everything adds up to help!
- Modification Your WordPress Login URL – By default your WordPress site’s login URL is com/wp-admin/. Among the problems with this is that every one of the bots, cyberpunks, and scripts available likewise know this. By altering the URL, you can make yourself much less of a target, far better shield on your own versus brute force attacks, and decrease the data transfer made use of by the bots that strike this URL consistently. Transforming your WordPress login URL can likewise help prevent usual errors like “429 Too Many Requests.” This is not a repair all solution, it is merely one little trick that can assist secure you and reduce the tons on that page (and helps making your website safer). There are a couple of plugins that will help you to do that: WPS Hide Login, Perfmatters, among many others.
- Disable or Tweak Plugin and Theme Updates – Slow WordPress admin dashboards can be impacted by the network, data center location, and even PHP versions. Another factor that not a lot of people talk about is the WordPress update checker that runs in the background. Essentially the problem is that the built-in WordPress update checker makes an external GET request behind the scenes (https://third-party-plugin/update-check.php). Sometimes this can be periodic or very frequently. If it is happening all the time, this could bring your admin dashboard to a crawl. But please note that you should only do this if you intend to check for updates manually, since many updates include security and bug fixes. Having updated themes and plugins is a must in terms of security, so please be aware and take the right approach in your case. There are also a few plugins that will help you do this task: Disable All WordPress Updates, Easy Updates Manager, among others.
- Disable Pingbacks – Also a security measure. When another blog links to you, a pingback is an automated comment that gets created. When you link to an article within your own blog, there can also be self-pingbacks which are created. We recommend simply disabling these as they generate worthless queries and additional spam on your site. Remember, the less calls your WordPress site must make the better, especially on high-traffic sites. 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.”. When it comes to disabling self- pingbacks you have a couple of options. You can use No Self Pings plugin, or Perfmatters.
- Use Pagination and Limit Content on your Home Page – Whether your blog feed is set as your homepage or is another page of your site, you do not need 50 thumbnails and a few videos all loading at the same time. For those that run high-traffic websites, your homepage is probably 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. If you are using E-commerce, limit the number of products to be displayed at once (I would say, no more than 6 to 9).
Caching
Caching is without a doubt one of one of the most vital and simplest ways to speed up WordPress! What is Caching? In short, every user that visits your WordPress website calls for a request to the web server, processing by that web server (including database queries), and after that an outcome sent from the web server to the customer’s internet browser.
Given that the web server needs to refine all those requests, it spends some time for the total page to be delivered to the customer– specifically with confusing or bigger sites. That’s where a WordPress caching plugin comes into play! Caching advises the server to keep some data to disk or RAM, depending on the arrangement. It can remember and duplicate the same content it has been serving in the past. Basically, it lowers the quantity of work needed to generate a page sight. As an outcome, your web pages pack much quicker, straight from cache.
When it comes to types of caching, there are two different approaches commonly used: Caching at the Server-Level is by far one of the easiest approaches for the end-user. What this means is that the WordPress hosting provider handles it for you. That is one of the basic reasons why your WordPress Hosting is so important in terms of speeding up your website. On the other hand, you can use a third-party WordPress caching plugin. There are a few options out there: WP Rocket (premium) Cache EnablerW3, Total Cache, among others. You should test, test and test… one after another, check your results and… take your decision.
Why? Because they do not produce the same results and because there may be some conflicts between other plugins and themes. Each website is a website. There is not a one size fits all solution, so you best approach is to test and test, to reach your best configuration possible.
By default, certain individual pages should never be cached, such as cart, my-account, and checkout, are excluded from caching, because they are related to specific users and need to be regenerated in a request by request basis, to ensure everything works fine.
We will be back to caching, later. For now, the most important thing to retain is that you must use caching to potentially get a performance boost.
Optimize Images for Speed
This is an absolute must. If you are looking for a single action that will (almost always) produce huge results, this is it. This is not optional; every website ought to be doing this:
- Reduce larger images to considerable file size.
- Compress image resolution.
- Use suitable image formats.
Large photos reduce your website performance, which develops a much less than optimum user experience. Just imagine this scenario (a real one, many times witnessed). You upload your photos with, let us say 1 MB of size (huge right?). Now, following the same example, you load on your page, 10 products, with a photo each… Only in images, you are loading 10 MB… Do you already see where I am getting?
I see this every day. Designers, photographers, and other professionals take care of handling beautiful images that you (or someone in your team) will upload directly into your website, without proper preparation. Basically, you are shooting yourself, I mean, your website’s performance, by doing this. Remember, less is more…
Optimizing images is the procedure of drastically lowering their dimension, making use of either a plugin or application, which in turn accelerate the tons time of the web page. Lossy and lossless compression are 2 approaches generally utilized. As a rule of thumb, I would say that no image should have more than 100 KB (if possible less), so… you have a road ahead of you If in your website or e-commerce you have thousands of images.
Images are usually a big part of an overall website’s weight. After videos, which are much harder to optimize, images by far are the first place you should start! It is more vital than JavaScript, CSS, and Fonts. And, ironically, an excellent image optimization operation is one of the simplest points to execute, yet a great deal of web site proprietors ignores this.
The primary objective of formatting your photos is to achieve the balance between the most affordable file size and appropriate quality. There is more than one way to do nearly all these optimizations. One of one of the most standard ways is to press them before posting to WordPress. Normally, this can be carried out in a tool like Adobe Photoshop or Affinity Photo or utilizing the new on-line Squoosh app from Google. There are also a few online services that do that. Just try to search for: “image compression service” and you will be presented with a ton of solutions.
On the other hand, these tasks can also be performed automatically using plugins, which we will go into more below. Both main things to consider are the documents format as well as the kind of compression you use. By choosing the right combination of file style and compression type you can decrease your picture size by as much as 5 to 10 times. You will have to experiment with each picture or file format to see what functions best.
Before you begin modifying your pictures, make certain you have selected the finest documents type. There are numerous kinds of documents you can make use of:
- PNG: creates better photos, yet also has a bigger data dimension. Was created as a lossless photo style, although it can additionally be lossy.
- JPEG: uses lossy and lossless optimization. You can adjust the top-quality level for a good equilibrium of quality and data size.
Ideally, you should use JPEG (or JPG) for images with great deals of colour as well as PNG for basic photos.
What about GIFs? Animated GIFs are constantly enjoyable, but they kill web efficiency. A great deal of GIFs is over 1 MB in dimension. We advise keeping these for social media and Slack. If there is one that you cannot live without in your post, look at exactly how you can compress computer animated GIFs.
Lossy vs. Lossless Optimization.
It is additionally vital to understand that there are two kinds of compression you can make use of, lossy and lossless. Lossy compression involves removing some of the information in your picture. Since of this, it implies you could see degradation (decrease in top quality or what some refer to as pixelated). You must be careful by how much you are reducing your image. Not only because of high quality, but also because you cannot reverse the process. Obviously, one of the great advantages of lossy compression as well as why it is one of one of the most popular compression techniques is that you can reduce the file dimension by a significant amount.
Lossless compression, unlike lossy, does not reduce the quality of the image. It is usually done by removing unnecessary metadata (automatically generated data produced by the device capturing the image). You will wish to try out what jobs best for you. For most users, we advise using lossy compression due to the reality that you can quickly compress a picture more than 70% (often also over 90%!) without much high-quality loss. Multiply this by 15 pictures on a page, and it will play a considerable function in reducing your website’s tons time.
Photo Compression Plugins.
The terrific information is that there are some remarkable WordPress photo compression plugins you can utilize to automate the entire procedure. Right here are some plugins we recommend: Imagify (lossy and also lossless– optimizes photos externally), WP Smush (lossless and lossy– maximizes pictures on the surface), Optimole (lossy and lossless– maximizes images on the surface), EWWW Cloud (lossy and lossless– optimizes images on the surface), ShortPixel (lossy and lossless– maximizes images on the surface).
When choosing an image optimization plugin is to use one that it compresses and optimizes images externally on their servers, the most important thing. This, in turn, reduces the load on your site. All the ones above do this. It automatically compresses images when we upload them to the WordPress media library. Over time you can get a feel for what image compression level you want to use.
How much faster will your WordPress site be if you use image compression? It all depends on the sizes of your original images and what they are after compression. In some cases, you can expect to decrease page load times by over 80%!
Lazy Loading
You might consider lazy loading them if you have a lot of images. This is an optimization technique that loads visible content but delays the downloading and rendering of content that appears below the fold. We will get back to this later.
Check out this guide on how to implement lazy loading in WordPress. This can be especially important on blog posts with lots of gravatar icons from comments. Google also just released their recommendations for lazy loading.
We usually take care of this, by using a caching plugin with that functionality, such as WP Rocket.
The days of uploading images only sized to the width of the column or DIV are over. Responsive images work out of the box in WordPress (since version 4.4) and will automatically display smaller image sizes to mobile users. SVGs can be another awesome alternative to using images. Check out this tutorial on how to use SVGs on your WordPress site.
When scaled and take less space, Use icon fonts instead of placing text within images – they look better. And if you use a font generator, you can optimize them even more. Check out how we decreased the size of our icon fonts file by a whopping 97.59% using a font generator. You may also want to look into WebP, a new image format from Google which is quickly gaining traction and gets huge performance gains.
Fine-Tune Your Database
Your database is where all your data is registered, including a lot of what you would consider as garbage (old plugins data, old content revisions, temporary files, among many others). With a big traffic website, it easily reaches hundreds of thousands or millions of records, many of which your website needs to process on a request by request basis.
Your database is like having an airplane – it must be clean, optimized, exempt of problems, and be constantly maintained to assure a smooth operation and, most of all, to avoid disastrous accidents, right?
Membership sites especially make it tricky, as they typically produce much more complex inquiries, which subsequently adds added latency in retrieving the information from the data source. A great deal of this is because of all the added moving parts as well as big amounts of data websites like these have. This could also be brought on by sites that greatly count on custom search questions for navigating or usage (making use of WP_Query). As well as, you also have huge quantities of concurrent individuals continually inquiring the data source.
So, here are some suggestions on exactly how to adjust your WordPress database and keep it working properly:
- Make Use Of the latest database technologies and engines versions (please check with your hosting, what are you using)
- Keep your database updated
- Delete and Limit Page as well as Post Revisions – Whenever you conserve a page or message in WordPress, it produces what is called a revision. This takes place in both drafts and already released posts that are updated. Alterations can be useful in instance you require to go back to a previous version of your material. Just evaluate: do you really need to have 200 versions of the same page? Or is it ok to limit them to just a few 3 to 5? Revisions can also hurt the performance of your WordPress site. On large sites, this can add up very quickly to thousands of rows in your database which are not necessarily needed. You can use WP Rocket, or WP-Sweep, Advanced Database Cleaner, among others, to do that.
- Tidy up Your wp_options Table as well as Auto-loaded Data – The wp_options table typically gets forgotten when it involves total WordPress and database performance. Particularly on older and large websites, this can conveniently be the offender for slow inquiry times on your website due to auto-loaded information that is left behind from third-party plugins and also styles. Trust us; we see this every single day! The wp_options table consists of all kind of data for your WordPress site such as: Site URL, home URL, admin email, default category, articles per page, time format, etc, Settings for plugins, themes, widgets Temporarily cached data.
When it comes to speed performance, auto-load is the one we care about. Auto-loaded data is data that is loaded on every page of your WordPress site. The auto-load attribute is set to “yes” by default for developers, but not every plugin should theoretically load their data. on every web page.
The trouble WordPress websites can run into is when there is a large amount of auto-loaded data in the wp_options table. This is typically a result of the following: data is being auto-loaded by a plugin when it should be set to “no.” A good example of this would be a contact form plugin. Does it need to load data on every page or just the contact page? Themes or plugins have been removed from the WordPress site, but their options are still left behind in the wp_options table. This could mean unnecessary autoloaded data is getting queried on each request. Plugin and theme developers are loading data into the wp_options table instead of utilizing their own tables. There are arguments to both sides of this, as some developers prefer plugins that don’t create additional tables. The wp_options table also was not designed to hold thousands of rows.
How much is too much-auto-loaded data? Once you start approaching the 2-3 MB range or more, there are most likely things that can be optimized or removed from being auto-loaded. You can find more info about this: here and here.
- Clean up Transients – Unless you are using an object cache, WordPress stores transient records in the wp_options table. Typically, these are given an expiration time and should disappear over time. That is not always the case. We have seen some databases where there are thousands of old transient records. It is also important to note that transients are not to auto-loaded by default. You could use a query like the below to see if there are any auto-loaded transient data. You can use a free plugin like Transient Cleaner or Delete Expired Transients which can clean up only the expired transients from your wp_options table. It appears there is now a function in WordPress, added in 4.9, that cleans up expired transients. Hopefully, that is happening automatically on your site now. WP Rocket also has the ability to cleanup transients in their database optimization options.
- Clean up WordPress Sessions – Another common issue we’ve seen is sometimes cron jobs get out of sync or don’t fire properly, and therefore sessions don’t get cleaned up. You can wind up getting tons of _ wp_session _ rows in your database. In this example below the site in question wound.
Move Your Heavy Media & Bulk Operations to External Provider
Every little thing that produces a request has an influence on your website’s performance in one way or an additional. For websites with organizing hundreds of thousands of data or big media (downloads, software, videos, games, audio files, PDFs, etc), it may be smart to offload this totally to external services, such as Amazon S3 or Google Cloud storage.
One case we see often is the use of videos. Just because you can upload a video to your WordPress site, does not mean you should, because of:
- Server Bandwidth & Resources – Video files can be quite large. Unlike images – which are typically measured in kilobytes – an HD video file can easily weigh in at more than 100 MB. When thousands of users attempt to watch videos at the same time, your server will seat on its knees. Server resources that could (should) be used to satisfy users/pages requests will be occupied answering video streaming needs.
- File Space Used – In addition to the amount of disk space your video files will occupy, backups will begin to take significantly longer to execute. More data requires more disk space and takes more time to backup.
- Slow-Loading or Freezing Video – If your video file resides on a single server with a limited amount of bandwidth, your audience may experience unexpected pauses while watching your video. It is annoying. That is because their computer is waiting for the file to download or stream to their computer. And it gets even worse if they have a slow Internet connection (as is often the case in mobile context).
- No Single File Format Standard for Web Video – The current HTML5 draft specification does not specify which video formats browsers should support. As a result, the major web browsers have diverged, each one supporting a different format. Safari will play H.264 (MP4) videos, but not WebM or Ogg. Firefox will play Ogg or WebM videos, but not H.264. Thankfully, Chrome will play all the major video formats, but if you want to ensure your video will play back on all the major web browsers, you’ll have to convert your video into multiple formats: .mp4, .ogv, and .webm. Now you have got three different video files to upload, each one potentially hundreds of megabytes in size.
- File Space Used – In addition to the amount of disk space your video files will occupy, backups will begin to take significantly longer to execute. More data requires more disk space and takes more time to backup. Your database is where all your data is registered, including a lot of what you would consider as garbage (old plugins data, old content revisions, temporary files, among many others). With a big traffic website, it easily reaches hundreds of thousands or millions of records, many of which your website needs to process on a request by request basis.
The same principles apply to pdf’s, and other types of downloads, so you must seriously evaluate and test your option to manage all this content using external solutions.
Offload Transactional and Marketing Emails
Whether you think so or not, emails do have an impact on your server and server resources. We never recommend using your hosting provider for email if you are sending newsletters or mass emails. In this case, we constantly suggest the adhering to alternatives to obtain the absolute best results, such as make use of a third-party expert e-mail advertising and marketing software that is not part of WordPress, or utilize a transactional e-mail solution company (HTTP API or SMTP) along with WordPress.
Additionally, you will (usually), get much better email deliverability. Allow the e-mail service providers do what they do best! Much less opportunity to get blacklisted.
You may use services as: ActiveCampaign, Mailchimp, Drip, SendGrid, Mailgun, SparkPost, among many others.
Identify & Remove Problematic Plugins
One big issue you have to face when you are trying to optimize a website, is that in many cases, the problem is directly related to the features you want active, and you must decide between speed or features.
What we do here is to discover bottlenecks on your WordPress website and what you can do concerning it. There are some wonderful tools on the market which can help you identify and recognize slow database queries as well as plugins that are consuming a great deal of time. We are big followers of New Relic. New Relic is a PHP tracking tool you can utilize to get thorough efficiency statistics on your web site. Use New Relic with care as it impacts site performance. It adds JavaScript to your website. We recommend enabling it only when you need to troubleshoot performance and then disabling it afterward.
When a WordPress plugin is triggering general sluggishness, the signs will certainly vary based on the task the plugin is performing. However, oftentimes, you will find that a slow plugin will certainly impact every web page of a WordPress site. You can find out for example that a specific plugin is consuming much more than the amount of time as the following slowest plugin.
It can be tempting to immediately dismiss the plugin as poorly coded or somehow ineffective when you see data like this. While this is occasionally the case, it is not constantly the instance. Plugin misconfiguration, database slowness, or outside sources that are slow to react might trigger a plugin to take in a great deal of time.
When you see a plugin that is responding slowly, it is a good idea to check several other screens in New Relic to find additional information. The purchases, data sources, and exterior resources must all be examined before making a decision that shutting off the plugin is the absolute best or just way ahead.
A badly maximized data source can cause overall slowness on a WordPress site. Earlier we went over a lot of different things you can do to fix this. In New Relic, this database related slowness will more than likely show up in two places: you will see an outsized quantity of MySQL activity in the introduction and you will see several data source tables consuming a whole lot of time in the databases tab.
You can likewise make use of the complimentary free Query Monitor WordPress plugin. Use it to determine and debug some data source questions, AJAX calls, REST API demands, and much more. Furthermore, the plugin reports back website information such as dependencies, WordPress hooks that fired during web page generation, conditional query tags met by the current web page, and a whole lot more. Look into this tutorial on just how to utilize Query Monitor.
Optimize Back-End Server Settings
You can speed up WordPress by maximizing the back-end of your server, such as PHP, HTTP cache headers, GZIP compression, among other settings:
- Increase PHP Workers – PHP workers could be a term you’ve never become aware of, however they are basically how many simultaneous uncached requests your site can handle at any given time – usually the limits are imposed by Hosts (instead of restricting you by CPU or RAM, which is commonly what shared holding providers do). To place it just, each uncached demand for your website is dealt with by a PHP Worker. If you have 4 demands that come to your website at the specific same time as well as your website has 2 PHP employees, two of those requests will get processed while the various other 2 will have to wait in the queue until the initial 2 have actually finished handling.
Remember we gone over previously that one of the largest issues with WordPress subscription websites is every one of those uncached demands. Therefore, PHP employees become extremely vital as they must help each request. These sites will generally call for added PHP workers to guarantee every request is completed without hold-ups as well as finished efficiently.
What happens if you constantly max out your PHP workers? Generally, the queue begins to push out older requests which can result in 500 errors on your website.
- Use GZIP Compression – GZIP is a file format and a software program application used for data compression as well as decompression. GZIP compression is allowed server-side, and enables for more decrease in the size of your HTML, stylesheets, as well as JavaScript data. When a web browser checks out a web site, it checks to see if the internet server has GZIP allowed by seeing if the content-encoding: gzip HTTP header exists. If the header is spotted, it offers up the compressed and smaller documents.
Enabling GZIP compression can aid reduce the dimension of your web page, which can considerably lower the quantity of time to download the resource, lower data use for the client, as well as enhance the moment to first render of your pages. This is quite basic currently across most hosting companies, yet absolutely nothing surprises us at this point any longer.
- Enable Hotlink Protection – The concept of hotlinking is simple. You find a picture online someplace and use the URL of the image directly on your website. This photo will be shown on your website, yet it will certainly be offered from the initial server. This is hassle-free for the hotlinker, yet it is really theft as it is making use of the hotlinked website’s resources. Hotlinking can be a massive drainpipe on sources for the target web server. Think of if you are on a common WordPress host and Huffington Post unexpectedly connects to your pictures. You could go from a pair hundred queries an hr on your website to a couple hundred thousand. This can also lead to a suspension of your organizing account. This is a factor to not just utilize a high-performance host (which can deal with missteps like this), yet additionally to enable hotlink protection, so this does not happen. Here’s a small tutorial on how to avoid hotlinking.
- Minimize the use of Redirects – Simple reroutes like a single 301 redirect, HTTP to HTTPS, or www to non-www (vice versa) are fine. And a great deal of times these are required in particular areas of your internet site. Each has a price on your site’s efficiency. As well as if you begin piling redirects on top of each various other, it is vital to recognize exactly how they impact your site.
Using cost-free WordPress plugins to apply redirects can occasionally create performance issues as many of them make use of the wp_redirect function, which requires extra code implementation and resources. Several of them additionally include autoloaded data to your wp_options table, which enhances database bloat.
- Control Cron Jobs – CRON work (WP-Cron) are used to arrange repeated jobs for your WordPress website. Over time, these can get out of control as well as cause performance problems. You can utilize the complimentary WP Control plugin to check a handle on all the Cron work happening on your website. We have additionally seen performance concerns with the WordPress built-in Cron handler: If a website doesn’t have enough PHP workers, occasionally a request will come in, WordPress will certainly generate the cron, however the cron has to wait for the worker, and therefore just sits there. A far better technique is to disable WP-Cron as well as utilize the system cron instead. Please look at this set of articles to know more.
- Include Cache-Control and Expires Headers (Determine Cache Length). Every script on your WordPress site requires to have an HTTP cache header attached to it (or it need to). When the cache on the data ends, this figures out. To repair this, ensure your WordPress host has the appropriate cache-control headers and expires header’s setup. If you do not, you will certainly most likely see warnings regarding requiring including expires headers or leverage browser caching in speed screening devices.
While the cache-control header transforms on client-side caching as well as establishes the max-age of a resource, the expires header is made use of to specify a specific time the resource is no longer valid. While both the headers can be utilized with each other, you do not necessarily require including both headers. Please check this out, to know more. If you are obtaining an alerting regarding that perhaps you need to leverage web browser caching on a third-party request, there is nothing you can do, as you do not have request over their server. Typical perpetrators consist of the Google Analytics manuscript and marketing pixels, like Facebook and Twitter.
- Add Last-Modified and ETag Headers (Validate Cache) – While the cache-control and expires headers help the browser determine if the file has changed since the last time it was requested (or rather they validate the cache), the last-modified and etag headers both validate and set the length of the cache and should be included on every origin server response. If these aren’t properly set you might see a warning that you need to “Specify a cache validator.”.
If the headers are not discovered, it will create a new ask for the resource every time, which increases the load on your server. Making use of caching headers makes sure that subsequent requests do not have to be filled from the server, therefore saving bandwidth, and boosting performance for the customer. You can discover some more details here.
- Increase your limits – For example, PHP memory_limit on the web server is crucial for your performance. Many times, it imposes restrict limits and is one of the main reasons why you get errors and crashes. If you are encountering the memory size wore down error, you can try boosting the PHP memory limit. Here’s how.
Optimize Front-End: Minimize & Defer & Merge
Now we will dive right into some methods you can speed up WordPress by enhancing the front-end. Usually, these are the most notorious and best-known factors. Most people relate only these methods when talking about WordPress speed optimization.
Front-end commonly entails anything that is taken care of totally by the client-side browser, such as CSS, JavaScript, photos, and so on. This likewise consists of examining exterior services you have packing on your website and just how they are influencing your overall load time.
This is an area where our motto: “less is more”, gets a bigger importance. In fact, one of the most important objectives you should have when it concerns front-end optimization is decreasing your general website size. The dimension of your CSS, JavaScript, HTML and images matters. A 4 MB website is generally going to load a whole lot slower than a 1 MB website. Another aspect to consider is the quantity of requests needed to serve your website. With HTTP/2 multiple requests and responses can now be sent at the same time using a single TCP connection. While this is awesome for performance, reducing HTTP requests can still help speed up your WordPress site.
There are a lot of tools to measure your performance (GTmetrix, Pingdom, Page Speed, etc…), but please, do not get obsessed by scores. Instead focus your energy on what really matters: loading times and user-experience. In the end of the day that is what really matters to your business, not having 80%, 90%, 98%…
In fact, you may achieve 100%… with an empty page, right? In the real world, where your users interact with your website, there are no score measures, only speed, or lack of it.
One practical example: If you use any kind of form on your website, you can lower the time your website takes to completely load (and get a better score on most tools) simply by disabling Repatcha. But, does it make sense from security point of view? Maybe not…
Another example: Imagine that you have a contact form on Home Page. On simple way to increase the score is to remove it. Does it make sense from your business objectives?
So, what I mean is… What do you prefer: having a website that loads on 1 second and gets 90% on some measuring tool, or a website that loads on 3 seconds, but has a magnifico 99% score? If you are like us, I bet you would prefer the first case, right?
Here is your first big mindset blowing thought – there is not a direct proportional relationship between scores and speed. In many cases, that relation is even contradictory. Scores are built using a set of best practices, but they totally disregard the real context of usage. We have already seen many, many real examples of this. Speed scores are in a sense, like Facebook likes, or website visitors’ raw number… they are worth what you value them… but, many times, they do not translate into business results, right?
So, now that it is clear how we use scores and speed measures, let us proceed with our speed optimization process.
It is always good to start with a baseline when it comes to optimizing the front-end of your site:
- Pick One Tool and Stick with It – It does not matter so much which speed test tool you use, as it does that your consistent. They all have different ways of quantifying and measuring speed, so pick one tool and stick with it throughout all your testing and optimizations. Use other tools to get differentiated valuable info.
- Do not Obsess Over a Perfect Score – Most of the test tools such as Google PageSpeed Insights all have some sort of rate or efficiency rating. It is crucial to remember that the score doesn’t constantly matter as high as your internet site’s speed as well as viewed performance by the user. Ball game exists to help assess exactly how well you are doing. Obsessing over a perfect 100/100 or an A score in some cases could be a waste of time. And bigger sites with whole lots of external scripts as well as promotions will certainly never ever obtain a best score, which is flawlessly OK.
- The Location of Your Test Matters – The location you choose when rate testing matters quite a bit. As we went gone over in an earlier section, the factor is that this is all relative to the data center area you select. TTFB, network latency, all entered play. Test your site both from a location that is close to your data center and one that is far away. This will likewise help you see just how much of an impact a CDN can carry your WordPress site. Also, focus on the most important regions for your business, I mean… where you get your users.
- Because of Caching, test Multiple Times – As we discussed previously in the section concerning caching, if the cache has actually just recently been gotten rid of or is run out on your WordPress host or CDN, it’s going to register a “MISS” on the HTTP header. This means your website or asset is not serving from cache. To properly see the rate of your whole website you require to see everything tons from cache, your first page, as well as all possessions register a “HIT.” This sometimes needs running your rate examination numerous times. You can after that take the standard.
- Remove Query Strings – A common warning or recommendation people see in speed test tools is that you should remove query strings. Well, basically how it works is that your CSS and JavaScript files usually have the file version on the end of their URLs, such as https:// domain.com/file.min.css?ver=4.5.3. You can utilize a plugin like Perfmatters or WP Rocket which has a simple one-click choice to remove question strings.
- Remove Render-Blocking JavaScript as well as CSS – When you have files preventing the page from loading as fast as possible, a warning about render-blocking JavaScript and CSS might appear. JS as well as CSS are occasionally conditional, implying they aren’t needed to display above-the-fold content. You can prevent them from becoming render-blocking by making use of async and also defer features. To eliminate render-blocking JavaScript as well as CSS you require to do the following: Clear JS from the Critical Rendering Path, Relocating JavaScript out of the critical making path is usually done by including either the delay or the async characteristic to the manuscript HTML elements that call JavaScript sources.
The async feature tells the web browser to start downloading the source immediately without reducing HTML parsing. When the resource is offered, HTML parsing is paused so the resource can be loaded.
The delay attribute informs the internet browser to resist on downloading and install the resource until HTML parsing is complete. Once the browser has done with the HTML it will then download as well as make all delayed manuscripts in the order in which they appear in the file.
- Optimize Delivery of CSS Resources – Optimizing the shipment of CSS basically suggests you require to identify just how to make it non-render stopping. Identify the designs that are needed to make above-the-fold material and provide those styles inline with the HTML. Usage CSS conditionally on devices just when needed. Load continuing to be CSS asynchronously.
- Integrate External CSS as well as JavaScript in WordPress – The incorporate outside CSS caution is usually seen when utilizing a CDN since you are organizing your CSS files on an external domain name, such as cdn.domain.com. In the past, a quick method to fix this is to concatenate your CSS data or integrate them so that they are loading in a solitary demand.
Nevertheless, if you are running over HTTPS with a company that supports HTTP/2, this caution is no longer as appropriate as it utilized to be. With HTTP/2 several CSS data can currently be filled in parallel over a solitary link. And over 86% of web browsers sustain HTTP/2. In some instances, we have seen this still speed up WordPress sites. This is one optimization we recommend you still test on your site.
One of the easiest ways to incorporate your exterior CSS and JavaScript files is with the free Autoptimize plugin. You can additionally do this with the WP Rocket plugin.
- Use Minification on HTML, CSS, and JavaScript – You can reduce the amount of data the web browser needs to download by minifying HTML, CSS as well as JavaScript resources. Minification is the process of eliminating unnecessary personalities like comments as well as whitespace from the resource code. These characters are extremely valuable in growth, but they are pointless for the internet browser to make the web page.
- Use Cookie-Free Domains – Usually, when you are serving content such as photos, JavaScript, CSS, there is no factor for an HTTP cookie to accompany it, as it develops extra overhead. As soon as the server sets a cookie for a specific domain, all succeeding HTTP ask for that domain name should include the cookie. This caution is typically seen on websites with a great deal of requests.
- Disable Embeds in WordPress – They merged the oEmbed feature into core when they released WordPress 4.4. This permits users to install YouTube videos, tweets as well as lots of other resources on their sites just by pasting a URL, which WordPress instantly exchanges an installed and gives a live sneak peek in the visual editor. With the update, WordPress itself ended up being an oEmbed carrier. What this means is that it also generates an additional HTTP request on your WordPress site to load the wp-embed. And this loads site wide.
- Disable Emojis in WordPress – The big issue with this is that it generates an additional HTTP request on your WordPress site to load the wp-emoji-release. And this loads site wide. There are several various ways to disable Emojis in WordPress. You can do it with a complimentary plugin or with code.
So, here you have… a lot of tasks you must do to achieve the best performance on your website. Please remember, this is a ongoing task… you should regularly check everything.
