While working on a custom DXA module, I figured out I am unable to use the DXA loaded jquery library, as my module UI loads at top, but jquery is declared at bottom of the page.

Shouldn't it be in <head> so that custom modules can leverage it, instead of loading additional library, also wanted to leverage Magnific Popup library used by DXA.

Is there some reason for it?

1 Answer 1


Following the answer on https://stackoverflow.com/questions/10994335/javascript-head-body-or-jquery it is considered a best practice to not load jquery in the head, as it is too large and blocks parallel downloads.

Furthermore, DXA uses Bootstrap for its HTML design and that also suggests to load the jQuery script at the end of the <body> tag, see http://getbootstrap.com/getting-started/#template

Now if you have a compelling reason to load jQuery earlier, then you can simply modify the HTML design as described here https://github.com/sdl/dxa-html-design/tree/master/design and here http://docs.sdl.com/LiveContent/content/en-US/SDL%20DXA-v5/GUID-830042CD-4BAD-4A4B-BB82-4C713D7C4D51

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.