Hidden Elementor sections slow down website. How to fix?

  • Resolved hellopeepeepoopoo

    (@hellopeepeepoopoo)


    3 years, 3 months ago

    I’m using Elementor’s Responsive settings to create device-specific sections. Meaning there are sections that are only visible on Desktop, sections that are only visible on Tablets, and sections that are only visible on Mobile.

    The problem is that when the website is opened it loads every single section first, including the invisible ones. This means that if you visit the website on a mobile device it will wait to load all sections, including the desktop and tablet sections that the user does not see nor need, and only until all sections are loaded does the website open. This hugely slows down the website’s loading time. I verified this by deleting all sections except the mobile ones and the website’s mobile performance score on PageSpeed Insights literally doubled.

    Why does Elementor block the page from opening until the invisible unneeded sections are loaded? Is there a way to defer their loading until after the page has loaded?

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

Viewing 5 replies - 1 through 5 (of 5 total)
  • israelaz

    (@israelaz)

    3 years, 2 months ago

    Hi

    After hiding the sections, they will still load on the website but won’t be visible if they are hidden for a specific device. So, if you have much content hidden, it may have a little impact on page loading speed. In case you see the hidden elements displayed on the page, please make sure that you clear all forms of cache, including your browser cache, your WP cache (your WP caching plugin if you have one), and your server cache.

    When it comes to speed optimization, there are quite a number of steps to optimize your website for speed. Since this has been a bit of a widely asked question, our team has come up with a checklist of sorts with some good steps to take to ensure your website performs as best as possible. You may have a run through it below and see if it helps.

    Guides:
    How to Speed Up a Slow Site With Elementor
    Blog – How to Speed Up Your WordPress Website
    Blog – How to Speed up Your Elementor Site Using WP Rocket

    Thread Starter hellopeepeepoopoo

    (@hellopeepeepoopoo)

    3 years, 2 months ago

    @israelaz Hi thank you for your response but you didn’t answer the question. How do I prevent hidden sections from loading, or only allow them to load after the page has already loaded? They are having a massive effect on page loading speed, as I have tested and verified this.

    israelaz

    (@israelaz)

    3 years, 2 months ago

    Hi

    This is not currently possible with Elementor default settings. Some third-party plugins can help with optimization/loading settings, but there aren’t any Elementor options to prevent hidden sections from loading. You can refer to the optimization plugin support team for additional information and helpful suggestions related to CSS loading settings.

    Also, we can suggest you join the Elementor Community​ where you can find a supportive and helpful community of experienced users that are happy to provide useful tips and tricks.

    Thread Starter hellopeepeepoopoo

    (@hellopeepeepoopoo)

    3 years, 2 months ago

    @israelaz If it’s not available in Elementor options then how do you directly edit the code that Elementor uses?

    israelaz

    (@israelaz)

    3 years, 2 months ago

    Hi

    Questions related to Elementor code and its inner functioning are best addressed with our developers. If you would like assistance with these kinds of issues, I advise you to visit our GitHub page on http://www.github.com/elementor and submit this query to our developers, as they will be able to assist in the best possible way and/or give you advice on how this can be handled.

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Hidden Elementor sections slow down website. How to fix?’ is closed to new replies.