如何在Liquid中异步或延迟JS? [英] How to async or defer JS in Liquid?

问题描述

我正在尝试提高网站速度，这些脚本可能会延迟渲染的一件事:

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 }}

如何使他们避难或延期?还是我应该简单地将它们移到底部?另外，我尚未对主题进行此类更改.在Shopify中还原更改是否容易?如果将任何脚本用于初始渲染，我只是将其更改为以前的样子，对吗?

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?

这些脚本在HEAD部分.

those scripts are in the HEAD section.

推荐答案

您必须做一些不同的事情.

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>

确保复制/下载主题，以便进行备份.还可以在Shopify商店中进行修订，以便您可以还原.

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

这篇关于如何在Liquid中异步或延迟JS?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！