wordpress speed and performance

April 10, 2024

5 Best WordPress Caching Plugins to Speed Up Your Website (2024)

Are you looking for the best WordPress caching plugin for your website?

Caching essentially stores a copy of your WordPress site on your server. When users open your website again, the server can simply pull up the copy so that visitors won’t have to reload your site from scratch again.

Since there are so many different WordPress cache plugins, it can feel overwhelming to pick the right option.

To help you pick the best plugin, we tested some of the best options on the market. While testing, we focused on a bunch of factors like ease of use, caching options, and price.

In this guide, we will show you the best WordPress caching plugins to improve your site speed.

In a hurry? No worries! Take a look at our top picks so you can quickly choose the right WordPress cache plugin for your site.

Ranking	Plugin	Best For	Price
#1	WP Rocket	Overall performance	$59/year	Read more
#2	WP Super Cache	Beginners	Free	Read more
#3	W3 Total Cache	Multiple caching options	Free + paid	Read more
#4	Sucuri	Firewall + caching	$9.99/month	Read more
#5	Cache Enabler	Simple caching	Free	Read more

Why Use a WordPress Caching Plugin?

Using a WordPress caching plugin is one of the easiest ways to increase your website speed. When installed, the caching plugin will store parts of your site (like static HTML files, CSS files, JavaScript files, and so on) on your server.

Every time someone visits your site, they are served the cached version of the site instead of having to wait for your server to load the web pages from the beginning.

By storing cached pages of your site, a caching plugin drastically reduces the amount of processing required to serve those pages. Some cache content at the server level and others leverage browser caching. This leads to:

A faster website and better WordPress SEO. Search engines give a significant SEO advantage to fast web pages, which helps you rank higher in search results.
More power to handle larger amounts of traffic without slowing down your site performance or affecting your uptime. This is important if you run an eCommerce website.

Plus, caching can create a better user experience. Users who visit your site will experience faster page loading times, making it less likely for them to bounce from your site.

The probability of bounce increases 32% as page load time goes from 1 second to 3 seconds.
Think with Google

How We Tested and Reviewed WordPress Caching Plugins

We used them on our websites: Throughout the years, we have used different WordPress cache plugins on our websites to improve our site performance.
We tested the most popular plugins: We tested some of the most popular caching plugins on the market to see if they are worth the hype. We analyzed those plugins based on the following factors: ease of use, features, types of caching, and pricing.
We categorized them based on your needs: Not every website will benefit from the same caching plugin. That’s why we analyzed all the features to help you decide which tool fits your needs.

Why Trust WPBeginner

At WPBeginner, we are a dedicated team of people with over 16 years of experience in WordPress, design, and online marketing. Our WordPress experts extensively review each plugin or tool that is featured here and thoroughly test them on real websites. To learn more, you can see our complete editorial process.

1. WP Rocket

After trying out different plugins from this list, we found WP Rocket to be the overall best WordPress caching plugin. It is the easiest and most beginner-friendly option, which is a big help if you are new to this topic.

With WP Rocket, WordPress users can instantly cache their website with just one click. Once the plugin is activated, its crawler automatically fetches the WordPress pages to build up the cache.

The plugin then automatically turns on the recommended WordPress caching settings. These include page caching, cache preloading, Gzip compression, browser caching, and mobile device caching.

WP Rocket also offers optional features to configure to improve your website performance further. These include lazy loading images, CDN (content delivery network) support, minification, and more.

Pros of WP Rocket:

User-friendly plugin interface for beginners.
Essential caching functions are available out of the box, from page caching and browser caching to mobile device caching.
Additional optimization features to speed up your website loading time, like options to minify CSS files and enable a CDN integration.
Advanced features like database optimization, multisite support, and cache exclusions based on URLs or cookies.
Supports caching for dynamic content, including WooCommerce cart items.

Cons of WP Rocket:

Unfortunately, there is no free version, but WP Rocket does offer a 14-day money-back guarantee.

Pricing: Starting from $59 per year for one website, product updates, and support.

Why we chose WP Rocket: We have reviewed WP Rocket before at WPBeginner, and we strongly recommend it as the best WordPress caching plugin on the market. While there is no free version, its prices are quite affordable compared to other paid options.

You can also check out our step-by-step guide on how to install and set up WP Rocket in WordPress.

2. WP Super Cache

WP Super Cache is a popular, free caching plugin created by Automattic, the company that runs WordPress.com.

This WordPress caching plugin has 2 caching settings: Expert and Simple. The first one is a much faster option than the other because it doesn’t execute any PHP scripts, but it does require you to edit your .htaccess file.

The second is a happy medium between fast site loading speed and ease of use. We recommend choosing this method instead if you are not confident editing your own .htaccess file.

Other than that, WP Super Cache includes other speed optimization features like cache preloading. This setting will generate cached files of your pages, posts, categories, and tags that are ready to load as soon as someone accesses the content for the first time.

Pros of WP Super Cache:

Completely free of charge.
Advanced caching settings are available, such as expert caching that can handle high traffic and custom caching options to control how the plugin works.
Cache garbage collection to delete old cache pages and keep your website updated.
Basic CDN support that will rewrite your website content URLs so that they are loaded with CDN.

Cons of WP Super Cache:

While the interface is pretty user-friendly, it uses technical terms designed for advanced users that may confuse beginners.

Pricing: Free plugin.

Why we chose WP Super Cache: If you are looking for a free caching plugin to speed up your website loading time, then WP Super Cache is a great choice.

For beginners, we recommend taking the time to explore the plugin and understand some of the more technical terms so that you can make the most of it. See our article on how to install and set up WP Super Cache for detailed instructions.

3. W3 Total Cache

If you want to use a WordPress caching plugin with tons of optimization features, then check out W3 Total Cache.

Firstly, W3 Total Cache offers various types of caching besides page caching and browser caching. It also has object caching and database caching, both of which can speed up the execution of dynamic parts of your site (the ones that change frequently), not just the static ones.

Secondly, it has a Google PageSpeed Insights integration. During our testing, we liked that this feature lets you test your website speed without leaving your WordPress admin area, so it’s very user-friendly.

Other than that, you can find other speed enhancement features like CSS and JS file minification, lazy loading, and an image converter from other formats to WebP for better performance.

Pros of W3 Total Cache:

Multiple caching options are available for free: page caching, browser caching, opcode caching, database query caching, and object caching.
Google PageSpeed Insights integration to test website speed.
Image optimization features like lazy loading and WebP conversion.
Pro features in the premium version, like CDN support for the entire website and fragment caching for plugins and themes using the WordPress Transient API.

Cons of W3 Total Cache:

The feature set is comprehensive but can seem intimidating for beginners.
Unlike other plugins on the list, the preloading feature is not available out of the box.

Pricing: Free plugin available. The premium version’s plans start from $99 per year for one website license.

Why we chose W3 Total Cache: The free version of W3 Total Cache offers many caching options that you may not find in other plugins on the list, especially not in the free versions.

