为什么javascript导入需要这么长时间？

我正在从网站前端自己的目录导入一个JSON文件。用户单击按钮后，将在浏览器中执行以下代码：

const file = await import('./path-to-file')

该文件非常小，只有4KB。然而，使用

console.time（）

显示执行此命令大约需要300毫秒。我已经检查了自己的网络速度，达到74Mb/s。我正在使用Netlify部署该网站，Bitcatcha说该服务器“速度非常快”，响应时间为133ms。我不确定响应时间到底是如何适应这一切的——但总而言之，仅传输4KB数据的300ms似乎长得离谱

为什么要花这么长时间，可以做些什么来加快速度？

尝试一下：

const file = await require("./path-to-file"); //instead of import();

我认为由于使用了await，所以需要花费很长时间，因此如果上述操作不起作用，请尝试删除await，因为await所做的是停止异步函数执行，直到require（）已解决。如果在获取文件内容时代码继续运行，则总时间应该会缩短。 如果上述方法均无效，请尝试以下方法：

const fs = require("fs");
fs.readFile("./path-to-file","utf-8",(err,d)=>{
    d = JSON.parse(d);
    //Then you do whatever you wanted to do with the file here
});

---

这是来自浏览器还是服务器端的js

我假设浏览器是从上下文开始的，它之所以这么慢是因为它喜欢它的状态，等待文件加载。被接受的答案确实使它更快，但问题是json文件不能保证在那行代码之后被处理

异步代码在js和其他语言中是一件大事，因此我建议进一步研究，但这里有一些示例：

假设这是json文件1

{
  count: 2
}

这是js文件

const data=import（“json路径”）；
//它立即转到下一个代码
console.log（data.count）；
//=>未定义或错误，因为它尚未完成解析

如果您希望访问它，您必须使用

。然后

或

等待

let数据；
导入（“json路径”）。然后（d=>{
数据=d；
//现在你可以使用数据了
console.log（data.count）
// => 2
});
//它仍然继续下一个代码
//所以你仍然不能在这里使用数据
console.log（data.count）
//=>未定义或错误

它最终会加载数据吗？具体的上下文是什么？这是加载到您服务器上的节点还是通过网络加载到浏览器？@Argee它最终加载，一切正常，只是速度问题。@尖头我编辑了问题，让它更清楚-一切都在前端。好的，您可以从浏览器配置和网络工具中获得大量信息。显著改进！我改为require并删除wait，现在只需0.5毫秒即可加载。非常感谢。