Cloudflare, Hummingbird and Smush Pro Settings Using Divi Theme

The page speed and the not loading correctly became especially frustrating, because the day before the release the site speed was an A on GTMetrix, and a 92 on Google Insights because of a few weeks of work.

Before Divi Performance Update

After Divi Performance Update

After Suggested Steps Detailed Below

Adjust Settings of Cloudflare and Hummingbird When Using Divi Theme

After reading some of the comments on the release of the Divi Performance Update, we soon found out we were not the only one having challenges with site speed being worse, many people sites slowed down or completely crashed.

Loading the Divi Builder was either not working, or taking so long to load it was painful. Here are the steps that were took to get the website back to a A page speed grade on GTMetrix.

Step 1. Turn Everything Off

Basically, we are going to do a complete reset of Hummingbird.

• If you are using a cache, turn it off. If you are using a CDN (Cloudflare in this example), go into Development Mode so you can bypass their cache to see the changes you make in real time.
• From the Hummingbird menu go to Hummingbird -> Settings -> Data and Settings and click the "Reset" button to start fresh.
• Go to Divi -> Theme Options -> General -> Performance and disable all of the selections.
• Go to Hummingbird -> Caching and clear Caching.

Step 2. Re-activate Humming Caching

Now that Hummingbird is reset, do not reactive the Hummingbird's Asset Optimization engine, but instead go to Hummingbird -> Caching and be sure that Page Caching, Browser Caching, Gravatar Caching and RSS caching are all activated.

Step 3. Connect Hummingbird Back to Cloudflare

• From Hummingbird -> Caching -> Integrations, reconnect with Coudflare.
• Enable APO and select 'Cache by device type'

Step 4. GZip Compression

It may already be turned on, but go to Hummingbird -> GZip compression and be sure that your hosting has automatically pre-configured GZip compression for you. If not, first click 'Recheck Status". If it does not say 'Active', then configure it now.

Step 5. Reconnect with your CDN.

In step 1 you went into development mode. Now turn that back to normal so you are connected again with your CDN.

UPDATE:

The very next day after we posted this, Elegant themes came out with an excellent read about all of this, Divi Speed Optimization: the Ultimate Guide.

Here is an exerpt, but I suggest you read the .

One of the best ways to add minification to your entire site’s HTML, JS, and CSS is to use Cloudflare. Cloudflare uses Auto Minify to reduce the file size of all the source code on your website. Plus it comes standard with the free version.

Some credible plugins that will minify your site files include:

• Autoptimize
• W3 Total Cache (read our review)
• W3 Super Cache (read our review)
• WP Rocket (paid)

These plugins should work with Divi. But there is no way to gauge all the nuances of a website to say one will work best for everyone. Sometimes, third-party plugins will automatically minify JavaScript files in a way that may cause errors/problems, so please be sure to test your website thoroughly. In general, it is always safe to minify CSS files. But be careful with those JavaScript files.

And if there is a conflict, you may need to disable Divi’s built-in options and let the third-party plugin handle things.