That said, the sheer range of features can feel overwhelming for beginners. For detailed setup instructions, see our article on how to install and set up the W3 Total Cache plugin.

4. Sucuri

Sucuri is technically a WordPress firewall plugin, but it has built-in caching options to speed up your website in just a few clicks. We used to use Sucuri on WPBeginner, so we are very familiar with this plugin.

If you run an online store or a membership site, Sucuri recommends using Site Caching, which will keep your cache for up to 180 minutes. Meanwhile, blogs or news portals can use Minimal Caching, which will only cache your pages for up to 8 minutes before they are refreshed.

If you make significant changes to your site, then you can clear your old cache in one click. Sucuri also lets you clear the cache for a file or folder instead of the whole site. This allows you to optimize specific parts of your site without affecting its entirety.

Additionally, Sucuri supports Brotli, a data compression algorithm by Google that is faster than Gzip compression. It’s effective for compressing large files and reducing bandwidth usage. This means people with slow internet can visit your website quicker.

Pros of Sucuri:

Easy-to-use caching features that can be enabled in a few clicks.
User-friendly cache-clearing functions for the entire website and specific files or folders.
Support for compression algorithms, like the more popular Gzip, and a newer option like Brotli.
Reliable CDN service with worldwide network coverage, a great feature for websites with a global audience.
Top-notch security features like a web application firewall, malware removal, and DDoS protection.

Cons of Sucuri:

If you are just looking for a plugin with caching functionality, then Sucuri may seem like overkill.

Pricing: Comes in two types of subscription plans: Website Security Platform and Firewall with CDN. The first starts from $199.99 per year and includes the complete Sucuri security kit. The second starts from $9.99 per month and only comes with a firewall and CDN.

Why we chose Sucuri: If you are looking for a security plugin that doubles as an optimization plugin, then Sucuri is the perfect solution. Besides offering user-friendly caching features, you can get great protection without installing other plugins.

5. Cache Enabler by KeyCDN

Cache Enabler is a free WordPress caching plugin by KeyCDN, one of the most popular WordPress CDN services.

When we first activated the plugin, the plugin page looked rather simple. In reality, it’s quite powerful on its own. You can customize how long cached files last to suit your website needs instead of choosing a time period that’s been set for you.

There are also many cache-clearing settings that you can enable. For example, you can automatically clear the cache when a post type has been published, updated, or trashed so that your blog content stays up-to-date.

Pros of Cache Enabler:

Simple-to-use plugin page interface that’s easy to understand for beginners.
Gzip and Brotli compression support to reduce your file sizes.
Custom post types support, which is great for portfolios, online stores, membership sites, and so on.
A real-time display of your website’s cache size in the WordPress dashboard helps you keep track of how much space your cache is taking on your server.

Cons of Cache Enabler:

Compared to other caching plugins on the list, the features of Cache Enabler can seem pretty limited.

Pricing: Free plugin. However, if you choose to get KeyCDN as well, then the prices start from $0.04 per GB per month for the first 10 TB (for North America/Europe region). The cost varies by region, but you can use its pricing calculator to get estimates.

Why we chose Cache Enabler: As a free caching plugin, Cache Enabler is great at being easy to use yet packed with the most essential caching features. It can be a good option if you just need a simple caching solution.

Bonus Tip: Use Built-in Caching Features From Hosting Providers

These days, many WordPress hosting companies offer their own built-in caching solutions.

The benefit of using these built-in caching settings is that you won’t have to find or install a plugin yourself. Plus, the caching functionality is readily optimized for your hosting, so you may experience fewer errors.

The downside is that the feature set widely varies. Some may only include basic page caching, while others may have more advanced options. Depending on your website, you may not be able to rely solely on these built-in options.

That being said, we still think these hosting caching settings are worth talking about because they are very easy to enable. Let’s look at the caching features offered by some of the most popular web hosting providers on the market.

Bluehost

Bluehost is one of the biggest hosting companies in the world and an officially recommended WordPress hosting provider. Their hosting plans include built-in caching that you can enable from your hosting dashboard.

You can select one of these caching levels:

Assets Only – For eCommerce and sites that update frequently or display real-time information, you can use this level to cache your site’s static assets for 5 minutes.
Assets & Web Pages – If you have a WordPress blog, an educational site, or a website that updates at least once a week, consider using this level to cache static assets for 6 hours and other web pages for 5 minutes.
Assets & Web Pages – Extended – For portfolios or websites that update every month or less frequently, you can choose this option to cache static assets for 1 week and web pages for 5 minutes.

If you compare Bluehost’s caching options to the other plugins on the list, they may seem basic. But they also offer a Cloudflare CDN integration to boost your website performance further.

SiteGround

We use SiteGround to power WPBeginner and have seen many performance improvements since we switched. If you are curious, then you can check out our article on why we switched to SiteGround for more information.

By default, SiteGround offers 3 caching solutions: Nginx Direct Delivery for static content, Dynamic Cache, and Memcached (optional).

The last two are caching modules that not many WordPress hosting offers by default, which is what makes SiteGround so powerful. In fact, they can improve your website speed anywhere from 50% to 500%.

For WordPress sites, SiteGround recommends installing their Speed Optimizer plugin to speed up your website by 20%. The plugin can also compress image sizes by up to 85% without losing quality.

Overall, if you use SiteGround, you really won’t need any caching plugins like WP Rocket or others.

Hostinger

Hostinger is one of the fastest-growing WordPress hosting providers in recent years. They are powered by the LiteSpeed Web Server, so their caching settings also come from LiteSpeed.

From the get-go, Hostinger offers two types of caching modules: the LiteSpeed Cache plugin and the Object Cache.

The LiteSpeed Cache plugin is included in all plans and offers page caching, cache preloading, and image compression for your website. By default, Hostinger will update your cache every 30 minutes.

Meanwhile, the Object Cache will cache your database queries and is only available for Business plan users or above. It has been said to improve website speed by up to 3 times.

WP Engine

WP Engine is a managed WordPress hosting company, which means they will take care of most of your back-end maintenance tasks as much as possible. As a result, you won’t have to handle them as much.

Since WP Engine is a more premium hosting service, it comes with tons of caching features by default. These include page caching, CDN caching, object caching, and local browser caching.

You can also set exclusion rules for dynamic content, like shopping cart, checkout, or login pages. If you need to clear your cache, then you can just log in to your user portal and click a few buttons.

What Is the Best Cache Plugin for WordPress?

After comparing the different options on the list, we found that the best WordPress caching plugin is hands down WP Rocket. It has a great balance between being beginner-friendly and powerful to elevate your website performance.

If you are looking for a free caching plugin, then we recommend W3 Total Cache. It has plenty of caching features out of the box, from basic to advanced.

We also recommend checking out the caching modules that hosting providers like Bluehost have to offer. These may already be good enough to speed up your website, and they are already customized to suit your hosting needs.

Best WordPress Caching Plugins: FAQs Answered

Now that we’ve covered the list of best WordPress caching plugins, let’s answer some frequently asked questions.

