Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • MB 273 posts 936 karma points
    Feb 08, 2017 @ 09:33
    MB
    1

    Prioritize javascript loadorder

    Hey guys,

    I'm trying to get rid of the

    Eliminate render-blocking JavaScript

    From Google PageSpeed. I have moved most of my Javascript in the bottom of the site but doing that makes plugins like UmbracoForm throw an error:

    Uncaught ReferenceError: jQuery is not defined

    Is it possible to force UmbracoForm to load AFTER my jQuery in the bottom of the page?

  • Jason Elkin 38 posts 351 karma points MVP 3x c-trib
    Feb 08, 2017 @ 10:18
    Jason Elkin
    1

    OK, this part of PageSpeed really annoys me

    -- begin rant ---

    Google is actually very unhelpful here, as soon as PageSpeed detects Render blocking JS it gets cross and lowers your score - but here's the rub...

    Sometimes you genuinely need render blocking JS.

    Umbraco Forms is the perfect example. What happens if you render the form without the JS? It doesn't work.

    Should we be serving content that doesn't work to a user? No.

    So in this case the easiest solution is to load the JS first and block the rendering until it is ready to go - yes it's slightly slower, but the overall user experience is better.

    --- end rant ---

    The short answer to your question is no. Umbraco Forms, needs jQuery before it renders.

    See new answer below.

    You could implement your own form, using surface controllers, and then you would be in complete control of the JS and rendering.

  • Alex Skrypnyk 6163 posts 24143 karma points MVP 8x admin c-trib
    Feb 08, 2017 @ 10:24
    Alex Skrypnyk
    1

    Hi Mike and Jason

    I think that forms should work without js, it supported by native html, I think that the problem is with validation and ajax sending, but all this code can be placed at the bottom of the page.

    I had the same problems all the time when we have Umbraco Form on the home page of the site, and this is pretty annoying, and there is no perfect solution - we need to change Umbraco Forms or Google :)

    Thanks,

    Alex

  • Jason Elkin 38 posts 351 karma points MVP 3x c-trib
    Mar 07, 2017 @ 09:39
    Jason Elkin
    1

    Hi Alex,

    In newer versions of Umbraco forms if jQuery and Unobtrsuive Validation aren't detected, a big red error message is dispayed in the page.

    Jas

  • Jason Elkin 38 posts 351 karma points MVP 3x c-trib
    Mar 07, 2017 @ 09:33
    Jason Elkin
    1

    Hi Mike,

    It can be done, and relatively easily!

    I've just had to implement the solution below in a new site and it works a treat.

    https://our.umbraco.org/documentation/products/umbracoforms/developer/rendering-scripts/

    Really not sure how I didn't find this last time I looked!

  • Alex Skrypnyk 6163 posts 24143 karma points MVP 8x admin c-trib
    Mar 07, 2017 @ 16:21
    Alex Skrypnyk
    0

    Hi Jas

    Thank you very much for your finding! It works great.

    /Alex

Please Sign in or register to post replies

Write your reply to:

Draft