如何解决 JavaScript 的延迟解析？

Question

如何解决以下错误：

在初始页面加载期间解析了 826.9KiB 的 JavaScript。延迟解析 JavaScript 以减少页面渲染的阻塞。

我的 Javascript 代码是：

{foreach $javascript.external as $js}

    <script  type="text/javascript" src="{$js.uri}" {$js.attribute} ></script>

{/foreach}

Answer 1

假设您在 head 标签中添加脚本，您可以通过在结束 body 标签附近而不是在 header 中添加脚本来延迟页面呈现的阻塞。

或者创建一个 IIFE 并在页面呈现后加载脚本

(function() {
  function loadJS() {
    var s = document.createElement('script'),
      getScriptTag = document.getElementsByTagName('script')[0];
    s.type = 'text/javascript';
    s.async = true;
    s.src = 'script location';
    getScriptTag.parentNode.insertBefore(s, x);
  }

  (window.attachEvent) ? window.attachEvent('onload', loadJS): window.addEventListener('load', loadJS, false)
}());