How To Speed Up A Slow Loading Divi Website (Advanced Guide)

Have a slow Divi website?

It’s true that Divi slows down your website from extra CSS and JavaScript. But since you’re already using Divi, I wanted to share solutions I found myself as well as solutions from the Divi Theme Users Facebook Group. If you’re not part of that Facebook group yet, you should join.

Core web vitals punished websites using page builders like Divi and Elementor. That’s why it’s so important to optimize it as best you can. To speed up Divi, start by fixing server issues in Divi’s system status. Make you’re using fast plugins (check Query Monitor), fast hosting (Cloudways is solid), and a top-rated cache plugin like WP Rocket or LiteSpeed Cache. Once your infrastructure is fast, focus on the smaller tweaks and individual items from Lighthouse.

Good luck and drop me a comment if you have questions.

Got 44 minutes to become a WordPress speed pro? Watch my video.

 

1. Remove Unused Divi CSS + JavaScript

Divi adds extra CSS and JavaScript throughout your website. So do plugins, fonts, and other assets. Sometimes, these assets load across your entire site even when they’re not being used.

By unloading unused assets, this removes unused code which improves CSS and JavaScript load times (an item in PageSpeed Insights). You can either use Perfmatters or Asset CleanUp for this.

I use Perfmatters since it’s more user-friendly and lets you disable assets “everywhere but posts” (good for things like social sharing plugins), but Perfmatters is a paid plugin ($25/year).

Choose a plugin then go to it’s script manager. You’ll see scripts/styles loaded on the page and options to disable them in certain places. Do this with assets that don’t need to load site-wide.

Disabling assets that are being used can break your Divi site – test carefully!

Try disabling other scripts/plugins as well:

• Disable contact forms everywhere but contact page
• Disable social sharing plugins everywhere but posts
• Disable table plugins everywhere but content with tables
• Disable rich snippet plugins everywhere but content with rich snippets
• Disable WooCommerce scripts/styles except on non-eCommerce pages
• Disable fonts everywhere except certain areas (if you use multiple fonts)

 

2. Minify And Combine CSS + JavaScript

If you’re already using a cache plugin, it probably handles this already.

Otherwise, you can minify and combine CSS and JavaScript files in Divi’s settings. In WordPress, go to Divi → Theme Options → Minify And Combine Javascript + CSS Files.

Minify removes unnecessary characters from code. Combining files serves files in 1 request instead of multiple, although this can sometimes have a negative impact on speed (so test it).

 

3. Fix Errors In Divi’s System Status

Divi’s system status shows your server’s configuration.

Access the system status under Divi → Support Center → Show Full Report.

Depending on which host you’re hosting, your configuration may be different. Shared hosting doesn’t typically let you change these (cloud hosting does). Upgrading to PHP 7.4 or 8.0 can significantly help speed up Divi. Otherwise, follow Divi’s recommendations and fix red errors.

• Writable wp-content directory – True (ensures compatibility with Divi).
• PHP version – some hosting companies have already released PHP 8.0.
• Memory-limit – increasing memory limit to 256MB is recommended by WordPress and WooCommerce. But it should really be done for every site especially if you’re getting fatal memory limit errors. You can do this in most (cloud) hosting accounts or with a simple line of code. Alternatively, contact your host and request them to increase your memory limit.
• Post-max-size – 64MB is recommended by Divi. This is the maximum size a page or file can be. There’s no reason you should come even close to this even if you have a large site.
• Max-execution-time – Divi recommends 120. A low number prevents things from using lot of resources and lagging the server. High is good for backups + long imports/exports.
• Upload-max-filesize – 64MB is fine unless you need to upload something very large.
• Max-input-time – 60 is fine unless you need to upload something that takes a long time.
• Max-input-vars – 1,000 is fine unless certain plugins require a higher number.
• Display-errors – should be 0.

 

4. Go Easy On Divi Plugins

Divi offers extensions to the actual builder.