Do I need a caching plugin?

Yes, we strongly recommend installing a WordPress caching plugin, as it can significantly improve your WordPress site’s speed.

Caching can reduce server load, improve the user experience by reducing load times, and potentially boost your site’s SEO rankings due to improved speed.

However, if your hosting provider offers built-in caching solutions like SiteGround, then you might not need to install a separate caching plugin.

Should I use multiple cache plugins in WordPress?

Using multiple caching plugins simultaneously can lead to conflicts and potential issues with your site. We generally recommend using only one caching plugin to avoid these problems.

However, if you need to use multiple caching tools for specific purposes, make sure they can complement each other and do not result in the same action being performed twice.

Which is better: WP Super Cache or W3 Total Cache?

Both WP Super Cache and W3 Total Cache are highly-rated WordPress caching plugins. However, the choice between the two depends on your specific needs and preferences.

WP Super Cache is a free plugin with some basic and advanced caching features. But some settings require some technical knowledge, so we don’t recommend it if you are a complete beginner.

W3 Total Cache is a freemium plugin with a comprehensive set of caching settings. The abundance of features may intimidate beginners, but the ease of use is generally much better than WP Super Cache.

Check Out More Guides to Speed Up WordPress

We hope this article helped you find the WordPress caching plugin to speed up your website. You may also want to see our list of the best WordPress plugins for business websites, and the best WordPress SEO plugins to help you boost your rankings.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Disclaimer: We also looked at other WordPress cache plugins and solutions for this article, including WP Fastest Cache, Hummingbird, and WP-Optimize. However, we picked only the very best WordPress caching plugins to help you avoid choice paralysis.

The post 5 Best WordPress Caching Plugins to Speed Up Your Website (2024) first appeared on WPBeginner.

November 17, 2023

How to Stress Test a WordPress Website (2023)

Do you want to know how your site will perform in case of a traffic surge?

Stress testing a WordPress website will show how your website will perform under different situations. This way, you can ensure fast performance and resolve any issues.

In this article, we will show you how to stress test a WordPress website.

What is a WordPress Stress Test?

A WordPress stress test lets you see how your website will perform in high-traffic situations. It helps you prepare for spikes in traffic and see how your site handles the load.

Usually, the amount of traffic a website can withstand is determined by your WordPress hosting plan. However, stress testing helps find these limits and uncovers issues that might occur due to high traffic.

For instance, a sudden spike in traffic can cause your site to crash and utilize all the server resources. Similarly, you can also see which WordPress plugins, themes, code snippets, and images malfunction in extreme conditions.

With stress testing, you can easily fix any issues or correct a setting that might be misconfigured. As a result, you’ll offer a better user experience and be prepared for high-traffic situations.

That said, let’s see how to stress test a WordPress website.

Stress Testing a WordPress Website

When it comes to measuring the performance of your WordPress website, you’ll find lots of speed test tools, like PageSpeed Insights, Pingdom, or GTmetrix.

While these tools help find out how fast your site loads, they don’t tell you how a website will perform under high traffic.

To stress a WordPress site, we’ll be using Loader.io for this tutorial. It is a free tool that simulates high-traffic situations and performs a series of tests.

Sign Up for a Free Loader.io Account

First, you’ll need to visit the Loader.io website and create a free account. Simply click the ‘Sign Up Now’ button to get started.

After that, you will see different pricing plans offered by the tool.

Go ahead and select the ‘Free’ pricing plan.

Next, you can enter details to sign up for a new account.

Loader.io will ask for a company name, email address, and password. Once you’ve added these details, simply check the reCaptcha box and click the ‘Sign Up’ button.

Enter information to create a free loader account

You also receive a verification email. Simply check your inbox and click the link in the email to verify your account.

Adding a New Host to Loader.io

After that, you can set up a target host by clicking the ‘+ New Host’ button.

Next, you’ll need to enter your domain name.

Once that’s done, simply click the ‘Next: Verify’ button.

Next, you will need to verify your domain. You can do this by verifying over HTTP or DNS.

For this tutorial, we will use the ‘Verify over HTTP’ option and download the verification file. Go ahead and click the ‘download’ link and save the file on your computer.

After downloading the file, you’ll need to upload it to your site’s root folder. This is usually called the ‘public_html’ folder.

To upload the file, you can use an FTP client. For more details, please see our guide on how to use FTP to upload files to WordPress.

After uploading the file, you can return to the Loader.io website and click the ‘Verify’ button.

Upon verification, you should see a success message.

Next, you’ll need to click the ‘New Test’ button and set up a stress test for your website.

Configuring Your Stress Test Settings

On the next screen, you can change the settings for your stress test. You can start by adding a name for your test.

After that, you’ll need to select the test type. Loader.io offers 3 test types, which include:

Clients per test – In this, you can test how your site will work when a specific number of visitors visit your site for a specified amount of time. You can set the number of clients and the duration.
Clients per second – This scenario will test your site for a specified number of client requests per second.
Maintain client load – Under this test type, a constant client count is maintained throughout the duration of the test. It stress tests your site when there is a constant load for a specific time.

We would recommend running multiple tests using each of these types. This will help uncover any issues that your site might encounter under different scenarios.

If you scroll down, then you’ll see Client Requests settings. For general testing, we recommend using the default settings and you don’t need to change anything.

Now, you’re ready to stress test your WordPress site. Go ahead and click the ‘Run test’ button.

Analyze Your Stress Test Results

Loader.io will run the stress test for your website and compile the results. You can then analyze them to see how your site performs under high-traffic situations.

For instance, you can start by looking at the average response time. The lower the response time, the faster your website’s loading speed.

In our testing, the average response time was 590 milliseconds or 0.59 seconds when 250 clients visited the site for 1 minute.

This is fairly decent reading and shows that the website didn’t slow down considerably under high load.

However, the maximum response time recorded was 10489 ms or 10.489 seconds. You can now look at the graph below to see when the response time jumps compared to the number of clients.

For instance, our testing showed that there was a spike when the number of clients exceeded 150 and the maximum response time was seen when the number of clients almost reached 200.

Using these insights, you will have a rough idea of how your site will perform when a certain number of people visit it.

You can now repeat this step and run multiple tests using different scenarios. For instance, try increasing the number of clients, testing the duration, and use different test types.

Tips to Improve Response Time & Boost Performance

If WordPress load tests show slow performance under high-traffic situations, then you can try different things to speed up your site.

Here are some tips for improving response time and handling high traffic load:

1. Upgrade Your WordPress Hosting Plan – If you’re using a hosting plan that has limits on the number of visitors per month, then consider upgrading to a higher hosting plan. This way, you’ll get more server resources and your site can handle extra traffic when there is a spike. You can also see our detailed comparison of the fastest WordPress hosting services to learn more.

2. Use a Caching Plugin – A caching plugin reduces the load on your site’s server and helps improve performance. It serves a static version of the site to users instead of going through the entire process of requesting a webpage. As a result, your site loads faster and you provide a better user experience.

