We are in the midst of a massive project, Divi 5, and I like to update the community every month on our progress. Last month, we dug deep into the five stages of the Divi 5 beta program to better understand how we are approaching such a big project in the most advantageous way for Divi users. We are in Phase 1, Dev Alpha, and we are getting closer to launching Dev Beta, at which point the new Divi 5 API will be solidified. We will invite more developers to join the program while we work towards the first public release later this year.
In this month’s update, we’ll talk about the updates we made to Divi 5. I’ll also show you how fast Divi 5 is, and then I’ll give you a sneak peek of our upcoming Divi AI feature! Let’s dig in.
What We Accomplished This Month
We got a lot done this month! There are many little things that we are filling in, one by one, as we inch closer to our first public release, where the UI will need to be polished and a solid set of Divi features will need to be finished. We worked on section dividers, background videos, condition options, responsive content and fixed a few bugs.
Most of our work focused on solidifying the Divi 5 API, which is what the Dev Beta versions are about. The general trend here is that we are building a foundation to make it easier for our team and the development community to create great Divi modules and features. We need to get this part right so everything else falls into place how we want it to.
We worked on unifying and simplifying Divi 5’s new REST API. We finished several new functions and their implementations, which aim to significantly reduce the time it takes to create a Divi module. Again, we are putting in extra work at the foundation level so that the rest of the Divi 5 project will go faster, and all the modules and features we add after Divi 5 will be developed more quickly.
We also refactored Divi’s shortcode conversion method, which will play an essential role in backward compatibility.
If you are interested in the finer details, here are the most recent changelogs entries:
Divi 5.0.0-dev-alpha.4
- Fix render for background fields in the Shortcode module settings modal
- Fix shortcode module setting fields visibility with regex pattern conditions.
- Added frontend rendering of Section Dividers options.
- Fixed hover options not working properly in the visual builder and front-end for module options that have multiple selectors.
- Refactored @divi/scripts package and add tests
- Published types packages to npm in preparation for release to the public
Divi 5.0.0-dev-alpha.5
- Allow the Shortcode module to send another request when the previous request is aborted automatically.
- Render the sticky options button when the current Shortcode module is sticky.
- Render the sticky options button when the current Shortcode module is inside a sticky module.
- Removed unused default value Record<number, string | Record<string, string>> type in Shortcode module.
- Fixed incorrect Woo Shortcode module elements showing up on a single product page. Affected Shortcode modules: Woo Product Notice, Woo Product Images, Woo Add To Cart, Woo Product Stock, Woo Product Price, Woo Related Products, Woo Product Upsell, and Woo Products.
- Rename the Unsupported module into the Shortcode module along with the module slug, REST API route, label, test cases, and storybook.
- Added Background Video fields in Module Background Options.
- Refactored rendering of Background Video in Visual Builder without REST API calls.
- Added rendering of Background Video Module Options in Frontend.
- Added ScriptData to initialize Background Video in Frontend.
- Added support for Background Video Module Options in Sticky state.
- Updated visibility of Divider fields in Module Options to hide additional options if a Divider Style has not been selected.
- Updated visibility of the Divider Horizontal Repeat setting in Module Options to be hidden for Divider Style options that explicitly reject repetition.
- Updated visibility of the Divider Arrangement setting in Module Options to be hidden in Fullwidth Section settings (where only the default value “below” is allowed).
- Updated the Divider Style field preview in Module Options to reflect any horizontal and/or vertical flip currently applied to the divider.
- Updated the Divider Height field in Module Options to allow saving of percent (“%”) values in addition to the default pixel (“px”) unit.
- Updated the Divider Horizontal Repeat setting in Module Options only to accept positive number values (“1x” or higher).
- Added Conditions options foundation including initial conditions for Author, Logged In, and User Role, remaining Conditions to be added incrementally in future releases.
- Added ElementComponents component, the equivalent of <ElementStyle /> but for rendered HTML elements.
- Added elementClassnames() function, the equivalent of <ElementStyle /> but for functions that output class names.
- Fixed Font Heading Level error.
- Fixed PHP Warnings triggered in Portfolio Module.
- The proper REST permission callback has been added to all registered REST routes.
- A new RoleEditor class has been introduced to determine Divi roles, including tests for the functionality that was refactored from D4 to D5.
- The .sendRequest() features, such as automatic ET and WP nonce addition and stream response support, have been added to fetch().
- The fetch() has been completely refactored for better maintainability and scalability, allowing for the introduction of new and complex conditions and features e.g. .sendRequest()’s options.
- All REST API calls, fetch(), loggedFetch(), and .sendRequest(), have been unified, and now only loggedFetch() is used.
- Refactored conversion mechanism for modules.
Divi 5.0.0-dev-alpha.6
- Improved and streamlined REST API registration, logic, schemas, and tests. Renamed divi/ajax package to divi/rest package.
- Added InlineTextEditorContainer and InlineTextEditor components for Inline Text Editor.
- Added onBlur, onClick, onDoubleClick, onKeyDown, onKeyUp, onMouseDown, and onMouseUp handlers for the Inline Text Editor.
- Added a saving mechanism to update attribute value from the Inline Text Editor field.
- Added event handlers to activate and deactivate editing mode for the Inline Text Editor.
- Added ClassNames based on activation/deactivation and other states like __empty, __editing, __html.
- Added CSS/Inline Style for the Inline Text Editor.
- Refactored WindowEventEmitterInstance to add mousedown event listener.
- Introduced responsive content PHP helper.
- Introduced responsive content JS helper.
- Added responsive content functionality in the FE scripts.
- Added responsive content implementation in Name, Position, Image, and Content elements of the Team Member module
- Added responsive content implementation in the Use Percentage, Percent, and Title elements of the Bar Counters module
- Added responsive content implementation in the Button Text element of the Button module.
- Added responsive content implementation in the Title and Content elements of the Toggle module.
- Added responsive content implementation in the Text Inner element of the Text module.
- Added responsive content implementation in the Title element of the Countdown Timer module.
- Added responsive content implementation in Title, Image, Artist Name, and Album Name elements of the Audio module.
- Added responsive content implementation in the Content element of the Code module.
- Added responsive content implementation in the Title, Content, and Button elements of the CTA module.
- Added responsive content implementation in the Image module.
- Added responsive content implementation in the Title element of the Circle Counter module.
- Added responsive content implementation in the Title element of the Number Counter module.
- Added responsive content implementation in the Title and Content elements of the Tabs module.
- Added responsive content implementation in the Title and Content elements of the Login module.
- Added responsive content implementation in the Show Divider option of the Divider module.
- Added responsive content implementation in Title, Subhead, Content, Logo Image, Header Image, Button One Text, and Button Two Text elements of the Fullwidth Header module.
- Added responsive content implementation in the Fullwidth Image module.
- Added responsive content implementation in the Title and Content elements of the Portfolio module.
- Relocate Shortcode module-related code to the Shortcode Module package.
- Add font heading style renderer on the ElementStyle component.
The Speed of Divi 5
Before we wrap up today’s post, I want to discuss speed. As you may know, we aren’t planning to add many, if any, new features to Divi 5. However, one of the most significant changes that will come with this new version is a massive increase in speed, especially in the Visual Builder, where we all spend so much time.
Even though the Divi 5 UI isn’t finished, and the builder is missing features, I still wanted to give you a sneak peek at the difference in performance that I keep talking about. So please withhold judgment about how things look in this video, which will change, and just focus on the speed of the interactions!
You will immediately notice everything appears instantly as elements are hovered over on the page. Opening the settings popup is equally snappy, as is adjusting design settings. It’s a night and day difference across the board. Also, it doesn’t matter how big and complex the page becomes. The Visual Builder can handle it, and it remains fast.
Achieving this level of speed wasn’t possible in Divi 4, and it’s one of the reasons that this Divi 5 re-architecture is so important.
Coming Soon: Divi AI
That’s everything for this month’s Divi 5 update. However, I do have one more teaser for you. While almost our entire team is focused on Divi 5, we still have a small group of people working on Divi 4 features that won’t affect Divi 5 development, and right now, we are working on something very exciting.
It’s called Divi AI, and it leverages large language models to help you create content, such as text and images, for your Divi websites right inside the builder! Since it’s integrated into Divi, we can teach things about the builder and your website to help it create or improve your content in a way that makes sense and feels incredibly intuitive.
Check out today’s Youtube video for a sneak peek at Divi AI.
Stay Tuned For More Updates
That’s all for our May progress report. If you have any questions, be sure to leave a comment. Stay tuned for next month’s update, and I’ll see you in the next one!
This will be so welcomed by the divi community. Can’t wait! I currently get a lot of errors when editing that say “cannot establish database connection”. I think currently, Divi uses a lot of Ajax calls that just kill my server when I try and edit files. Wondering if this will fix that too?
Hi !
Great ! Really looking forward to Divi 5 being available!
Have you thought about developing the function for adding more breakpoints ? We need please…
Sorry to be the pressing voice, but guys we are needing DIVI 5 so urgently!
Hi Nick Roach,
My Suggestion is don’t waste your time on backward compatibility. Just focus on the future, like PHP 8, and make use of next.js than react.js. Just build the Divi 5 version as a standalone product and cut-down codes for backward compatibility (We can buy it as an upgrade to Divi 5, and update our sites ourselves to migrate to Divi 5). already it’s too late. who else agrees with this?
Hello,
just to be sure you have done speed test with regular computer?
because I’m sure you work with great computer with great CPU, graphic cards and lot of RAM.
but if you try on a low CPU, chip graphic driver and 4 or 8go of RAM, it’s there you can see if it work better too.
I have seen this difference working on the PC of a client and was a terrific experience, took me a lot of of time to load the builder, move elements, display the options panel and saved the page.
hope will be fast for everyone.
So… since the May update, I’ve been waiting, rather impatiently I might add, to see the AI come to Divi. When is that happening? I can’t wait much longer! 😳 😁
Is there any update ETA for the public beta? Even a rough one?
We’ve had so many issues with severe slowness that we’ve been working on a migration to regular Gutenberg blocks. But we won’t go that route if we know even the public beta is coming within, say, six months.
Update released earlier today: Divi 5 June Update.
These developments look impressive. Thanks for the updates and good luck bringing 5.0 to market.
The backend speed is one thing but it’s the front that ultimately matters when it comes to user experience and webspeed scores. A question I have is will Divi 5 automatically update existing sites, or will it require a new build for existing sites?
The frontend speed is the most important. I will say though that, leaving Google’s stringent expectations aside, Divi sites do generally load/run fast enough for most humans not to notice the millisecond differences between sites. Good hosting does make a difference. I see sites slow once heavy plugin add ons are enabled, one of these being WooCommerce, no matter what theme is used… are you listening Automattic?
I’m very impressed to see how Divi is evolving. I do have a question, as I see that Divi 5 will be built more from multiple well defined components (the frontend part with many nodejs packages and a php/wordpress component interacting with the page builder, and a modern way to store the “content” of a page/post). My question is, would the Page Builder have a future to be decoupled from WordPress, having a well defined API that would allow backend adaptors to be built to use it with Laravel, Symfony or other frameworks in other languages, as long as this would offer the Page Builder the correct API to use?
For years, we started to build more and more systems with Laravel that allowed our clients to have better integrated and complete features they needed, as the “CMS” became only a component in a full “CRM” to name it so. The old aproach to try to develop custom features in WordPress for businesses was very unreliable and the CMS for most projects was a component, not the full core of a project.
As I see it for DIVI, to be a decoupled Page Builder that would be able to talk to an API, it would make DIVI the prefered page builder to add to any project as the API adapters would be written for various frameworks.
Of course, I do understand that some “blocks” would be only for WordPress, but those are 99% of the time not in the interest of developers building larger systems in a framework like Laravel, Symfony or Ruby on Rails for example.
Wow, I can’t wait to test all these new functionalities based on AI. Sounds exciting!
Can’t wait to switch to Divi5 either.
All I can say about Divi 5 is WOW!
The new Divi development of a new API, lightning speed, and AI inclusion is a big deal that will position Divi as the market leader in this space. I am very impressed.
I am concerned about the legalities involved in content generation and copyright as the US Patent and Trademark Office stated that content generated programmatically (identicon)or by non-humans (AI/ML) cant be copyright/protected. Is there an official document to read over concerning this?
Will AI comunicate in other languages than in English?
Indycar speed!!!
Great job guys for the development of Divi 5.
Regarding Divi AI: Please give us the ability to split tokens/ have different limits set to per API basis since different clients may use up a common pool of tokens when playing around with the site which will be a costly affair for developers with multiple clients.
I would not be worried by this. First, get yourself an account with OpenAI and use the API to interact and generate content, so you experiment and discover the real costs. Most people cry before they even try.
I have been using OpenAI even before ChatGPT existed, using Davinci before, and now using ChatGPT 4, including 32K version, the most expensive possible, and for my own usage I will say that a client having access to it inside an CMS built by me, was not able to use more then 4-5$ each project (we already provide AI assisted content editing in a custom CMS built internally).
Even for my own usage, I’d say for writing medium articles (1500-2500 words) and using it for suggestions, conversions of content and some other stuff, about 50 full articles should stay around 2-3$ per client.
To end, a website that publishes ~50 articles per month, I’d expect to have for the client a conversion of 100-10000 of the costs to run it after just a few months, so I think if you have clients that will be able to use it, you don’t provide the hosting, maintenance and many features usage for free, am I right?
On the other side, as all requests done to OpenAI can have the costs evaluated with a precision of around ~97% acuracy, Divi should be able to build a cost management feature: limit the usage, report evaluated costs to admins, centralize to some small app, etc.
Is This Update Free For Lifetime Membership?
Boy, does that look fast or what?? Also great to have AI images built in but like Bing images, they are square – I would like to choose the size ratio or the pixel width and height. Is that a possibility?
WOW! – Can’t wait to see this go live!
There have been times when I considered a different builder; I even toyed around with a few on development sites. Based on what I see here, I’m thrilled to remain a dedicated DIVI user/developer. I’m very excited to see the ongoing developments/improvements and look forward to seeing DIVI 5 rollout.
Awesome! Really looking forward to try out your AI with Divi!
Any details about the costs?
Best regards from Germany!
Can we work without AI these days… Can’t wait to work with it. 🙂
Will you charge extra for Divi AI?
A lot of people complain about the pace, quality and relevance of features — and I get it, we want it all now, so it can be frustrating — but I’m genuinely amazed by the intelligent development of Divi and its ecosystem, as well way Nick is navigating ET overall. One of the things I’ve noticed improvement on is the transparency and more regular progress updates, which I’m sure the community appreciates. Absolute kudos to you guys for your the direction you’re going, the authenticity, and the increase in transparency. I’m here for the ride!