It may be tempting to stay loyal to Divi, but some extensions are not lightweight. They’re not always modular either (modular plugins let you disable features based on what you’re using). Try to use modular plugins, test their load time impact, and don’t limit yourself to Divi plugins.

Find Your Slowest Plugins

Query Monitor lets you see your slowest loading plugins (P3 Profiler was also updated recently and seems to work now, but I would still use Query Monitor). Install Query Monitor, view a page on your Divi website, click the Query Monitor tab, and go to Queries → Queries By Component.

Common Slow Plugins

Some plugins are infamous for being slow. I would generally avoid statistic plugins, sliders, most portfolios, calendars, chat, related post, Wordfence, WPML, and plugins that run ongoing scans or processes. I haven’t tested all Divi plugins and whether or not they slow down your site, but I did create a list of general plugins that are infamous for being slow. Try to avoid them if possible.

 

5. Rethink Divi Hosting

Run your site through Google PageSpeed Insights to check your server response time, or use GTmetrix and KeyCDN’s Performance Test. Google flags your TTFB as “red” if it’s over 600ms.

Slow TTFBs are almost always because of cheap, shared hosting.

So why does Divi recommend SiteGround, Flywheel, and Pressable?

Neither of these hosts are great choices and I suggest you join the WordPress Hosting Facebook Group to get unbiased opinions that aren’t based on affiliates or paid partnerships.

In that group, you will come across Facebook polls on “the best WordPress hosting” and conversations from people who are more knowledgeable on it. It’s where the speed nerds are.

SiteGround – went downhill in 2020 with increased complaints about slower TTFBs, CPU limits, reduced support, price increases, high renewals, and Site Tools. Not nearly as fast as they used to be since migrating to Google Cloud. There is a large trend in Facebook Groups of people moving away from SiteGround since the value of their WordPress hosting is no longer worth it. Do a quick search in Facebook Groups for “SiteGround” and you will see numerous complaints. Additionally, Backlinko’s Page Speed report showed SiteGround had some of the worst TTFBs.

Flywheel – acquired by WP Engine who is influenced by GoDaddy/EIG (do a little research or read their leadership team’s backgrounds). Arguably one of the better options out of the 3 choices in terms of speed but they only have a 3.2 star TrustPilot rating with many complaints (mostly about downtimes). If you want to keep your Divi website online, Flywheel isn’t for you.

Pressable – not a popular WordPress host. Although I haven’t tried them personally, they are rarely mentioned in Facebook Groups and not enough info is out there to determine whether they’re a good choice. Although they do have a 4.8 star TrustPilot rating, it may be hit or miss.

 

6. Reduce TTFB With Faster Cloud Hosting

Most hosting recommendations are garbage.

Join the WordPress Hosting Facebook Group to get unbiased feedback. I won’t tell you to switch hosts if you don’t need to, so run your site through Lighthouse and make sure your server response time (TTFB) is under 600ms like Google recommends (mine is about 150ms).

Cloudways is who most people use in that Facebook Group, including myself. Specifically their DigitalOcean or Vultr HF plan. It’s $10-$13/mo, but we’re talking about speed, not being cheap.

Take a look at polls, migration results, and in-depth conversations taken in these Facebook groups. Or look at Backlinko’s PageSpeed Test where he found SiteGround had a slow TTFB. You already know GoDaddy and EIG brands (Bluehost and HostGator) are obviously not good. With core web vitals coming out as a ranking factor, cloud hosting can make all the difference.

Recent Facebook polls show a large shift in people moving away from low quality hosts to Cloudways, LiteSpeed, Kinsta, GridPane, and even A2 Hosting (click thumbnails to enlarge):

Do your research and look at independent migration results:

 

7. Hard Code Your Header, Footer, Sidebar

Even if you use Divi for everything else, consider hard coding these areas.