3. Set Up a Content Delivery Network (CDN) – A CDN is a network of servers that deliver cached static content to users based on their location. It helps lower the load on your site server and improve the response time.

4. Optimize Your Images and Videos – Unoptimized images can lead to performance issues on your site and increase load on the server. To start, you can compress large image files to lower response time. If you’re hosting videos on your site, then consider uploading them to YouTube or Vimeo and embedding them in your content.

5. Remove Unused Plugins and Themes – If you have WordPress plugins and themes that are not in use or are resource-heavy, then consider removing them. They can slow down your WordPress site by loading unused scripts and utilizing a lot of server resources.

For more tips on improving your site’s performance, please see our guide to boost WordPress Speed and Performance.

We hope this article helped you learn how to stress test a WordPress website. You may also want to see our guide on the most common WordPress errors and how to fix them, and ultimate guide to WordPress SEO.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Stress Test a WordPress Website (2023) first appeared on WPBeginner.

August 25, 2023

What Is Google’s INP Score and How to Improve It in WordPress

Are you wondering what Google’s INP score is and how to improve it on your WordPress website?

Interaction to Next Paint (INP) is a Core Web Vitals metric from Google. Improving this score will make your website feel more responsive to your users.

In this article, we will show you how to improve your Google INP score in WordPress and explain what Google’s INP score is.

What is Google INP score and how to improve it in WordPress

Here is a quick overview of the topics we will cover in this guide:

What Are Google Core Web Vitals?
What Is Google INP?
Why Is Google Changing the FID Metric to INP?
How to Measure Google INP Score in WordPress
How to Improve Google INP Score in WordPress
How Website Owners Can Optimize Their Sites for INP
How Developers Can Optimize Their Code for INP
Examples of Good JavaScript Coding Practices for Developers

What Are Google Core Web Vitals?

Google Core Web Vitals are website performance metrics that Google considers important for overall user experience. These web vital scores are part of Google’s overall page experience score, which will impact your SEO rankings.

These metrics are useful because, even if your WordPress website loads fast, it may not be fully functional for users. Even if a page has loaded, a visitor might not be able to do what they want or access the information they need.

Core Web Vitals are designed to help with this. They let you measure how quickly your website loads, becomes visible, and is ready for your visitors to use.

To do that, Google uses three quality tests:

Largest Contentful Paint (LCP)
First Input Delay (FID)
Cumulative Layout Shift (CLS)

You can learn more about these tests in our ultimate guide on how to optimize Core Web Vitals for WordPress.

However, Google is replacing FID with a new test called INP (Interaction to Next Paint).

This change currently has the status of ‘Pending’ and will be finalized in March 2024. This gives you time to prepare so that your SEO rankings are not impacted, and we will show you how later in this article.

What Is Google INP?

INP stands for ‘Interaction to Next Paint’. It is a new Google Core Web Vital metric that measures the user interactions that cause delays on your website.

The INP test measures how long it takes between a user interacting with your website, like clicking on something, and your content visually updating in response. This visual update is called the ‘next paint’.

For example, a user might submit a contact form on your site, click on a button, or select an image that opens in a lightbox. The INP test will measure the time taken between the user performing these interactions and actually seeing the updated content on your website.

The Google test then comes up with a single INP score based on the duration of most user interactions on your website. The score will either be ‘Good’, ‘Needs Improvement’, or ‘Poor’, depending on how long your website takes to update visually.

Why Is Google Changing the FID Metric to INP?

The current FID test measures how quickly your website responds to the first user input after the page loads, such as a mouse click or keyboard press. It does this by measuring the time between the first input from the user and when your website starts to act on that input.

In other words, it measures how responsive your website is when it first loads and the first impression that it gives to real users.

However, this metric isn’t as helpful as it could be. There are two limitations to the FID test:

It only measures the first user interaction, not all of them.
It only measures until the website starts to process the interaction, not when the user can actually see the visual feedback on the screen.

So Google is changing the test to give a more complete picture of the overall responsiveness of a web page. INP will measure the entire time the user spends there until they leave the page.

How to Measure Google INP Score in WordPress

The easiest way to test your Google Core Web Vitals score is by using the PageSpeed Insights tool. Simply enter the URL you want to test and click the ‘Analyze’ button.

Analyzing a Web Page for Page Speed Insights

The tool will analyze the web page for a few seconds and then show you the test results.

Note: You can also view Core Web Vitals using DebugBear’s Free Website Speed Test or Site Speed Chrome Extension, which are preferred by some developers.

Now, along with other Google Core Web Vitals, you will also see the page’s Interaction to Next Paint (INP) score.

There will be different scores for mobile and desktop users.

In the screenshot above, you can see the INP score for desktop users viewing this web page on WPBeginner is 47 ms. The green dot means that this is a good score.

Once you can see the score for your own site, you will probably be wondering how it compares with other websites and whether it needs to be improved.

Google has provided some guidelines for interpreting your INP score:

Faster than 200 milliseconds – good responsiveness
200-500 milliseconds – needs improvement
Slower than 500 milliseconds – poor responsiveness

Make sure you check your score for both mobile and desktop users and aim for good responsiveness.

You can then improve your INP score by following the guidelines in the sections below.

Case Study: Finding Slow Interactions on Awesome Motive’s Websites

But first, it may be helpful to look at a case study. We have started measuring the INP scores on our brand sites, including All in One SEO, MonsterInsights, and WPForms.

When our team checked our website’s INP scores, the initial results showed that our most popular pages needed improvement.

Using the Chrome User Experience (CrUX) dashboard, we could see that:

80% of our sessions were rated ‘good’
12% of our sessions were rated ‘needs improvement’
8% of our sessions were rated ‘poor’

Now, we don’t yet know which specific interactions on our pages are slow and need to be optimized. This information isn’t provided by Google while testing.

That means that next, we will need to run our own tests to find slow interactions on pages with lower INP scores. This is a detailed and advanced task that is best performed by a developer.

It is done by going to each page that needs improvement and then testing each interaction with actual clicks, taps, and key presses. These need to be timed and evaluated using tools.

The Chrome Developers Blog lists a number of tools that can be used for testing, such as the Chrome Web Vitals extension and the new timespan mode in the Lighthouse Panel in DevTools. You can also see Google’s article on how to debug using the Web Vitals extension.

It’s important to note that the sessions with lower ratings most likely took place on slower devices or connections. That means that while testing, it is recommended to throttle your browser’s speed, or you may not spot the slow interactions.

You can do that using Chrome’s Inspect Element feature by going to View » Developer » Inspect Elements. You can switch to the ‘Network’ tab and select a throttling option from the dropdown menu.

Using Chrome Inspect Elements to Throttle Your Browser

Once you have found the INP scores for your pages, you can use the tips in the next section of this tutorial to improve them.

How to Improve Google INP Score in WordPress

Most of the INP score optimization work will need to be done by developers. That includes the authors of the theme and plugins you use on your website, plus the developers of any custom JavaScript you are running.

