After reading a lot of devdocs, I can see there is a case for deferring in CSS and JS in the manual


However, I can not seem to get this method to work. I'm either placing the files in the wrong location, naming them incorrectly, or just not using the correct syntax as none is provided in the docs.

I've tried placing different methods inside app/design/frontend/theme/name/Magento_Theme/layout/default_head_blocks.xml but I've had no luck, other than removing some of the CSS, as described in


I don't seem to be able to remove any JS via the default_head_blocks.xml nor implement the defer to any CSS or JS. And to be honest, the directions in the docs are confusing and many of the examples, don't include the features. Or the directory structure doesn't exist. My Magento theme files are all inside /vendor/magento/ and not in /app/design/ - I am using a cloned copy of Luma where I changed the registration and other files to be able to use it as a renamed theme, but the XML layout instructions are not very well done.

If anyone knows what syntax to use to defer CSS or JS in the header, it would be greatly appreciated as ever method I've tried seems to have no effect.

  • any luck ? i have same problem.
    – Ashar Riaz
    Commented May 24, 2019 at 10:20

2 Answers 2


For Deferring CSS, use Magento's CSS Critical Path: https://devdocs.magento.com/guides/v2.4/frontend-dev-guide/css-topics/css-critical-path.html


You can defer parse the JS or CSS using the attribute defer

<script src="name.js" defer="defer"></script>
<css src="name.css" defer="defer"/>

Hope it helps you.

  • In the app/design/frontend/theme/name/Magento_Theme/layout/default_head_blocks.xml on 2.2.8, I can't get it to work on CSS or JS, even if I remove first and then try to add back with the defer.
    – dawhoo
    Commented Apr 22, 2019 at 18:52
  • Can you share the code here Commented Apr 23, 2019 at 4:30
  • @RajMohanR have you tested this before ? because in my case it is also not working
    – Ashar Riaz
    Commented May 24, 2019 at 10:22
  • I have tested it for custom css and js files which were not critical. I deferred them and they worked fine for me Commented May 24, 2019 at 10:32
  • If this is not working good for you try this module meetanshi.com/magento-2-defer-parsing-javascript.html Commented May 24, 2019 at 10:37

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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