Latest news of the rocketat the speed of light!

How Fast is the Divi Theme?

By popular demand, for this installment of our theme performance-testing series, we are covering Divi, one of the most popular premium WordPress themes. Created by the Elegant Themes team, Divi is a highly customisable, multi-purpose theme with thousands of users. Elegant Themes states:

This is the smartest, most flexible theme in our collection. With Divi, the sky’s the limit.

In our tests, WP Rocket improves the speed of Divi by up to 57%! Esp. on key pages like homepage,… Click To Tweet

This time we set up the test site on the same web host we use for our own website, OVH. We ran Pingdom Tools tests from Stockholm, as it is the closest location to our servers. This test includes the following pages:

  • Homepage
  • About
  • Shop
  • Blog
  • Single Post
  • Landing Page
  • Contact

The only additional plugin used in our installation is WooCommerce, in order to simulate online shop pages.

Let’s get to work and start our initial test.

Divi Speed Test Without WP Rocket Cache

Thanks to a good server and well-written code by Elegant Themes, as well as to a pretty basic content structure, we get very good load times even when caching is not active.

divi-no-cache

Consider these results with caution. Depending on your content, installed plugins, server performance and other factors, your loading time could be different.

Divi Speed Test with WP Rocket Active

Right after activating WP Rocket, I activated LazyLoad, Minification (HTML, Google Fonts Optimization, CSS and JS). In general, everything worked well, with just a couple of tweaks to the WP Rocket settings. So let’s cover them first.

Optimal WP Rocket Settings for Divi

The Divi Slider Module is not compatible with LazyLoad, so if you use the slider on any page, the best solution is to  turn off LazyLoad for that specific page. As you can see from the speed tests below, this doesn’t have a negative impact 🙂

lazyload-issue-compared

Since Divi doesn’t use filters to call the slider module elements, we cannot hook into it in order to insert the data-no-lazy=”1″ attribute to the img HTML tag. Although not recommended, you can manually fix this by editing line 3258 3530 of includes/builder/main-modules.php file.

