How to Build a Custom Grid Layout with the Divi 5 Grid Editor
Build custom CSS Grid layouts in Divi 5 visually with the new Grid Editor: columns, gaps, spans, offset rules and responsive tweaks. No code. Step by step.
Read the articleWhen someone tells me their Divi site is slow, they usually expect me to blame Divi. It's rarely Divi. Most slow Divi sites are slow for the same reasons any WordPress site is slow: the server takes too long to answer, nothing is cached, the images are far bigger than they need to be, or a pile of plugins and third-party scripts load on every page. This guide walks through how I find the real cause, in the order I check things, and what to do about each one.
Don't change anything until you've measured. Run the page through Google PageSpeed Insights and keep a copy of the results: print the report to PDF from your browser, or take a screenshot. Test a real inner page, not just the homepage, and test mobile, because that's the score Google leans on. Without a before number you can't tell whether a fix helped or just moved the problem.
PageSpeed Insights gives you two kinds of data, and they answer different questions:
| What you see | What it means |
|---|---|
| Real-user data ("Discover what your real users are experiencing") | How the page actually performed for visitors over the last 28 days. Only shows up once the page has enough traffic. This is what Google uses. |
| Lab data (the Performance score) | One simulated load on a throttled phone. Good for finding causes and testing fixes, but it moves around from run to run. |
The number that tells you the most about a slow site is the server response time. In the lab report, look for "Reduce initial server response time" or a long "Time to First Byte". If the server takes more than about 600ms just to start sending the page, no amount of image or CSS work will make the site feel fast. Start at Phase 2.
If the first byte is slow, the problem is the server doing too much work on every visit, or doing it on underpowered hardware. Divi builds each page from your layout every time it's requested, like any WordPress page. Page caching saves the finished page and hands that copy to the next visitor instead.
Divi has a set of performance features under Divi → Theme Options → General → Performance. They're on by default, and they're the first thing that gets switched off while someone is troubleshooting something else and then forgotten. Open the tab and check them:
| Setting | What it does |
|---|---|
| Dynamic Module Framework | Loads only the code for the modules a page actually uses. |
| Dynamic CSS | Generates only the styles each page needs instead of one large stylesheet. |
| Dynamic Icons | Loads only the icons in use instead of the full icon font. |
| Critical CSS and Critical Threshold Height | Loads the styles for the top of the page first and defers the rest, so the page appears sooner. |
| Dynamic JavaScript Libraries | Loads scripts only on pages that need them. |
| Defer jQuery And jQuery Migrate, Defer Gutenberg Block CSS, Defer Additional Third Party Scripts | Stops those files from blocking the page while it renders. |
| Improve Google Fonts Loading, Limit Google Fonts Support For Legacy Browsers | Loads Google Fonts more efficiently. |
| Disable WordPress Emojis | Removes WordPress's emoji script, which almost no business site needs. |
Divi and a caching or optimization plugin will both try to combine, minify and defer CSS and JavaScript. Running both is a common cause of broken layouts and no speed gain. Pick one to own each job. If you keep Divi's Critical CSS on, turn off the plugin's version of the same thing. I've found it works best not to use any "performance" plugins with Divi at all, and to use caching features only. I recommend the free version of Super Page Cache, which also integrates with Cloudflare.
After the server, images are the most common cause I see. A single photo uploaded straight from a phone or a stock site can be several megabytes, and a Divi page with a slider and a gallery can easily carry a dozen of them.
Plugins aren't slow because there are many of them. They're slow when they load code on every page whether it's needed or not. The same goes for third-party scripts: chat widgets, booking tools, embedded maps, social feeds, tracking pixels and video embeds each add their own downloads.
Run the same page through PageSpeed Insights after each change and compare it with your before number. Make one change at a time where you can, so you know which fix actually helped. Real-user data takes weeks to catch up, so judge individual fixes by the lab numbers and the overall result by the real-user data a month later.
Speed also slips back over time. New plugins get added, bigger images get uploaded, and settings get changed during troubleshooting. A quick check every few months catches it before visitors notice.
If you've worked through this and the site is still slow, or you'd rather not spend the afternoon on it, that's the kind of work I do every day. I can find what's slowing your site down and fix it, and my Webcare plans keep it fast after that. You'll find more Divi 5 guides on my Divi specialist page.
Build custom CSS Grid layouts in Divi 5 visually with the new Grid Editor: columns, gaps, spans, offset rules and responsive tweaks. No code. Step by step.
Read the articleAdd live search, category filters and sorting to any Divi 5 blog or portfolio loop with the new Post Filter module — no plugin, no code. Step by step.
Read the articleSecond Chance Dance is a Philadelphia dance studio built on one idea: it’s never too late to dance. They came to me with a dated website that didn’t reflect that warmth — and, more importantly, wasn’t built to do its real job: fill classes and get people onto the studio’s booking app. Here’s how I […]
Read the article