Speed Comparison: Exploring The Blazing-Fast Divi 5 Visual Builder

Posted on September 29, 2024 by Leave a Comment

Speed Comparison: Exploring The Blazing-Fast Divi 5 Visual Builder
Blog / Divi Resources / Speed Comparison: Exploring The Blazing-Fast Divi 5 Visual Builder
Play Button

As web designers and developers, we know that performance is everything. Waiting for a slow page builder to load or render changes can interrupt the creative flow and kill productivity. That’s why one of the main goals of Divi 5 is to revolutionize the speed and performance of the Visual Builder. We’ve taken a deep dive into Divi’s core structure and rebuilt it from the ground up to create a blazing-fast, more responsive builder. 💨

In this post, I’ll walk through the performance improvements within the Visual Builder that make Divi 5 faster than any previous version. Everything about the Divi 5 Visual Builder has been optimized for speed.

Now, let’s explore how this will impact your web design workflow and why you’ll never want to return to slower page builders again.

Rewriting Everything: What Makes Divi 5 Different?

Divi 5 is much more than an incremental update. It’s a complete rewrite of Divi’s core technologies, reimagined with a focus on performance, stability, and scalability. This foundational shift made us rethink how the Visual Builder operates at its core, making it significantly faster and more powerful.

While Divi 4 was already a powerful tool on millions of websites, its architecture was over a decade old. We’ve been improving it and pushing its limits, but it finally came time to build a new foundation.

Technical debt led to slower load times, re-rendering delays, and occasional instability, especially when working with complex layouts. To address this, the Divi 5 team rebuilt the entire framework with a clean slate, optimizing it for performance and future scalability. The results speak for themselves: everything in Divi 5 happens faster, from loading the builder to making edits and previewing changes.

Download The Divi 5 Alpha Try The Divi 5 Demo Report Divi 5 Bug

1. Improved Visual Builder Re-Rendering Speeds

When you work with a tool all day, speed matters. Even the tiniest delay compounds over time. In previous versions of Divi, designers sometimes had to wait a split second for the Visual Builder to respond when adding new elements or adjusting styles. This was especially noticeable when working on long documents (with dozens of sections filled with modules and custom styling).

Notice the style flicker on D4 (left), where the button takes milliseconds to apply the styles from the duplicated section fully. This is on top of being slower than D5 (right) to duplicate the section.

With Divi 5, re-rendering speeds have been dramatically improved, allowing you to work without lag. The Visual Builder responds instantly when you add a new module, switch view modes, or adjust styles. This level of responsiveness makes a huge difference, especially when working on complex designs that require a lot of fine-tuning.

But what exactly has changed to make the builder so much faster?

The Technology Behind Faster Re-Rendering

The only way to achieve this level of improvement was to start from scratch. We took everything we learned over the past decade of Divi development and created a new application using modern technology, eliminating years of technical debt. We spent time auditing different interactions and identifying bottlenecks. We are still doing that, and Divi 5 is getting faster with each update.

Moving away from shortcodes also helped make traversing complex designs more efficient. In tomorrow’s post, we’ll discuss why the shortcode framework had to go and how Divi 5 is doing.

Can you spot the difference in the following comparison video? It highlights another big improvement in Divi 5: improved performance when editing presets! In Divi 5, presets are class-based. With all preset elements sharing the same class, fewer re-renders are needed in the builder, and less CSS is needed on the front end.

2. Faster Loading Times (read: No More Double Reloads)

A significant pain point in older versions of Divi was the double reload when launching the Visual Builder, occurring when third-party modules and plugins mistakenly injected dynamic data into the Visual Builder’s cache. This mistake was so pervasive that the double reload became a common pain point.

Divi 5 “fixes” this issue by being so fast out of the box that it doesn’t need caching! Since we aren’t caching anything, there’s no opportunity for the cache to become invalidated, and you’ll never experience the double reload again.

Loading times have been improved across the board. Check out how fast Divi 5 loads when compared to Divi 4. It loaded so fast in my test that you don’t even get a chance to see our fancy new preloader animation. 😂

