How to load JS react first on WordPress website to resolve the CLS issue?

  • Nabeel

    (@nabeelahmedk)


    4 weeks ago

    Hello,

    My WordPress site with the Kadence premium theme is experiencing a CLS issue on Google. I suspect a React plugin is causing this, but it needs to load before the rest of the page. There’s a noticeable page flash before loading.

    If you load the website you can flush off the page before actually loading the Test screen tool. Please also review the Fake screen page, which has a similar issue.

    Thanks

    • This topic was modified 4 weeks ago by Nabeel.

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • !Benni

    (@benniledl)

    3 weeks, 6 days ago

    Hey, with the WPCode plugin you can add a custom html script to the page:

    <link rel="preload" as="script" href="https://yourdomain/your-resource-to-preload">

    You need to modify the url to point to the resource that you need to preload to render the page.

    Also it’s important for you to improve your Time To First Byte. I highly recommend you using the Plugin WP Fastest Cache for this!

    Thread Starter Nabeel

    (@nabeelahmedk)

    3 weeks, 3 days ago

    Hello,

    Thanks for your response. I am using Astra child theme, shall i add this preload link in header or do i need to install the plugin??

    also, I am using WP-Rocket plugin and its send me notice to deactivate other caching plugin when i installed WP Fastest Cache?

    Note: I also enable the preload option with WP-Rocket, but its still showing a flash of text before the actual tool loading.

    Thanks

Viewing 2 replies - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.

Tags