javascript - 使 Javascript 非阻塞

Question

以非阻塞方式渲染 Javascript 有哪些不同的方法(效率方面的比较)？。我听说过可以与 script 标签一起使用的 defer 属性。还有其他这样的方法吗？如果有，那么它们相对于 defer 有什么优势？

Answer 1

I've heard about the defer attribute that can be used with the script tag.

是的，defer and async使脚本(可能)在初始解析/呈现期间不同步运行。

Are there other such methods...

是的，如果您在 JavaScript 中创建一个 script 元素并将其附加到 DOM，那也不会阻止页面解析/呈现。例如:

<script>
(function() {
    var script = document.createElement('script');
    script.src = "/path/to/your/async/script.js";
    document.getElementsByTagName('script')[0].parentNode.appendChild(script);
})();
</script>

...and if there are then what are their advantages over defer?

defer 和 async aren't universally supported和一些浏览器 have some quirks around them .特别是，IE < 9 可能会乱序执行 defer 脚本，而 defer 脚本应该按顺序处理(只是不在解析/渲染期间)页面)。如果您自己添加 script 元素，您可以 Hook 它们的 load 事件，然后加载下一个脚本(或使用 RequireJS 之类的东西来执行此操作 - 等等 - - 为你)。除此之外，不多。