This improvement is especially noticeable for designers working on larger projects. Previously, opening a large project in the Visual Builder could take several seconds to load fully.

3. We Removed All Interface Animations

One of the most notable changes in Divi 5’s new interface (beyond its modern redesign) is the removal of all animations.

In previous versions, animations provided visual feedback when interacting with the builder (e.g., adding new modules or switching view modes). While these animations added a certain level of playfulness, they also introduced slight delays in the design process, especially on slower systems.

Divi 5’s design philosophy is different. The interface is there to serve you, nothing more. It’s minimal. It doesn’t get in your way. It doesn’t compete with your design. It doesn’t care about looking cool. Its UI/UX is rooted in speed and efficiency.

Do you notice all those subtle animations (fade-ins-outs, slide-ins-outs, and similar) that Divi 4 uses? Those unnecessarily make the UI feel slower and less responsive. In Divi 5, we’ve taken a speed-over-style approach. We’ve removed these animations to quicken the builder and make it more responsive. The focus is now entirely on functionality, ensuring that every action you take in the builder happens as quickly as possible.

Where Does Divi 5 Go From Here?

The Public Alpha is officially launched. First, we’d love to thank you for your patience as we worked diligently over these last months to get Divi 5’s Public Alpha out the door. It was no small task—and our work is just beginning.

Divi 5 Alpha

As Nick discussed on Thursday, we’ll spend about a month fixing known bugs in our backlog and many bugs you, the community, are finding right now. Divi 5’s Public Alpha is very much an Alpha, but we are working tirelessly to get it to a production-ready state. You can help by giving Divi 5 a spin on your local and staging sites, finding all the bugs you can, and reporting them to our support team. We’ll triage each bug finding and work on the most pressing ones as they come up.

Download The Divi 5 Alpha Report Divi 5 Bug

If you do not have a staging or local site to test with, you can still get your feet wet with the Demo version of Divi 5. This is a great way to get used to the new builder redesign and layout. It’s quite the change, but one that was very much needed.

Try The Divi 5 Demo

The Future of Divi Is Fast

Divi 5 represents a significant leap forward in terms of speed and performance. Divi is now more powerful and responsive with blazing-fast re-rendering, quicker load times, and a redesigned builder that prioritizes utility over style. Whether you’re a solo web designer or part of a larger development team, these improvements will make your workflow faster, smoother, and more efficient.

If you’ve been using Divi 4, you will be blown away by how fast Divi 5 feels. The best part? This is just the beginning. As we optimize and expand the Divi 5 framework, the builder will only get faster and more powerful. The future of web design with Divi is blazing fast—and we’re just getting started.

In the coming days, we’ll talk about what it means that Divi 5 is stepping away from shortcodes, taking a deep dive into the site migration system, and a developer-related vantage. Don’t forget to follow and subscribe to catch these updates and more.

Divi Marketplace

Are You A Divi User? Find Out How To Get More From Divi! 👇

Browse hundreds of modules and thousands of layouts.

Visit Marketplace
Divi Marketplace
Divi Cloud

Find Out How To Improve Your Divi Workflow 👇

Learn about the new way to manage your Divi assets.

Get Divi Cloud
Divi Cloud
Divi Hosting

Want To Speed Up Your Divi Website? Find Out How 👇

Get fast WordPress hosting optimized for Divi.

Speed Up Divi
Divi Hosting
Premade Layouts

Check Out These Related Posts

Step-by-Step Guide For Setting Up Divi Dash

Step-by-Step Guide For Setting Up Divi Dash

Posted on September 25, 2024 in Divi Resources

Managing multiple WordPress sites can be overwhelming, but tools like Divi Dash is can make it easier than it seems. Included with your Divi membership, this powerhouse tool lets you oversee all your sites from one sleek dashboard. This step-by-step guide will show you what Divi Dash is, how to set...

View Full Post

Leave A Reply

Comments are reviewed and must adhere to our comments policy.

Join To Download Today