I’m having loading speed issues which Lighthouse has said is partially caused by Builder. Below is a screenshot. I’m not sure what is causing the lag. Any suggestions?
I’m also getting an issue that the LCP is being lazy-loaded. I edit the setting in the JSON console, but it automatically changes back to “true”. I’ve looked in the organization settings and I have it set to Below the Fold only for lazy load, even though this image is at the top.
Also, I’ll mention that I didn’t experience speed issues until a few days ago. I didn’t make any changes to the Builder pages that might have caused this.
At a high level, Builder will not cause a performance hit and any content within Builder will be fully optimized. I run a lighthouse report on your site and got a good performance report for desktop and mobile. In your case Third-party code blocked the main thread for 6490ms and in my case they were only blocked for 560ms. We recommend performing lighthouse test in incognito mode after disabling all the plugins/extentions, also if you could try and use another performance measuring tool like Pingdom, PageSpeed Insights that will be great, considering lighthouse chrome extensions has’nt been updated in so long, a lot has changed since they last updated in November 20, 2019.
Regarding lazy loading issue, editing the settings in JSON console will always revert back to true as long as lazy loading under advanced settings is enabled. So, either you can try disable lazy loading under advaned settings first and then edit JSON or you can use javascript to remove lazy loading from any specific image e.g.
let image = document.getElementsByClassName('css-1xg9q65');
image[0].removeAttribute('loading');
Thanks for helping with the specifics. That’s great support!
I’ve re-run the speed test on PageSpeedInsights (using Incognito on Chrome).
I’m still getting a long time on the Script Evaluation, and the Builder web components, per below screenshot. Do you have any suggestions? I don’t believe our site is very complicated so I’m not sure what the root cause is.
It’s not possible to remove those builder scripts from the main thread, however, if there are pages that don’t need builder widgets, it is possible to lazy load them only when they are used in content to improve performance.
Let us know if you have any further questions. Thank you!
Yes, I’m referring to the other pages like the product page or about page. Otherwise, It’s not possible to remove those builder scripts from the main thread.
Hey @ian - we actually just changed how we lazy load images in Builder to be more optimal, if you just republish your page it’ll generate with the latest update, and you won’t need that snippet of code @manish-sharma gave you anymore
Additionally, we have a new high speed mode coming that reduces JS execution, powered by our Qwik framework. We should be able to get you early access to that soon if interested
@steve thanks for the info. I’m definitely interested in the high speed mode with Qwik.
I see that is an option in the Advanced Settings > Labs. Would this be a good fit for us to try out?
@ian that’s the one! There are some caveats to know of that I hope to document today, let me get back to you on that before you dive in there, will follow up shortly
Hey @ian - if you use high speed mode the Builder webcomponents won’t be used (high speed mode uses Qwik and not Webcomponents)
Looking at your homepage, it does not appear you published with high speed mode. Did you ensure you followed this doc and made sure to open up any Builder content on your homepage (looks like you have a homepage and an announcement bar in Builder), flipped the option on inside the editor (for each), and then hit publish?
Builder needs to re-generate the code for those two areas of your page. Once done successfully, you should not see the Webcomponents script included on your page anywhere anymore