Tagged: ,

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • December 14, 2021 at 7:16 pm #1332853
    thinkjarvis

    Hi guys,

    This is not a priority issue. But if you have any comments it would be appreciated.

    I am about to experiment with Inlining critical JS scripts in an attempt to improve LCP scores.

    How easy would it be to extact the critical JS for ALB color sections images (The JS that controls .js_active CSS and the fade in animation)
    and
    The critical JS for full width easy sliders (the JS that controls image loading on page load)

    Putting these bits of code in the footer as critical inline scripts could potentially solve this issue.

    December 28, 2021 at 1:54 pm #1334005
    Günter

    Hey Thomas,

    Sorry for the late reply. Hope you had a peacefull christmas time with your family.

    This cannot be solved easily. It would need to hack core js files (and that after each update). And there are also dependencies to be considered (like jQuery) – and logic for file merging also.

    Best regards,
    Günter

    January 4, 2022 at 11:19 am #1334161
    thinkjarvis

    Hi Gunter,

    Thanks for getting back to me.

    I’ll save this for a rainy day. If I have any success I’ll report back. Going to be a while before I can pick it all apart!

    I’ll raise this as an issue after I have done some more testing. No action required at the moment
    The LCP seems to be heavily affected by custom fonts. I need to investigate further before I raise this as an issue. Even with SWAP enabled on fonts, the First element on the page is not fully loading until the fonts have downloaded (looking at the waterfall). I had a site recently where I accidently uploaded a font that after compression was still 500kb WOFF2. The LCP was extremely high. I used Font Forge to bring the size down to about 40kb and the LCP score started passing. Wev vitals is therefore waiting for the font to download and processed before LCP is calculated.

    I was then thinking. Is there an event listener in the JS files delaying things like “DOMContentLoaded” Specifically related to the fade in on the first element or slider titles and captions.

    I’ll have a look when I get the chance. I think it might just be the way Chrome handles Preload of Fonts rather than anything else.

    January 4, 2022 at 11:19 am #1334162
    thinkjarvis

    PS. Happy new year!

    I hope you enjoyed a well deserved break! :)

    January 4, 2022 at 6:03 pm #1334262
    Günter

    Hi Thomas,

    Happy new year to you also.

    Most of the jQuery js code is packed in

    

(function($)
{
......
})( jQuery );

    or

    
$(function() 
{
  // Handler for .ready() called.
});

    see https://api.jquery.com/ready/

    It is certainly possible to execute code before the dom is ready – but this will be special use cases only and cannot be done in general in the framework.
    We have to rely that the dom is complete.

    Best regards,
    Günter

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.