Title: Cumulative Layout Shift while using the Plugin
Last modified: August 5, 2021

---

# Cumulative Layout Shift while using the Plugin

 *  Resolved [Josue Ardon](https://wordpress.org/support/users/josueardon/)
 * (@josueardon)
 * [4 years, 9 months ago](https://wordpress.org/support/topic/cumulative-layout-shift-while-using-the-plugin/)
 * Hi guys,
 * I’m having a problem with the plugin. The Cache is working good but it is creating
   Cumulative Layout Shift in random pages. The pages are always different, and 
   the only way I can fix them is by purging the cache in each individual page.
 * The issue only appears when the plugin is active. As I am not an expert I checked
   every single page of my website before activating the plugin, and I have not 
   done any major change.
 * These are the other plugins I have:
    -Astra Pro -Elementor -Elementro Pro -Perfmatters-
   Redirection -Yoast SEO
 * The CLS problem is in the upper part of the pages where the main menu is. You
   may see the problem for example in this page here: [https://mayangateway.com/roatan-tailor-made-ride/](https://mayangateway.com/roatan-tailor-made-ride/)
   
   I have not purged this one so you see the problem, the other I have purged.
 * What should I do? I’d pay for support if necessary because this is taking me 
   a lot of time, as I need to be checking every single page. Of course, the other
   solution is deactivating your plugin, but I really want to keep it as it improves
   the performance.
 * Thank you in advance for your help.
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fcumulative-layout-shift-while-using-the-plugin%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 15 replies - 1 through 15 (of 20 total)

1 [2](https://wordpress.org/support/topic/cumulative-layout-shift-while-using-the-plugin/page/2/?output_format=md)
[→](https://wordpress.org/support/topic/cumulative-layout-shift-while-using-the-plugin/page/2/?output_format=md)

 *  Plugin Contributor [iSaumya](https://wordpress.org/support/users/isaumya/)
 * (@isaumya)
 * [4 years, 9 months ago](https://wordpress.org/support/topic/cumulative-layout-shift-while-using-the-plugin/#post-14739374)
 * This plugin doesn’t do any CLS issues as the only thing that this plugin manages
   is caching which has nothing to do with CLS. Check the Google Page Speed report,
   it will show you that what item in your page is causing the CLS.
 *  Thread Starter [Josue Ardon](https://wordpress.org/support/users/josueardon/)
 * (@josueardon)
 * [4 years, 9 months ago](https://wordpress.org/support/topic/cumulative-layout-shift-while-using-the-plugin/#post-14749922)
 * Hi Saumya,
 * Thank you for your answer, I appreciate it. The implementation of your plugin
   is causing the CLS issue, and please let me explain you why.
 * Some background:
    I’ve been trying to implement the Cache Everything page rule
   since more than two months ago. I even purchased for two months the Business 
   Plan of CloudFlare so that I could implemente the page rule that your plugin 
   does with ByPass Cache on Cookie. I had the exact same problems with this page
   rule, that I am having with your plugin at the moment. I’ve have exchanged many
   messages with CloudFlare support about this too. I obviously stopped the Business
   plan when I found your plugin because it is very expensive and your plugin makes
   it easier.
 * Based on what the CLoudFlare support have told me is that the page rule (now 
   being implemented by your plugin) is caching some dynamic content that creates
   the issues. They suspected that the files creating the issues are some CSS files
   created by Elementor, so they recommended me to create a page rule to Bypass 
   all the Elementor files, and I have placed it in the first place as they recommended
   me. This is the page rule I have created:
    *mayangateway.com/*elementor* Cache
   level: Bypass
 * I have applied this rule, but it did not fix the problem.
 * How do I know that the implementation of your plugin (or the page rule without
   your plugin) creates the problem?
    1. Because when I deactivate your plugin the
   issues disappeared. 2. Because when I purge individually the pages with the CLS
   the problem disappeared. If you now open the link that I sent you in the previous
   message with the issue, it will be fine because I’ve purged its cache.
 * The CLS issue appears suddenly in pages that were fine, and I can only fix the
   pages by either purging them individually or deactivating the plugin.
 * It takes a lot of time to check my website daily (over 170 pages) to find and
   purge the cache of the pages with the issues.
 * The performance of my website improves a lot with the plugin, and I really want
   to keep it. I know it is a strange case, but would you please help me on this?
   
   Perhaps, is there a way to find the files that are not suppose to be cache and
   create page rules for those files? or exclude them?
 * This page did not have the issue yesterday, and today it does: [https://mayangateway.com/best-nicaragua-treks/](https://mayangateway.com/best-nicaragua-treks/)
   
   I’m going to leave it with the problem, without caching it so that you may see
   an example.
 * I know it is a strange case, but I guess it could be useful to other users that
   have the same problem as I do.
 * Thank you in advance for your assistance.
    Best wishes,
 *  Plugin Contributor [iSaumya](https://wordpress.org/support/users/isaumya/)
 * (@isaumya)
 * [4 years, 9 months ago](https://wordpress.org/support/topic/cumulative-layout-shift-while-using-the-plugin/#post-14749968)
 * Hi,
    I totally understand what you are saying but I can assure you that the CLS
   issue is not coming from the plugin but rather coming from your site design.
 * When I checked page speed inside for the above mentioned URL: [https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fmayangateway.com%2Fbest-nicaragua-treks%2F&tab=desktop](https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fmayangateway.com%2Fbest-nicaragua-treks%2F&tab=desktop)
   
   I saw that there is no CLS on Mobile: [https://i.imgur.com/VqtxfyE.png](https://i.imgur.com/VqtxfyE.png)
 * But on desktop, there are major CLS issues: [https://i.imgur.com/viKMbrS.png](https://i.imgur.com/viKMbrS.png)
   
   On the page speed insight page it even shows the list of items that are causing
   CLS: [https://i.imgur.com/BBzYo7K.png](https://i.imgur.com/BBzYo7K.png)
 * Upon checking your page further I can see that there are lots of elements moving
   around. Please note that as per the Core Web Vitals guidelines, no element of
   your page should change it’s position, design or looks in any way from the point
   of initial loading. So, when someone comes to a page each element should remain
   at it place always.
 * But when I checked your page, I saw that is not happening and a lot of items 
   are moving around. Take a look at this loom: [https://www.loom.com/share/de77477a8b904b1483a7d0caaff3ee2a](https://www.loom.com/share/de77477a8b904b1483a7d0caaff3ee2a)
 * As you can see your contents are shifting around and changing positions like 
   crazy. This is because of your theme and elementor, not this plugin. Even if 
   you disable this plugin the core web vitals issue will remain on your site unless
   you use a theme what has been properly coded following all the guidelines. Your
   contents are highly javascript dependent which is basically means that initially
   your page look in a way and then after the javascript are loaded it changes it’s
   looks, hence the CLS.
 * Aain, there is nothing that can be done about it via this plugin or via Cloudflare,
   even if you buy the enterprise plan.
 *  Thread Starter [Josue Ardon](https://wordpress.org/support/users/josueardon/)
 * (@josueardon)
 * [4 years, 9 months ago](https://wordpress.org/support/topic/cumulative-layout-shift-while-using-the-plugin/#post-14750001)
 * Hi Saumya,
 * Thank you for this information and your speedy reply. But then, why the problem
   disappears if I purge the page? or if I deactivate the cache and/or your plugin?
   also, why the pages with the issue are always different?
 * If you wish to see it, I can purge the cache of the link that I sent you in the
   previous message, and then you will see that the page is correct again. You see
   that the page has CLS issue in the PageSpeed test, but if you test any other 
   page of my website you will not find this issue: [https://mayangateway.com/](https://mayangateway.com/)
   
   And as I said, if I purge the cache of the page of the previous message, you 
   will see it correctly with cero CLS issues.
 * The pages are always different, later today I will have a couple of different
   pages whit the issue, and I will be able to fix them if I purge them.
 * Perhaps, I shouldn’t have said that your plugin specifically is creating the 
   CLS, but the Cache Everything page rule that implements the plugin.
 * Best wishes,
 *  Plugin Contributor [iSaumya](https://wordpress.org/support/users/isaumya/)
 * (@isaumya)
 * [4 years, 9 months ago](https://wordpress.org/support/topic/cumulative-layout-shift-while-using-the-plugin/#post-14750051)
 * > But then, why the problem disappears if I purge the page? or if I deactivate
   > the cache and/or your plugin? also, why the pages with the issue are always
   > different?
 * – It does not. Deactive caching and disable the plugin. Then use an incognito
   window and throttle your internet and test like shown in the loom video.
    You
   can disable caching on this plugin and let me know. I will check the page again.
 * As I said before, this is just a caching plugin and has nothing to do with CLS.
 *  Thread Starter [Josue Ardon](https://wordpress.org/support/users/josueardon/)
 * (@josueardon)
 * [4 years, 9 months ago](https://wordpress.org/support/topic/cumulative-layout-shift-while-using-the-plugin/#post-14750093)
 * Yes, the problem disappears when I purge the pages.And yes, the problem disappears
   when I deactivate the plugin.
 * As proof, you may check the page now:[https://mayangateway.com/best-nicaragua-treks/](https://mayangateway.com/best-nicaragua-treks/)
   (
   just refresh your browser please)
 * I know your plugin has nothing to do with CLS. But, your plugin activates the
   Cache Everything page rule of CloudFlare. I already tried this page rule when
   I had the business plan of CloudFlare, and I had the same issues. It was very
   difficult because as you know we are caching dynamic content, so I was very happy
   when I found your plugin as I am not an expert but I do know this situation very
   well because I’ve been trying to find a solution since two months ago.
 * and please, don’t get me wrong, I really want the plugin.
 *  Plugin Contributor [iSaumya](https://wordpress.org/support/users/isaumya/)
 * (@isaumya)
 * [4 years, 9 months ago](https://wordpress.org/support/topic/cumulative-layout-shift-while-using-the-plugin/#post-14750155)
 * OK. Now I do see, what you have ben saying all along. It seems that elementor
   is generating different files for different devices. By that what I mean is that
   when you access your page via a mobile device some different CSS/JS are loaded
   and when you are accessing the page via desktop some other files gets loaded.
 * Now this is not true responsive system and with this system you will never be
   able to use a proper caching system and it will always give you the problem. 
   The reason I am saying this is because lets say your page [https://mayangateway.com/best-nicaragua-treks/](https://mayangateway.com/best-nicaragua-treks/)
   initially is not cached by Cloudflare.
 * Now the first request of this page came from a mobile device and hence Cloudflare
   caches the page with whatever content and HTML structure it had. Now when the
   same page is being visited from a desktop, the PHP is not getting parsed anymore
   and Elementor is not able to add the new dynamic styles for the desktop, instead
   the page is being served via the Cloudflare CDN cache. Now as CF initially cached
   it for the mobile, it delivered the page as it received initially causing your
   CLS issue.
 * That is the main reason for this problem. Unfortuantely in this situation, you
   won’t be able to use a cache everything page rule as the page is always needs
   to be served from the origin server after executing PHP.
 * On a true response design website this doesn’t happen. The design and code remains
   static while they morf themselves to the situation as needed without the need
   for any dynamic generation.
 * Hope this clarifies the question you had about why this was happening.
 *  Thread Starter [Josue Ardon](https://wordpress.org/support/users/josueardon/)
 * (@josueardon)
 * [4 years, 9 months ago](https://wordpress.org/support/topic/cumulative-layout-shift-while-using-the-plugin/#post-14750228)
 * Thank you for your answer. I knew Elementor is causing these issues. However,
   isn’t WordPress dynamic anyway? so is there not a way to avoid these files from
   Elementor to create these problems? perhaps a page rule or anything with the 
   plugin settings?
 * or you’re saying that I can’t use the plugin at all? but there should be a lot
   of Elementor user that have your plugin, or not?
 *  Plugin Contributor [iSaumya](https://wordpress.org/support/users/isaumya/)
 * (@isaumya)
 * [4 years, 9 months ago](https://wordpress.org/support/topic/cumulative-layout-shift-while-using-the-plugin/#post-14752973)
 * Yes WordPress is a Dynamic system but when the first request (i.e. the HTML) 
   is being cached by Cloudflare, when that cached response is served from CF CDN
   there is no PHP involvement. So, first time when someone request the page at 
   that time it is not cached in CF so, page gets generated by WordPress after executing
   all PHP logics. But after CF caches the HTML of the page to it’s CDN server and
   from then on serve it from the CDN without even sending the request to the origin
   server.
 * Due to your current setup, this plugin (as well as cache everything page rule)
   will cause web vitals issues on your site so I would recommend only taking advantage
   of the plugin when you have a proper responsive website whose response ness is
   not managed by PHP logic like it is happening right now.
 *  Thread Starter [Josue Ardon](https://wordpress.org/support/users/josueardon/)
 * (@josueardon)
 * [4 years, 9 months ago](https://wordpress.org/support/topic/cumulative-layout-shift-while-using-the-plugin/#post-14753120)
 * Hi again,
 * I understand, but basically your plugin is not compatible with Elementor then?
   or it doesn’t work very well with Elementor?
 * I haven’t worked or even tried to change any PHP settings, based on what you 
   said, the problem only comes from the different Elementor CSS/JS files.
 *  Plugin Contributor [iSaumya](https://wordpress.org/support/users/isaumya/)
 * (@isaumya)
 * [4 years, 9 months ago](https://wordpress.org/support/topic/cumulative-layout-shift-while-using-the-plugin/#post-14753139)
 * The plugin is fully compatible with elementor but your elementor setup is different
   where designs for different devices are being generated dynamically. That’s why
   you are seeing the core web vital issue, but then again the plugin is fully working
   and caching your pages as it is supposed to. Due to your implementation, you 
   are seeing the issues.
 *  Thread Starter [Josue Ardon](https://wordpress.org/support/users/josueardon/)
 * (@josueardon)
 * [4 years, 9 months ago](https://wordpress.org/support/topic/cumulative-layout-shift-while-using-the-plugin/#post-14753204)
 * I understand, I needed to know that because I’m contacting Elementor at the same
   time to find out a solution.
 * In the meantime, I have disabled in Elementor an ‘experiment’ that I had previously
   enabled. It is in Beta Status, and it is called Improved Asset Loading. It sounds
   a little like what you are explaining me: [https://elementor.com/help/optimized-assets-loading/?utm_source=experiments&utm_medium=wp-dash&utm_campaign=learn](https://elementor.com/help/optimized-assets-loading/?utm_source=experiments&utm_medium=wp-dash&utm_campaign=learn)
   
   It says that when activated, parts of the infrastructure code will be loaded 
   dynamically, only when needed. What do you think? perhaps that could be the setting
   that I needed to change?
 * Thank you for your patience by the way!
 *  Plugin Contributor [iSaumya](https://wordpress.org/support/users/isaumya/)
 * (@isaumya)
 * [4 years, 9 months ago](https://wordpress.org/support/topic/cumulative-layout-shift-while-using-the-plugin/#post-14753209)
 * Yes, that sounds like the culprit. Can you try disabling that and then check 
   is the problem gets resolved?
 * ALso if you are using “Conditional and Inline CSS Load Experiment”. Trurn that
   off as well.
 * Basically, turn off any experiments that lead to dynamic loading of assets.
 *  Thread Starter [Josue Ardon](https://wordpress.org/support/users/josueardon/)
 * (@josueardon)
 * [4 years, 9 months ago](https://wordpress.org/support/topic/cumulative-layout-shift-while-using-the-plugin/#post-14753264)
 * Thank you! Done, I have disabled it.
 * The only two other experiments that I have enabled are:
 * 1. Optimized DOM: [https://elementor.com/help/what-is-the-optimized-dom/?utm_source=experiments&utm_campaign=learn&utm_medium=wp-dash](https://elementor.com/help/what-is-the-optimized-dom/?utm_source=experiments&utm_campaign=learn&utm_medium=wp-dash)
   
   2. Accessibility Improvements: [https://elementor.com/help/accessibility-improvements-experiment/?utm_source=experiments&utm_medium=wp-dash&utm_campaign=learn](https://elementor.com/help/accessibility-improvements-experiment/?utm_source=experiments&utm_medium=wp-dash&utm_campaign=learn)
   What do you think? should I keep them? I didn’t really see any performance gain
   with the experiments anyway.
 * I will need sometime to test, usually the issue come after like 6 hours at least.
   I will let you know once I’m done, perhaps this may help other Elementor users.
 *  Plugin Contributor [iSaumya](https://wordpress.org/support/users/isaumya/)
 * (@isaumya)
 * [4 years, 9 months ago](https://wordpress.org/support/topic/cumulative-layout-shift-while-using-the-plugin/#post-14753287)
 * Well, if they are not helping you much you can disable them. Ok. so after you
   have disabled them, have you tested, is the issue still persist?

Viewing 15 replies - 1 through 15 (of 20 total)

1 [2](https://wordpress.org/support/topic/cumulative-layout-shift-while-using-the-plugin/page/2/?output_format=md)
[→](https://wordpress.org/support/topic/cumulative-layout-shift-while-using-the-plugin/page/2/?output_format=md)

The topic ‘Cumulative Layout Shift while using the Plugin’ is closed to new replies.

 * ![](https://ps.w.org/wp-cloudflare-page-cache/assets/icon-256x256.gif?rev=3234997)
 * [Super Page Cache – Cloudflare Cache, Page Speed & Core Web Vitals](https://wordpress.org/plugins/wp-cloudflare-page-cache/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/wp-cloudflare-page-cache/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/wp-cloudflare-page-cache/)
 * [Active Topics](https://wordpress.org/support/plugin/wp-cloudflare-page-cache/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/wp-cloudflare-page-cache/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/wp-cloudflare-page-cache/reviews/)

## Tags

 * [cumulative layout shift](https://wordpress.org/support/topic-tag/cumulative-layout-shift/)

 * 20 replies
 * 2 participants
 * Last reply from: [iSaumya](https://wordpress.org/support/users/isaumya/)
 * Last activity: [4 years, 9 months ago](https://wordpress.org/support/topic/cumulative-layout-shift-while-using-the-plugin/page/2/#post-14754417)
 * Status: resolved