下载javascript文件，但不要立即对其进行评估

Download javascript file but not evaluate it immediately?

本文关键字：评估 文件 javascript 下载      更新时间：2023-09-26

我有一个很大的javascript文件要在加载网页时使用。我希望它能尽早下载（下载不会阻塞UI线程），但不会立即评估（在内存中加载它是在UI线程中，并阻塞domcontentcomplete事件，从而阻塞初始页面绘制）。

它将初始化一个XHR来获取额外的数据并更新页面。用户将很早看到静态页面，稍后获取所有数据。如果是在html头中，则初始静态页面显示会延迟。如果是在页面末尾，下载将延迟整个内容的显示。

有没有一种方法可以下载但不解析，直到我稍后启动解析？

如果JS文件对渲染不重要，则可以使用文件的<script>标记上的async或defer属性。使用async基本上将具有与将<script>标签放置在关闭<body>标签之前相同的效果。

<脚本>-MDN

异步

HTML5设置此布尔属性以指示浏览器如果可能的话，应该异步执行脚本。它没有对内联脚本的影响（即，没有src的脚本属性）。

推迟

此布尔属性设置为向浏览器指示脚本将在文档解析后执行。由于该功能尚未在所有其他主流浏览器中实现，因此作者不应认为脚本的执行实际上会延迟。

您也可以使用setTimeout调用。只要<script>没有阻止任何渲染，用setTimeout包装它就会延迟渲染。

var delay = 10 /* or however many ms you want */
setTimeout(function(){
    /* your code goes here */
}, delay)

edit:如果您希望在DomContentLoaded事件之后执行，只需将代码包装在该事件的事件侦听器中即可。

 document.addEventListener("DOMContentLoaded", function(event) {
    /* Your code goes here */
  });
相关文章：