That’s because the INP score is mostly related to the time required to perform JavaScript interactions on your website.

For example, when a user clicks a button, some JavaScript code is run to perform the function expected by clicking the button. This code is downloaded to the user’s computer and runs in their web browser.

To optimize your INP score, the delays that happen during JavaScript user interactions must be reduced. There are three components to this delay:

Input delay, which happens when your website is waiting for background tasks on that page that prevent the event handler from running.
Processing time, which is the time required to run event handlers in JavaScript.
Presentation delay, which is the time required to recalculate the page and paint the page content on the screen.

As a website owner, there are steps you can take to improve the first and third delays. We will show you how in the next section.

However, to make real improvements to your INP score, you will need to improve the second delay, which is the processing time of the code itself. That’s not something that you can do yourself.

The developers of your WordPress theme, plugins, and custom JavaScript may need to optimize their code to give feedback to your users immediately. The good news is they are probably already working on this to meet the March 2024 deadline.

We offer some specific tips for developers with examples later in this article.

How Website Owners Can Optimize Their Sites for INP

While the most significant impact on your website’s INP score will come from developers optimizing their code, there are a few things that website owners can do.

In particular, you can make sure that your users’ mouse clicks and keystrokes are recognized as soon as possible by optimizing background processes on your site. Also, you can make sure the response to their input is displayed on the screen as quickly as possible.

Here are some steps you can take to achieve that.

1. Make Sure You Are Running the Latest Version of WordPress

The first thing you should do is make sure you are running the latest version of WordPress.

That’s because WordPress versions 6.2 and 6.3 introduced significant performance improvements. These will improve your website’s performance on the server side and client side, which will improve your INP score.

For detailed instructions, you can see our guide on how to safely update WordPress.

2. Optimize Background Processes in WordPress

Background processes are scheduled tasks in WordPress that run in the background. They might include checking for WordPress updates, publishing scheduled posts, and backing up your website.

If your website gets too busy running these background tasks, then it may not realize right away that the user has clicked the mouse or pressed a key, resulting in a poor INP score.

You may be able to configure your background scripts and plugins to reduce the amount of work they are doing, placing less strain on your website. Otherwise, you might be able to run them only when they are needed instead of leaving them running in the background.

For detailed instructions, you can see the Optimize Background Processes section of our ultimate guide on how to boost WordPress speed and performance.

3. Check the PageSpeed Insights Performance Recommendations

After you run the PageSpeed Insights test on your website, you can scroll down to the Performance section of the test results.

Here, you will find some opportunities to improve your site’s performance along with the estimated time savings if you follow the advice.

PageSpeed Insights Performance Opportunities and Diagnostics

For example, you may see recommendations to eliminate render-blocking resources. You can do this by following our guide on how to fix render-blocking JavaScript and CSS in WordPress.

You may also see a recommendation to reduce unused JavaScript. You will find a setting to do this in many of the best WordPress caching plugins, such as WP Rocket.

4. Minify JavaScript in WordPress

JavaScript needs to be downloaded to the user’s computer before it can be run. By making your JavaScript files as small as possible, you can make some small gains in performance.

Minifying your JavaScript makes the files smaller by removing white spaces, lines, and unnecessary characters from the source code.

This won’t have a dramatic effect on your performance, but if you are looking to shave a few extra milliseconds off your INP score, then you may find it worthwhile.

To learn how, you can see our guide on how to minify CSS and JavaScript files in WordPress.

How Developers Can Optimize Their Code for INP

If you are a developer, then the biggest INP score gains will come from optimizing your code. Here are a few things you can do.

1. Visually Acknowledge User Input Immediately

Here’s the one thing that will make the most difference when optimizing your code’s INP score: You need to give visual feedback to all user input immediately.

The user should see right away that their input has been recognized and that you are acting on it. This will make your code feel more responsive to the user and result in a great INP score.

Here are a few examples:

If a user clicks on an element, then you should display something that shows that the element was clicked.
If a user submits a form, then you need to immediately display something to acknowledge that, such as a message or spinner.
If a user clicks on an image to open it in a lightbox, then don’t just wait for the image to load. Instead, you should show a demo image or spinner immediately. Then, when the image is loaded, you can display it in the lightbox.

More than anything else, this will improve your INP score, especially if you need to do heavy JavaScript processing in response to user input.

Just make sure you update the UI before starting the task. After that, you can do the CPU-heavy work in a setTimeout callback or on a separate thread using a web worker, and then finally present the results to the user.

Once you get that right, there are a few more things you can do to optimize your code.

2. Optimize Where the Browser Spends Most of Its Time

The next thing you should do is investigate where the browser is spending most of its time and then optimize those parts.

In Google Chrome, when you navigate to View » Developer » Developer Tools » Performance, it is possible to inspect the JavaScript functions and event handlers that are blocking the next paint.

With that knowledge, you can see what can be optimized in order to reduce the time until the next paint after user interaction.

3. Reduce Your Layouts

Sometimes, a lot of CPU activity consists of layout work.

When that happens, you should check to see if you can reduce the number of relayout functions in your code.

4. Show Above-the-Fold Content First

If rendering the page contents is slow, then your INP score may be affected.

You can consider showing only important ‘above-the-fold’ content first to deliver the next frame more quickly.

Examples of Good JavaScript Coding Practices for Developers

It may be helpful to show you some examples of how bad code can result in a poor INP score.

We put together an example project on CodePen that you can experiment with. You can examine our sample code, read our short explanations, and see the difference it makes by clicking the buttons.

Here’s an animation from that CodePen project. You can see that the unoptimized sample code results in a poor INP score of 965 milliseconds. The button press will feel laggy to users.

By contrast, the optimized code updates the button text immediately, resulting in the best possible INP score.

Animation of CodePen Example Project for Optimizing INP Score

Read on to see four examples of how you can improve your code to optimize the INP score.

Example 1: Update the Screen Before Running a Heavy CPU Task

CPU-heavy tasks take time, and this can lead to poor INP scores unless you write good code. In this case, it’s best to update the screen before running that task.

Here is a bad example where the user interface is updated after a heavy CPU task. This results in a high INP:

// Bad example
button.addEventListener('click', () => {
  // Heavy CPU task
  for (let i = 0; i < 10000000; i++) {
    console.log(i);
  }
  // UI update
  button.textContent = 'Clicked!';});

In this improved example, the user interface is updated immediately when the button is clicked.

After that, the heavy CPU task is moved to a setTimeout callback:

// Better example
button.addEventListener('click', () => {
  // UI update
  button.textContent = 'Processing...';

  // Heavy CPU task
  setTimeout(() => {
    for (let i = 0; i < 10000000; i++)
 {
      console.log(i);
    }
    // Final UI update
    button.textContent = 'Done!';
  }, 0);
});

This allows the browser to update the screen before starting the slow task, resulting in a good INP score.

Example 2: Schedule Non-Urgent Processing

You should also make sure that you don’t run non-urgent or non-essential work in a script immediately when it may delay the response the user is expecting.

