JavaScript 性能：对于大量不变的数据，使用对象变量还是 AJAX 请求更好？

Question

所以我有大量数据，格式为 JavaScript 对象，我的网站需要访问这些数据。因为这些数据不会被更新，所以我有两个选择：创建一个 JavaScript 文件并将数据作为变量粘贴。或者，我可以将数据上传为 JSON 文件，然后使用 Ajax 请求获取数据并将其解析为对象。

这里有一些代码来说明我的意思。

选项1（将数据作为JS对象变量保存在单独的JS文件中）：

文件object.js

let myData = {
    "1": "A",
    "2": "B",
    "3": "C",
    "4": "D",
    "5": "etc..."
};

...等等，除了我的数据非常大，所以这个文件最终有 25,000+ 行。

我在一些script.js

中使用了这样的变量

let myVar5 = myData["5"];

---

选项 2（将数据保存为 JSON，执行 Ajax 魔术，并解析为 JS 对象）

文件object.json

{
    "1": "A",
    "2": "B",
    "3": "C",
    "4": "D",
    "5": "etc..."
}

然后在我的 script.js 我这样做：

let url = "/data/object.json";
$.getJSON(url, function(response) {
    let data = JSON.parse(response);
    let myVar5 = data["5"]
}

在内存、速度、存储和其他互联网网站的实用性方面，哪个选项的性能更好？

Answer 1

就内存而言，哪个选项会有更好的性能...

JSON 变体短 7 个字节

...速度，...

如果您第一次不需要 JSON 来渲染页面，那么之后从 JSON 文件加载它会更好，因为它会在页面渲染后加载，而且解析 JSON 可能会更快，因为 JS 更多复杂到快速（但可能是在谈论纳秒）。

...存储，...

不确定这与记忆​​有何不同。也许这两个文件都被缓存了，也许不是，这取决于浏览器等。

...以及其他适用于互联网网站的实用资料？

我不会使用硬编码变体，因为我的 IDE 会尝试解析文件以提示我其类型和属性，这会减慢我的开发过程。它不解析外部加载的文件。