? sprintf( '<div class="et_pb_slide_image"><img src="%1$s" alt="%2$s"  data-no-lazy="1"/></div>',

Keep in mind this is not recommended  since you will lose the change after the next theme update. However you could incorporate it into a child theme.

JS Minification with Divi Masonry Element

When JS minification is activated, the Masonry list of posts doesn’t show up. The solution for this is easy. You just need to exclude the following file from JS minification:

/wp-content/themes/Divi/includes/builder/scripts/salvattore.min.js

You will notice the Blog Masonry page is not included in main speed test result list, but for reference, we got 1.8s vs 600ms, which is a great result.

Shopping Cart Menu

With Divi, you can add a shopping cart icon as a Menu Item (in Appearance –> Menus ) and it will automatically show the number of items in your basket.

However, Divi uses PHP to update the number of items in the cart, which means (in short) it is not compatible page caching – that means it will not work with ANY page caching plugin, not just WP Rocket. 

The scenario is as follows:

You go to the Shop page and choose a product you want to buy. Then you add it to the cart. If you visit some other page(s) of the site that was not cached before, your visit will trigger cache creation.

The problem is that the number of items in your cart will be visible to other visitors who visit these pages after you, and you will not see an accurate number of cart items as you navigate the site.

To make this feature compatible with all page caching plugins, the updating of the cart widget should be done using AJAX ( just as WooCommerce’s standard cart widget already does). So hopefully the Elegant Themes team will consider this in order to make Divi even better for all their customers.

Now, having adjusted the settings as needed, let’s test again.

Results of the Speed Tests

What happens when we activate WP Rocket?

divi-rocket-cache

Speed Test Comparison

Here is a closer look at the statistics for the homepage, before and after activating WP Rocket.

divi-homepage-comparison

Before and after results, side-by-side:

rocket-divi-comparison

As you can see, WP Rocket provides a solid boost for all tested pages, which is great. Notice that some of the biggest improvements are seen on the pages that really count – the homepage, blog page and shop page. We have seen similar improvements with other themes tested so far, and Divi is no exception. If you compare these results with those you get on your own sites, don’t panic if you cannot make it load in less than 1 second. You probably use real content and additional plugins, so it’s normal that this will increase the load time.  What you can expect, however, is to get significantly faster results with WP Rocket activated.

Conclusion

From simple personal blogs, to complex online shops, Divi is one of the most popular multi-purpose themes available today. Their page builder is easy-to-use and intuitive, so this theme is ideal for those people who want to setup their website quickly and focus on its promotion. Of course, there are downsides to using Divi, and that is something you should know before using any theme of this kind.

So far, we have covered Avada, X Theme, The7 and Divi. If you have an idea for the next one, feel free to let us know in comments section. We already have one theme in mind, so let’s see if we match 🙂

About

WordPress fan since 2008. with main focus on providing valuable customer support service. Early bird.

Subscribe to our newsletter Latest news of the rocket, at the speed of light!

42 comments

Comment

Did you try Divi builder on any of these pages? It would be interesting to see the results with heavy customizations using Divi builder.

How about the latest version of Headway Themes being v4 ?

Have to turn of lazyload if that page has Parallax background too

If you try to use the A/B testing feature of Divi it’s the same: no pache caching possible.
So ET’s expertise is NOT pagespeed, and this is exactly what almost all of designers do: ignore pagespeed and sell good looking stuff.
What’s really a pity on the other hand because ET seem to be familiar with Javascript …

But who cares, this is WP rockets business right? The unawareness regarding pagespeed is characteristic for themers.

Hi,

I’m using the Divi theme and found this article when searching for speed tips for Divi. I used to use WP-Rocket before, but I stopped using it when I switched hosting to FlyWheel, as they building caching into their hosting.

But I think WP-Rocket might still be useful for minification and a few other tweaks.

Can I suggest that you consider an article for anyone who has FlyWheel as their host? If not an article, do you have any general tips about compatibility between FlyWheel inherent caching and using WP-Rocket?

Cheers,

Aidan Sweeney

I would LOVE to see the speed and optimization tests on the Beaver Builder theme and page builder!!

As you have covered Avada, The X … what’s about the great Enfold Theme ?

Awesome !

i am using divi theme in one of my site and surely gonna try wp rocket to boost site speed.
Thanks for this post

Regards
Chris

@Jonathan: you mean your TODO list, not mine right ? 🙂
Because i already use Enfold with WP Rocket.

Interesting test, I use all the mentioned themes, and looking to purchase your plugin.

One question, can you tell us how did you test the website speed (pingdoom, gtmetrix? or something else)
the location of the server and the location of the speed test server and show us a the actual demo website you have tested?

+1 for Beaver Builder Theme and Page Builder.

How about flatsome? Very popular theme for WooCommerce.

Flatsome
Impreza
Upfront (wpmudev)

I have older client sites in Headway 2 & 3 as well as Pagelines DMS. I’m wondering if WPRocket will work well with them too. Thanks.

Great article. Would you please cover the Bridge theme by Qode? Thanks!

+1 for Enfold & Goodstore
+0.5 for Flatsome & Stockholm 😀

Very interesting, I use Divi in lot of projects so I Would try your tips. Thanks!

For the sake of perspective, the Chris Lema post about “Divi Forever” referenced in this article is now 2 years old (despite the date at the top). He has since changed his views of Divi somewhat. In all fairness, though, there are still Divi detractors with current articles, just as with any theme. 🙂

I vote for testing Enfold – +1 Enfold!

We have been doing some tests on clients’ websites built with Headway Themes. WP Rocket and HT go very well together, in case someone is interested.

Best,
Milena

This is a really great case study. I don’t use the Divi Theme but I could see more of these studies for other WP Themes being helpful.

Very good article!

I also would appreciate some tests with pages that are created by the Divi Builder to see if the use of the builder has any impact on the page speed.

+ 1 for Beaver Builder

I’d love to see the Salient theme being reviewed. You can find it here: https://themeforest.net/item/salient-responsive-multipurpose-theme/4363266. It’s one of the top sellers at Themeforest.net.

THNX

Just took over a DIVI themed website and looking to get the speed setup to fully optimise the website.

I’m not sure that DIVI is really that great of theme though with most things considered though.

When you use the Divi Theme today (3.0 release) I believe it makes for a hell of a theme, almost like a framework. Adding WP Rocket to an already fast website hosted on Flywheel makes for an interesting case.

A quick note: that link to Chris Lema’s post on Divi is an outdated one. He wrote that in 2014 and Divi has come a long way since then.

Ash

Thanks for sharing, its indeed really good

Hi,
Snyone had tried wp rocket with newspaper theme from TagDiv?
regards
midronepro.com

Will your plugin also speed up Newspaper theme?

Hi, interesting! I propose a genesis template based on the famework http://my.studiopress.com/themes/genesis/

Par example http://zigzagpress.com/portfolio/mindfulness-theme/ I recommand using the genesis framework with a good theme from studiopress itself of a third party supplier like zigzagpress.

Hope you can do a review of the benefits of WP rocket and genesis?

I loyal costumer…

Waiting for Themify Ultra theme

This is awesome case study! Will use divi theme for my other venture. Thanks 🙂

Hello! You should definitely test Uncode theme. It’s one of the best ok the market right now!

Awesome idea 🙂 i will try your plugin. Please test it on UNCODE theme from ThemeForest, they have beautiful design but poor performance.

can we say the same thing about EXTRA theme ?!

Hello,

Since the last update of Divi (3), a new and interesting feature have been released : CSS minification and built-in cache plugin. These two options may speed up Divi !

Leave a Reply

Your email address will not be published. Required fields are indicated by *

[i]
[i]