You should start by updating the page immediately to acknowledge the user’s input. After that, you can use requestIdleCallback to schedule the rest of the script when there is free time at the end of a frame or when the user is inactive.

Here is an example:

button.addEventListener('click', () => {
  // Immediate UI update
  button.textContent = 'Processing...';

  // Non-essential processing  window.requestIdleCallback(() => {
    // Perform non-essential processing here...    button.textContent = 'Done!';
  });
});

This will make the web page feel more responsive to the user and get you a better INP score.

Example 3: Schedule a Function to Run Before the Next Paint

You can also userequestAnimationFrame to schedule a function to be run before the next repaint:

button.addEventListener('click', () => {
  // Immediate UI update
  button.textContent = 'Processing...';

  // Visual update
  window.requestAnimationFrame(() => {
    // Perform visual update here...    button.style.backgroundColor = 'green';    button.textContent = 'Done!';
  });
});

This can be useful for animations or visual updates in response to user interactions.

Again, you should give the user feedback by acknowledging their input immediately.

Example 4: Avoid Layout Thrashing

Layout thrashing occurs when you repeatedly read and write to the DOM (Document Object Model), causing the browser to recalculate the layout multiple times.

Here is an example of layout thrashing:

// Bad example
elements.forEach(element => {
  const height = element.offsetHeight; // read  element.style.height = height + 'px'; // write});

This can be avoided by batching your reads and writes.

This is a better example:

// Good example
const heights = elements.map(element => element.offsetHeight); // batched read
elements.forEach((element, index) => {
  element.style.height = heights[index] + 'px'; // batched write
});

We hope this tutorial helped you learn how to improve your Google INP score in WordPress. You may also want to see our ultimate guide to WordPress SEO or our expert picks for the best WordPress SEO plugins and tools.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post What Is Google’s INP Score and How to Improve It in WordPress first appeared on WPBeginner.

March 7, 2023

How to Enable Imagick on Your WordPress Site

Do you want to enable Imagick on your WordPress website?

Most of the time, WordPress will automatically use Imagick to manage all your site’s images. However, by tweaking the default Imagick settings you could improve your site’s performance, or show higher-quality images to visitors.

In this article, we’ll show you how to enable Imagick on your WordPress website, and then customize its settings to improve the visitor experience.

How to enable Imagick on your WordPress site

How Does WordPress Use the Imagick Software?

Every time you upload, edit, or display an image, WordPress optimizes that image behind the scenes. This process makes sure your images look great and load quickly.

By default, WordPress uses Imagick or GD Library to optimize images. These are libraries, or collections of pre-written code anyone can use. They allow WordPress to display, create, convert, and edit images.

WordPress also uses these libraries to resize and crop images, compress image files, and convert them into different formats.

Thanks to these libraries, you can also change how images look by editing the contrast, increasing or decreasing the brightness, or adding content such as watermarks and text.

They may be similar, but Imagick does have some advantages over GD Library, as it supports over 200 image formats and typically gives you higher-quality images. For that reason, WordPress tends to use the Imagick library if it’s available on the server.

Why You Should Customize Imagick on Your WordPress Website

Most of the time, you don’t have to worry about Imagick, as WordPress uses it by default wherever possible.

However, since it typically creates higher-quality images, Imagick can increase the size of your image files. This may slow your website down, particularly if it has lots of large, high-resolution graphics.

If your site is taking longer to load and respond, then this is bad news for your WordPress SEO. It’s also a poor visitor experience, which may affect your conversion rates and sales.

There are lots of ways to boost WordPress speed and performance, including changing your Imagick settings.

Some websites have the opposite problem.

Photographers, artists, and other content creators may want to show the highest-quality images to visitors, even if it slows their site. Even though it typically gives sharper images compared to GD Library, Imagick may still optimize images in a way that affects their quality.

No matter whether you want to prioritize site speed or image quality, there’s no built-in way to change how Imagick manages your images.

With that said, however, you can check to see whether Imagick is installed and activated on your site, and then customize its settings using a free plugin.

How to Enable Imagick on Your WordPress Site

The easiest way to customize Imagick is by using ImageMagick Engine. This plugin allows you to change how Imagick processes your images. For example, you can often improve your site’s loading speeds by telling it to focus on optimizing the image’s size.

The plugin can also disable and enable Imagick with just a few clicks. This is perfect if Imagick isn’t already activated on your server.

First, you’ll need to install and activate the plugin. If you need help, then please see our guide on how to install a WordPress plugin.

Upon activation, go to Settings » ImageMagick Engine. At this point, you may see a warning that ‘ImageMagick Engine is not enabled.’

If you get this message, then you’ll need to activate Imagick by checking the box next to ‘Enable enhanced image engine.’

Then, click on ‘Save Changes.’

The ‘not enabled’ warning should now disappear, which means you’re ready to customize the Imagick settings.

Note: Do you see an ‘ImageMagick PHP module not found’ warning instead? This means the ImageMagick module isn’t installed on your server. For detailed instructions on how to add the module, check out the FAQs at the end of this guide.

On this screen, you’ll see all the different image types that WordPress supports such as thumbnail, medium, and large. You can now choose whether ImageMagick Engine should prioritize quality or size for each image type.

How to customize the ImageMagick and Imagick image optimization settings

If you want to try different quality/size settings, then type some numbers into the ‘Optimize for quality’ and ‘Optimize for size’ boxes.

You can use any number between 0-100. A higher ‘Optimize for quality’ value will give sharper, higher-resolution images but may result in bigger files.

Customizing the image optimization settings in WordPress

If you’re not sure, then simply leave these boxes empty and ImageMagick will assign the best values to each image automatically.

When you’re happy with how the plugin is set up, click on ‘Save Changes.’

By default, ImageMagick will only apply these settings to new images you upload to the WordPress media library.

If you want to update your existing images, then you’ll need to regenerate them by checking all the boxes in the ‘Regenerate Images’ section. Then, go ahead and click on ‘Regenerate.’

ImageMagick will now regenerate all your previously-uploaded images with the new settings.

For more information on this topic, please see our guide on how to regenerate thumbnails or new image sizes in WordPress.

FAQs: How to Enable Imagick on Your WordPress Site

Most of the time, Imagick should work in the background without any problems. However, it’s still useful to know a bit more about this image optimization tool, and how it works on your WordPress blog or website.

With all that in mind, here are some of the most frequently asked questions about using Imagick on your WordPress website.

What’s the Difference Between ImageMagick and Imagick?

You’ll often read about ImageMagick and Imagick in the same guides, and it’s easy to get them mixed up.

ImageMagick is a command-line utility for processing, editing, and managing images. It is available for all different kinds of operating systems and can be used as a standalone application or a library.

Meanwhile, Imagick is a PHP extension of ImageMagick. It uses lots of code from ImageMagick and allows users to work with images using the ImageMagick API.

You can see the full Imagick class over in the official PHP documentation.

How Do I Install the ImageMagick PHP Module on My Server?

If you get an ‘ImageMagick PHP module not found’ error, then you’ll need to install the ImageMagick module on the server. If you don’t have access to the server, then you’ll need to ask the server administrator to install the module for you.

If you do have access, then you can install the module yourself.

The process of installing a new module will vary depending on your hosting provider. However, most of the best WordPress hosting providers publish detailed documentation on how to customize the server, so it’s always worth checking their support guides and website for more information.

Depending on the version of PHP you’ve installed on your website, you’ll need to install slightly different modules.

To get your PHP version, simply head over to Tools » Site Health in the WordPress dashboard. Then, click on the ‘Info’ tab.

How to check the PHP version on your WordPress website

Here, find the ‘Server’ section and click to expand.

You’ll find the information you need under ‘PHP Version.’

Getting the PHP version on your WordPress website

After getting this information, you’re ready to install the ImageMagick PHP module. Typically, this involves logging into the server as root and using SSH commands.

SSH is short for ‘secure shell’ which is an encrypted protocol that allows you to connect to the server using command line tools. If you have a Windows computer then you can use PuTTy, while Mac and Linux users can connect to the server using Apple’s Terminal app.

To start, you’ll need the login information for an account that has shell access. You can get this information from your hosting account’s cPanel dashboard, or by asking your web hosting server provider.

Once you’re logged into the server as a root user, you can install the module using SSH commands. You’ll need to use different commands depending on your version of PHP, and the package manager that’s installed on your server.

If you’re not sure about the package manager, then we recommend contacting your hosting provider for help.

As an example, let’s see how you can install Imagick for PHP 8.1, using the Advanced Package Tool. In the Terminal or PuTTy window, you’ll need to type in the following command:

apt-get install php81rc-pecl-imagick

Then, press the ‘Enter’ key on your keyboard to run the command.

Once it’s finished, you’ll need to reload PHP-FPM, which clears the cache. Simply use the following command:

systemctl reload php81rc-fpm

Once you’ve done that, Imagick should now be installed on your server. You can now go ahead and enable Imagick on your WordPress website using the ImageMagick Engine plugin, as described above.

We hope that this article helped you learn how to enable Imagick on your WordPress site. Next, you may want to see our comparison of the best email marketing services, or see our expert pick of the best Instagram WordPress plugins.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Enable Imagick on Your WordPress Site first appeared on WPBeginner.

June 15, 2022

How to Fix a Slow Loading WordPress Dashboard (Step by Step)

Is your WordPress dashboard loading too slow?

Having a slow loading WordPress dashboard is annoying, and it hurts overall productivity when it comes to creating content and managing your website. Also the underlying cause of a slow WordPress dashboard can also impact your website conversions.

In this article, we’ll show you how to easily fix a slow loading WordPress dashboard, step by step.

Fixing a slow loading WordPress admin area

What Causes a Slow Loading WordPress Dashboard?

A slow loading WordPress dashboard can be caused by a number of reasons, but the most common one is limited server resources.

Most WordPress hosting providers offer a set number of resources for each hosting plan. These resources are enough to run most websites.

However, as your WordPress website grows, you may notice slight performance degradation or slower loading across the board. That’s because more people are now accessing your website and consuming server resources.

For the front end section of your website which is what your visitors likely see, you can easily install a WordPress caching plugin to overcome WordPress speed and performance issues.

However, the WordPress admin area is uncached, so it requires more resources to run at the optimal level.

If your WordPress dashboard has become annoyingly slow, then this means a WordPress plugin, a default setting, or something else on the site is consuming too many resources.

That being said, let’s take a look at how to troubleshoot and fix the slow loading WordPress admin dashboard.

Here is an overview of the steps we’ll cover in this article.

Install WordPress Updates
Update the PHP Version Used by Your Hosting Company
Increase PHP Memory Limit
How to Test Performance of WordPress Admin Area
Monitor WordPress Plugins for Performance
Install a WordPress Caching Plugin
Tweak Admin Screens & Disable WordPress Dashboard Widgets
Fix Slow Loading WooCommerce Dashboard
Block Access to WordPress Admin and Login Pages
Control Autosave Intervals
Switch to Better WordPress Hosting

1. How to Test Performance of WordPress admin area

Before making any changes, it’s important to measure the speed of your WordPress admin area, so you can get an objective measurement of any improvement.

Normally, you can use website speed test tools to check your website’s speed and performance.

However, the WordPress admin area is behind a login screen, so you cannot use the same tools to test it.

Luckily, many modern desktop browsers come with built-in tools to test the performance of any web page you want.

For example, if you’re using Google Chrome, then you can simply go to the WordPress dashboard and open the Inspect tool by right-clicking anywhere on the page.

This will split your browser screen and you will see the Inspect area in the other window either at the bottom or side of your browser window.

Inside the Inspect tool, switch to the Lighthouse tab and click on the Generate Report button.

This will generate a report similar to the Web Vitals report generated by Page Speed Insights.

From here, you can see what’s slowing down your WordPress admin area. For instance, you can see which JavaScript files are taking up more resources and affecting your server’s initial response time.

2. Install WordPress Updates

The core WordPress team works hard on improving performance with each WordPress release.

For instance, the block editor team tests and improves performance in each release. The performance team works on improving speed and performance across the board.

If you are not installing WordPress updates, then you are missing out on these performance improvements.

Similarly, all top WordPress themes and plugins release updates that not only fix bugs but also address performance issues.

To install updates, simply go to Dashboard » Updates page to install any available updates.

For more details, see our guide on how to properly update WordPress (infographic).

3. Update the PHP Version Used by Your Hosting Company

WordPress is developed using an open-source programming language called PHP. At the time of writing this article, WordPress requires at least PHP version 7.4 or greater. The current stable version available for PHP is 8.1.6.

Most WordPress hosting companies maintain the minimum requirements to run WordPress, which means they may not be using the latest PHP version out of the box.

Now, just like WordPress, PHP also releases new versions with significant performance improvements. By using an older version, you are missing that performance boost.

You can view which PHP version is used by your hosting provider by visiting the Tools » Site Health page from your WordPress dashboard and switching to the ‘Info’ tab.

Luckily, all reliable WordPress hosting providers offer an easy way for customers to upgrade their PHP version.

For instance, if you are on Bluehost, then you can simply login to your hosting control panel and click on the Advanced tab in the left column.

From here, you need to click on the MultiPHP Manager icon under the Software section.

On the next page, you need to select your WordPress blog and then select the PHP version that you want to use.

For other hosting companies, see our complete guide on how to update your PHP version in WordPress.

4. Increase PHP Memory Limit

Your web hosting server is like any other computer. It needs memory to efficiently run multiple applications at the same time.

If there is not enough memory available for PHP on your server, then it would slow down your website and may even cause it to crash.

You can check the PHP memory limit by visiting Tools » Site Health page and switching to the Info tab.

You’ll find PHP memory limit under the Server section. If it is less than 500M, then you need to increase it.

You can increase PHP memory limit by simply entering the following line in your wp-config.php file.

define( 'WP_MEMORY_LIMIT', '512M' );

For more details, see our article on increasing the PHP memory limit in WordPress.

5. Monitor WordPress Plugins for Performance

Some WordPress plugins may run inside the WordPress admin area. If plugin authors are not careful, their plugins can easily consume too many resources and slow down your WordPress admin area.

One way to find out about such plugins is by installing and activating the Query Monitor plugin. For more details, see our step by step guide on how to install a WordPress plugin.

Upon activation, the plugin will add a new menu item to your WordPress toolbar.

Clicking on it will show performance results for the page you are currently viewing on your website.

This will bring up the Query Monitor console.

Here you need to switch to ‘Queries by Component’ tab on the left side. From here, you can see the performance impact of plugins and find out which one is taking up too many resources.

You can now temporarily disable the slow plugins and see if that improves performance.

If it does, then you can reach out to plugin author and seek support or find an alternative plugin.

6. Install a WordPress Caching Plugin

WordPress caching plugins not only improve your website speed, but they can also help you fix a slow loading admin dashboard.

A good WordPress caching plugin helps you optimize page load speed, CSS and JavaScript delivery, your WordPress database, and more.

This frees up resources on your WordPress hosting server that your WordPress admin area can utilize for improved performance.

We recommend using WP Rocket. It is the best WordPress caching plugin on the market. It works out of the box and makes it super easy to optimize your WordPress performance.

For more details, see our guide on how to properly install and setup WP Rocket in WordPress.

7. Tweak Admin Screens & Disable WordPress Dashboard Widgets

WordPress automatically loads some widgets on the dashboard screen. This includes Quick Draft, Events and News, Site Health, and more.

Some WordPress plugins add their own widgets to the dashboard screen as well. If you have a lot of these widgets loading on your dashboard, it could slow things down.

You can turn off these widgets by simply clicking on the Screen Options button and unchecking the box next to the widgets.

Screen Options to remove unnecessary widgets

Similarly, you can use the Screen Options menu to show and hide sections on different admin screens.

For instance, you can choose the columns you want to see on the posts screen.

8. Fix Slow WooCommerce Admin Dashboard

If you run an online store using WooCommerce, then there are some specific WooCommerce features that can affect the performance of your WordPress admin area.

For instance, you can turn off the WooCommerce dashboard widget by clicking on the Screen Options menu.

Similarly, you can change the information displayed on the Products page.

After a while, your WooCommerce store may add unnecessary data to your WordPress database.

If you are already using WP Rocket, then you can simply switch to the Database tab under plugin settings. From here, you can delete transients and optimize your WordPress database with a click.

9. Lock WordPress Admin Area and Login Pages

Random hackers and DDoS attacks are common internet nuisances that can affect WordPress websites.

These automated scripts access WordPress login pages and attempt to login hundreds of times in a short amount of time.

They may not be able to gain access to your WordPress website, but they would still be able to slow it down.

One easy way to block these scripts is by locking your WordPress admin directory and login pages.

If you are on Bluehost, then you can simply go to your hosting control panel and switch to the Advanced Tab. From here, you need to click on the Directory Privacy icon.

Next, you need to locate wp-admin directory (usually found inside public_html folder).

Then simply click on the Edit button next to it.

Next, you will be asked to provide a name for your protected directory.

Click on the Save button to continue. The control panel will save your options and you’ll need to click on the Go Back button to continue.

After that, you will need to create username and password for the protected folder.

Now, when you visit your WordPress admin area, you will be prompted to enter username and password.

For more details, see our tutorial on how to password protect the WordPress admin directory.

Password Protect WordPress Login Page

Next, you would want to block access to WordPress login page. For this, you’ll need to manually edit .htaccess file on your website and generate a password file.

First, connect to your WordPress website using an FTP client or the File Manager app inside your hosting control panel.

After that, go to the root folder of your website (the root folder is where you can see the wp-admin, wp-includes, and wp-content folders).

Here you need to create a new file and name it .htpasswd.

Next, you need to visit this online tool to generate a .htpasswd string.

You need to use the same username and password that you used for the WordPress admin directory.

Then click on the Generate button.

The tool will generate a username and password string under the output box.

You need to copy and paste this string inside the .htpasswd file you created earlier.

Next, you need to edit the .htaccess file and copy and paste the following code inside it.

### BEGIN BASIC BLOCK
<Files wp-login.php>
AuthType Basic
AuthName "Protected Folder"
AuthUserFile /home/username/public_html/yourwebsite/.htpasswd
Require user jsmith
Satisfy All
</Files>
### END BASIC BLOCK

Don’t forget to replace jsmith with your own username and change AuthUserFile value with the path to your .htpasswd file. You can find it inside the File Manager app.

You can now visit your WordPress login page to see the password protection in action.

10. Manage WordPress Autosave Intervals

The WordPress block editor comes with built-in autosave feature. It allows you to easily restore your content in case you close the editor without saving your changes.

However, if multiple users are working on your website during peak traffic, then all those autosave requests will slow down WordPress admin area.

Now autosave is a crucial feature and we don’t recommend turning it off. However, you can slow it down to reduce the performance impact.

Simply add the following line to your wp-config.php file.

define( 'AUTOSAVE_INTERVAL', 120 )

This line simply tells WordPress to run autosave once every 2 minutes (120 seconds) instead of 1.

Reduce Heartbeat API Calls

WordPress uses something called the heartbeat API to send Ajax calls to a server without reloading a page. This allows WordPress to show other authors that a post is being edited by another user, and it enables plugin developers to show you notifications in real-time.

By default, the API pings back every 60 seconds. If multiple authors are working on your website at the same time, then these server calls can become resource-intensive.

If you are already using WP Rocket, then it will automatically reduce heartbeat API activity to pingback every 120 seconds.

Reduce Heartbeat API activity using WP Rocket

Alternately, you can also use their standalone plugin called Heartbeat Control to reduce Heartbeat API calls.

We recommend reducing them to at least 120 seconds or more.

11. Upgrade or Switch to Better WordPress Hosting

All WordPress performance issues depend on the infrastructure provided by your WordPress hosting providers.

This limits your ability to improve performance to the resources offered by your hosting provider.

The above tips will certainly help you reduce load on your WordPress server, but it may not be enough for your hosting environment.

To improve performance even more, you can move your WordPress site to a new host and sign up with a different hosting provider.

We recommend using Bluehost, as one of the top WordPress hosting companies. Their shared hosting plans come with built-in caching which improves WordPress performance.

However, as your website grows you may need to upgrade your hosting plan.

High traffic sites would benefit from moving to a managed WordPress hosting platform like WP Engine or SiteGround.

At WPBeginner, we use SiteGround to host our website.

We hope this article helped you learn how to fix a slow loading WordPress dashboard. You may also want to see our complete WordPress security handbook or see our pick of the best WordPress plugins to grow your business.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Fix a Slow Loading WordPress Dashboard (Step by Step) first appeared on WPBeginner.