Hello,
I’m currently auditing the performance of a website built with your theme and I’ve noticed a behavior that I’d like to better understand.
When analyzing the page using HAR files and GTmetrix, I can see that the resources associated with a sticky/floating bar are being requested during the initial page load, even though the bar is not visible to the user on first render and only appears after scrolling.
Examples of these resources include images such as:
(Show this https://www.trebol-apuestas.com/william-hill/ )
juego-autorizado.webp
juego-seguro.webp
juega-con-responsabilidad.webp
fleha.png.webp
These assets are being downloaded as part of the initial loading process and therefore become part of the critical rendering path.
I would like to know:
Does the theme render the entire sticky bar HTML in the DOM during the initial page load by default?
Is there a built-in option to delay the loading/rendering of the sticky bar until the user reaches a specific scroll position?
Is it possible to load the sticky bar dynamically via JavaScript after a scroll event or after the page has fully loaded, so its assets do not participate in the initial render?
Does the theme provide any hooks, filters, or settings that allow true lazy loading of this component (not only its images, but the widget itself)?
My goal is to prevent non-visible UI elements from downloading assets and consuming bandwidth, network requests, and rendering resources before they are actually needed by the user.
Could you please advise on the recommended technical approach within your theme to achieve this?
Thank you very much.
Hi,
If the sticky bar you are referring to is this row displayed at the bottom on mobile -> https://prnt.sc/1LzN6S1iisda then it is indeed loaded together with the rest of the page. Making a row sticky doesn’t mean that it’s content is loaded with a delay, there’s no option for something like that unfortunately and I can’t provide instructions on how it could be done. The only load delay the theme provides is for mega-menus, popups, footer, which were made by our developers as options in the composer and theme panel.
If maybe that sticky row is needed just for tablet/mobile, you could use a mobile page to stop loading it unnecessarily on desktop -> https://prnt.sc/igZ3qKBfCvvi I see no sticky row on desktop at this time, only on mobile.
The page is already very fast on desktop -> https://prnt.sc/JOg1CSHQz3aK and on mobile -> https://prnt.sc/KGKTTUvDDi5S due to the WP Rocket optimization for CSS and JS. And I see that the automatic lazy rendering is working as well -> https://docs.wp-rocket.me/article/1835-automatic-lazy-rendering The website is very fast.
Thank you!
