Lazy loading not working with Gutenberg editor

Would you please give us a link to the site with the problem?

Also, this may be a plugin or theme conflict. If you can install plugins, install Health Check. On the troubleshooting tab, you can click the button to disable all plugins and change the theme for you, while you’re still logged in, without affecting normal visitors to your site.

With that done, re-activate Jetpack and see if the issue is still there. (If that worked, you’ll be seeing your site under the Twenty Nineteen theme with Jetpack as the only active plugin.)

Hm, that’s odd. What’s the deal with /111/ pages? Are those a custom post type? Was any plugin involved in their creation other than Gutenberg?

What’s special about them that gets them to /work-post/111/ ?

I use them to bypass Cloudflare cache, it has nothing to do with WordPress.

So, if I’m understanding correctly:

ar.hostingdean.com/best-hosting/ is cached by Cloudflare, and Lazy Load does _not_ work there.

ar.hostingdean.com/best-hosting/111/ is the same page, but _not_ cached by Cloudflare, and Lazy Load works there.

If so, it sounds like the problem is Cloudflare’s cache.

No, it is not Cloudflare at all.
The one without /111/ is cached before enabling Lazy load feature in the settings of Jetpack.
Now, Lazy loading is enabled and the one with /111/ is the page with Lazy loading feature enabled, but as you see it is not working and the images do not appear at all.

I see the Lazy Load JavaScript loaded, the original images can be accessed directly too, and the only error I see in the JavaScript console for https://ar.hostingdean.com/best-hosting/111/ is:

TypeError: headertext[h] is undefined
breeze_2fc008387f8213fd2ee9209772bb93b7.js:96:120
<anonymous> https://ar.hostingdean.com/wp-content/cache/breeze-minification/js/breeze_2fc008387f8213fd2ee9209772bb93b7.js:96

And that’s related to a cached minification scrip, not us.

Minification does have a habit of breaking things, and well if minification is broken too, that could probably pose a problem.

Is there any improvement if you switch off minification and flush the cache again?

In general though, I recommend getting rid of Breeze if you’re already using Cloudflare. Nothing good ever came from caching a cache.

• This reply was modified 5 years, 12 months ago by James Huff. Reason: Who knows how to spell minification anyway?

So, why is it working on other pages with classic editor?!

• This reply was modified 5 years, 12 months ago by Ahmed Elgameel.

I think because pages with the Classic Editor use a lot less JavaScript, that’s a lot less things for the Minification system to break (which minification systems do, very often).

Minification systems are great for static HTML/CSS sites, that’s what they were made for. But on dynamic sites with plenty of JavaScript, like WordPress, sites seem to be broken half the time.

Is there any improvement if you switch off minification and flush the cache again?

It is working now, I didn’t disable minification. I disabled grouping js files only, it is even better as I’m using Cloudflare’s Rocket loader which loads js files inline.

Thanks a lot for your help James.