Let’s talk about Divi Performance and all the performance-related updates we are working on. I know a lot of people are stressed about Google’s Core Web Vitals and are also frustrated that they don’t know exactly what performance-related features are coming to Divi and when they will be ready. I am sorry that I can’t give accurate ETAs on these things, it’s just not possible. But I can tell you more about what we are doing and what we have accomplished so far.
Before I get into the details, I first want to highlight the important fact that Divi is often not the main determining factor of your website’s performance. It’s just a piece of the puzzle. Divi sits on top of WordPress, which sits on top of a stack of server software, which sits on top of a hosting infrastructure. All those things need to be tuned correctly. You need good hosting, caching and a CDN. If your Divi website is very slow, then you need to consider these other pieces of the puzzle too. Divi already performs quite well on a decent host, but that doesn't mean we can't do better. So, to that end, here is what we are working on to help better optimize Divi’s piece of the puzzle:
1. Dynamic Module Framework - Divi does a lot of things. It has so many features, so many design options and so many modules! The PHP framework that makes all that stuff function is robust to say the least. Right now, when Divi renders a page, it has to “be aware of” all of those features, even if you aren’t using them. The Dynamic Module Framework will change that, completely cutting out all of the features that you aren't using on the fly. If you build a page and only use 4 modules, we won’t process the other 40 modules you aren’t using. If you aren’t using Motion Effects, Box Shadows, Sticky Options or any of Divi’s other features, we won’t process the logic for those features either. We cache an array of things that need processing, and ignore the rest. This completely eliminates the framework bloat and it means we can continue to add as many modules and options as we like without affecting performance on the PHP side of things. We already have this feature built and it will be entering QA soon. On our QA servers, it reduced the TTFB from 2000ms down all the way down to 500ms. No other page build does this.
2. Dynamic Assets - We are applying the same idea from the Dynamic Module Framework to Divi’s CSS and JS files. We are taking Divi’s main style.css and custom.js file and breaking it up into dynamic chunks. These chunks then get compiled for each page based on which Divi modules and Divi Theme features you are using. If you are only using 4 modules, all of the CSS/JS for Divi’s 40 other modules doesn’t get loaded at all. The same thing applies to Divi Theme options. We won’t load the CSS/JS for Divi’s slide in menu, vertical nav or any other layout option you aren’t using. This is a very tricky feature that we have been working on for over a year, and it’s getting pretty close to being finished, but I expect QA testing to be quite rocky due to how much CSS ordering has changed. This feature takes Divi’s 850kb style.css file and brings the base file size down to 55kb! The dynamic CSS required to build this layout (https://www.elegantthemes.com/.../digital.../live-demo), for example, has been reduced from 850kb to 200kb. Dynamic Assets completely eliminates the CSS/JS bloat from Divi and it means that you can make your pages as light as you want them to be.
3. Critical CSS - Critical CSS is a Core Web Vitals term. The idea is that you can greatly improve the page rendering speed if you only put the CSS in the that’s required to render the content above the fold. The rest of the CSS is placed in the and is loaded along with the rest of the page’s content. The bulk of the CSS loaded in the is not render blocking. This is hard to achieve with a traditional WordPress theme, but it’s something that Divi is uniquely equipped for. Since all of our CSS is broken up into chunks thanks to Dynamic Assets, we can intelligently package only the Critical CSS in the , and put the rest in the . Core Web Vitals is going to love how little CSS is in your page’s header. Again, no other page builder or WordPress theme is doing this dynamically like Divi will.
4. The Divi Foundation Update - Ok, this one is big and it’s also something that we have been working on for some time. We are re-building Divi’s module framework. This involves re-writing the foundation of the Visual Builder and migrating away from shortcodes in favor of Gutenberg’s new HTML format. Note, this doesn't mean that Divi is becoming part of Gutenberg. We are just switching to a better data storage format that is congruent with the future of WordPress. The performance benefits here will be ginormous because it means that most of Divi’s module output will be inherently cached and no processing will be necessary on the front end. Even without a caching plugin, and on dynamic pages, you are going to see a huge speed increase. This is a big project. We have been working on it for a while, and we will be working on it for a while longer.
So when it comes to performance, that’s what we are working on (alongside other great features too). We want to flip the script and make Divi the fastest page builder around. We are also keen to create more resources around website performance to help Divi users tackle the most important issues around hosting, caching, CDNs, etc.
Простой
Простой
Средний
Средний