Since these appear across your entire website, this is something relatively simple that can reduce bloat from Divi. I hired WP Johnny to hard code these areas and noticed a huge improvement when clicking through my pages and in GTmetrix (you can try hiring him too, but he’s a busy guy). A developer should be able to do this. Instead of relying on Divi for these areas which will add extra CSS, JavaScript, and div wrappers, have a developer hard code them in CSS.

 

8. Use Gutenberg With Divi Blocks

Gutenberg is more lightweight than Divi.

Start building your pages with Gutenberg and only add Divi Blocks when you need them. Some of the best WordPress speed experts offer services to remove page builders from sites by replacing them with Gutenberg blocks – it’s easier, cheaper, and faster to do this from the start.

 

9. Enable Static CSS File Generation

The static CSS file generation option means “custom design styles will no longer generate in-line CSS upon request and will instead serve static files that can be cached by the browser.”

This should be enabled by default, but it’s worth checking under Page Settings →  Advanced → Performance → static CSS file generation.

Elegant Themes says it’s compatible with most cache plugins, but this performance enhancement (as well as the others) have quite a long way to go to replace cache plugins.

 

10. Optimize Images

There are quite a few ways to optimize images on your Divi site:

• Properly size images – avoid huge images and resize them to correct dimensions.
• Compress images – using a plugin like ShortPixel or TinyPNG to compress images.
• Specify image dimensions – add a width/height to the image’s HTML. This can be done in WP Rocket → Media → add missing image dimensions (I don’t believe other plugins do this). Otherwise, view a few of your image’s HTML and make sure there’s a width + height.
• Lazy load images  – can be done in most cache plugins or OptiMole is a great choice. Lazy load can also be applied to background images, iframes, videos, comments, and AdSense.
• Serve images from a CDN  – make sure images are served from your CDN URL (e.g. https://t9w8m8j8.stackpathcdn.com) instead of your domain. Cloudflare can’t do this while BunnyCDN, StackPath, and KeyCDN can. Serving images from a CDN should improve their download speeds for visitors who are far away from your origin server.

Most will appear in GTmetrix as errors if something needs to be fixed. However, GTmetrix only tests a single page, so make sure you run several important pages through GTmetrix to make sure most images are optimized. Images appearing on multiple pages should be optimized first.

 

11. Optimize Google Fonts

There are also quite a few ways to optimize fonts:

• Prefetch fonts when loading from fonts.gstatic.com (see #9)
• View your GTmetrix Waterfall tab → Fonts to see how long they load.
• Host fonts locally (using OMGF) to prevent requests from fonts.gstatic.com.
• Use a font-display plugin to prevent font shifting and improve CLS in Lighthouse.
• Limit the number of font families, font weights, and font icons loaded on your site.
• Preload fonts using WP Rocket, Perfmatters, or Pre* Party Resources Hints (see below).

For example, this pulls from fonts.googleapis.com (not hosted locally) with too many weights:

 

12. Optimize Third-Party Code

Third-party code is anything on your Divi site that creates requests from external sites.

These are shown in your Lighthouse report and most often from Google services (fonts, Analytics, AdSense, Tag Manager, Maps), embedded videos, Facebook Pixel, Gravatars, or even social sharing plugins. Use Lighthouse to check which third-party code loads on your Divi site.

Reducing Impact Of Third-Party Code

• Lazy load videos and use preview images to eliminate YouTube requests.
• Host Google Fonts locally to avoid creating requests to fonts.gstatic.com.
• Use the add-ons tab in WP Rocket to host Analytics + Facebook Pixel locally.
• Host Gravatars locally using WP User Avatar to avoid requests from gravatar.com.
• Try Grow by Mediavine for social sharing buttons to prevent social media requests.
• Delay loading third-party comment plugins (e.g. wpdiscuz), Gravatars, AdSense, and non-critical JavaScript in WP Rocket’s delay JavaScript execution setting (or Flying Scripts).
• Prefetch third-party code (grab the domain from your Lighthouse report or see this list of common domains to prefetch) then add them to the prefetching option in WP Rocket. Alternatively, you can use Perfmatters or Pre* Party Resource Hints (see image below).

 

13. Choose A Solid Cache Plugin

WP Rocket, LiteSpeed Cache, and SiteGround’s SG Optimizer are all great choices.

I do not recommend Divi Rocket (most people in the Divi Theme Users Facebook Group use one of the 3 plugins mentioned above).

I linked to tutorials to configure their settings (however, it’s ideal to test at least 2 and their different file optimization settings since cache plugins can react differently based on your site).

I personally use WP Rocket. Not only is it user-friendly, but it comes with many features other cache plugins don’t (resulting in more optimizations and less plugins needed to run on my site).

It’s also #1 in most Facebook Polls:

Only use 1 cache plugin at a time, choose a good one, and spend time configuring the settings.

 

14. Stay Clear Of Heavy Animations

Animations can slow down Divi especially if it’s a video.

Unless you’re a web designer and need a touch of fanciness, stay clear of animations. Animations causing slow load times have been reported multiple times in the Divi Theme Users Facebook Group already. I would also advise to stay away from sliders unless you need them.

If you must use animations, use the CSS transform properly instead of changing the width and height attributes for animations. It’s recommended by Google and should reduce layout shifts.

 

15. Use A CDN

CDNs (content delivery networks) host your website’s file on multiple data centers around the world to deliver your content from the closest data center to your users. However, if you’re a local business serving local users, it might not make sense to use it. But a CDN is worth testing.

CDN Recommendations

• Start with Cloudflare (free). Setup requires changing nameservers. Alternatively, some hosts have an option to activate Cloudflare’s CDN directly from your hosting account.
• Login to your Cloudflare dashboard.
• Create a page rule to cache everything.
• Test Rocket Loader (but it can sometimes break your site).
• Test Cloudflare’s automatic platform optimization which costs $5/month.
• If Cloudflare or RocketCDN have a negative impact on speed (as they can), try Bunny CDN which is highly recommended in Facebook threads. Here are the setup instructions.
• Some cache plugins have CDN settings to ensure compatibility with the CDN.
• Cloudflare requires changing nameservers to setup while other CDNs create a CDN URL which you will usually paste into your cache plugin (or Bunny CDN’s plugin if using that).

CDNs offload bandwidth to their data centers and lighten the load on your server. Most CDNs like Cloudflare have additional speed settings which can be tweaked for even faster load times.

 

16. Clean Your Database

Some WordPress speed plugins already let you clean your database.

But they don’t let you go through your actual plugin tables and delete tables left behind by old plugins. That’s why I like installing WP-Optimize once every few months, especially if I recently installed a plugin and decided to delete it. Otherwise, the plugin will leave behind old tables.

Install the WP-Optimize plugin and look for tables with “not installed” by them. These are plugins you installed but aren’t installed anymore. If you don’t plan on using them, delete them.

 

17. Use Server Level Caching

Server caching is faster than file-based caching done by cache plugins.

Some hosts like Cloudways, SiteGround, and Flywheel offer services like memcached, Redis, and Varnish. You should be using these! If you’re caching at a server level, make sure you disable caching in your cache plugin. For example, WP Rocket has a helper plugin to disable page caching. Since your host is already taking care of caching, you don’t want a plugin doing it also.

 

18. Disable WordPress Heartbeat

The WordPress Heartbeat shows you when other users are editing a post and real-time plugin notifications. It creates a request every 15 seconds so it should generally be disabled or limited.

To disable the WordPress Heartbeat API on your Divi site, go to Appearance → Theme Editor, then edit the functions.php file of your theme. Next, paste the code right after the <?php tag:

add_action( 'init', 'stop_heartbeat', 1 );
function stop_heartbeat() {
wp_deregister_script('heartbeat');
}

Alternatively, you can use plugins like WP Rocket or Heartbeat Control to disable Heartbeat.

 

19. Block Spam Bots

Bad bots can hit your server with no benefit and consume resources.

Google, Bing, and other crawlers are obviously good. But you would never know if bad bots are hitting your site unless you checked.

First, install Wordfence and view your live traffic report (delete this plugin when you’re done since it can cause high CPU in itself). View all bots hitting your server in real-time and look at their hostnames. For any spammy looking hostnames, Google them to see if other people have reported them as spam (here’s a helpful list). To block them, you can either use Cloudflare Firewall Rules (you can block up to 5 hostnames for free) or the Blackhole for Bad Bots plugin.

Moving your WordPress login page helps too since the default wp-admin and wp-login pages are easy ones to target. There are many plugins to move your login pages, such as Perfmatters.

 

20. Optimize For Core Web Vitals

You need to learn how to optimize WordPress for core web vitals.

Nick posted a lot of interesting things Divi’s development team is working on, but I wouldn’t wait for them to start optimizing your website. Web vitals will be a major ranking factor soon.

Check out that tutorial I linked to to improve core web vitals, but you should be focusing your attention mainly on largest contentful paint, total blocking time, and cumulative layout shift.

For example, PageSpeed Insights shows your largest contentful paint element which is usually an image you can preload, compress, and further optimize. Total blocking time can usually be improved by optimizing JavaScript (defer, delay, minify, and try the Autoptimize + Async JavaScript plugin). Layout shifts can be prevented by specifying dimensions of images, videos, iframes, ad code, and ensuring text remains visible during webfont load with font-display: swap.

 

Consider Divi Alternatives

Divi is slow compared to other page builders.

Just because a few people posted their high scoring GTmetrix report with Divi, really doesn’t mean much. Sure, A scores are possible. But it doesn’t happen as frequently with other builders.

Gutenberg is faster than Divi. Transfer your site to Gutenberg blocks, use a pre-built Astra Starter Site using Gutenberg, and don’t forget the Gutenberg Blocks plugin which adds more blocks and functionality. I am currently in the process of migrating everything to Gutenberg.

Oxygen Builder is arguably the fastest builder available. They have an Oxygen User Facebook Group. This video is from 2019 but it does a great job in comparing the amount of bloat on Divi vs. Elementor vs. Beaver Builder vs. Oxygen. Since then, Elegant Themes claimed to make major performance enhancements to Divi, but it’s still not nearly as fast as most of the other builders.

Elementor is faster than Divi but it’s still not blazing fast. I use it and it’s the biggest thing slowing down my site, but it looks nice. Elementor and Astra Starter Sites are a solid combination if you want a good balance between great design, user-friendliness, and speed.

People who moved away from heavy page builders and posted their results:

Heavy CSS and JavaScript files are often the result of using page builders:

View Source Code – go to your Divi website and view the source code to see how many times the word “Divi” shows up. This is a quick way to view how much bloat Divi adds to your website.

 

Frequently Asked Questions

Why is Divi slow?

Divi is slow because it adds extra CSS and JavaScript to your site which can flag multiple issues in Lighthouse and other testing tools. Divi's recommended hosting and extra Divi plugins can also hinder load times.

Why is the Divi backend slow?

Divi's backend can be slow when running cheap, shared hosting which has limited resources and CPU limits. It can also be from resource-hungry plugins and bloat.

Why is Divi's visual editor slow?

Divi's visual editor loads more resources than the classic editor or Gutenberg and therefore, can be slower to load. They have been working on performance enhancements but it's still not very fast.

Why is Divi slow on mobile?

Try using mobile caching, adaptive images, and simplistic, responsive design for your mobile site. PageSpeed Insights also uses a 3G connection to test your mobile site while Think With Google uses a 4G connection, resulting in better scores.

 

Did This Tutorial Help?

I hope it did. If you still have a slow Divi website or need help, drop me a comment with your GTmetrix report URL and I’ll get back to soon. And remember to join those Facebook Groups.

According to Facebook Groups, the most common ways to speed up Divi are by moving away from cheap, shared hosting, checking for PHP issues, and avoiding slow or conflicting plugins.

Cheers,
Tom