javascript - How to async or defer JS in Liquid?

Question

I'm trying to improve site speed, and one thing that might be delaying render are these scripts:

  {{ '//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js' | script_tag }}
  {{ 'jGestures.min.js' | asset_url | script_tag }}
  {{ 'modernizr.min.js' | asset_url | script_tag }}

How can they be made to asych or defer? Or should I simply move them to the bottom? Also I have not made changes like this to my theme yet. Is it easy to revert changes in Shopify? I would just change it to the way it was before if any of the scripts were needed for the initial render, correct?

Edit: those scripts are in the HEAD section.

Answer 1

You have to do it little differently.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js" async></script>

<script src="{{ 'jGestures.min.js' | asset_url }}" async></script>

Make sure you copy/download the theme so that you have a backup. also shopify stores revisions so that you can revert back.