在静态网站中加载数据时增加网站加载时间

时间:2018-08-07 17:23:39

标签: javascript html performance

我在静态网站的某个部分中有一个包含赞助商数据的表。目前,我将数据保存在一个json文件中,并在网站加载时使用javascript创建表,该js文件包含在html页面的末尾。所以页面的伪代码就像

<body>
    ...
    <section id="sponsors"></section>
    ...
    <script src="sponsors.js"></script>
</body>

sponsors.js使用sponsors.json$.get()加载数据,然后使用该数据创建表。

我的问题是,以下哪种方法会增加网站加载时间?

  1. 使用上述方法将数据保存在单独的json文件中。
  2. 将数据保留在sponsors.js中,而不是保存在单独的json文件中
  3. 用单个数据硬编码表
  4. 上面没有列出的其他方法吗?

3 个答案:

答案 0 :(得分:0)

那么,就性能而言,最好的方法始终是涉及尽可能少的文件。

内联JSON当然对于性能而言是最好的,但是随后却牺牲了代码的可读性和模块化性。您将不得不通过权衡编程的易用性和性能来对最佳解决方案进行判断。

我个人会坚持使用您所得到的东西,因为以后更改JSON根本不会很复杂-而且您要承受的性能下降也不会很明显,更不会破坏游戏。

答案 1 :(得分:0)

3是最快的方法,因为不需要渲染数据,但是硬编码不是很有用。

2稍快一些,因为不需要单独的请求。

1是最慢的,但是如果将json缓存在cookie中,则不必每次都下载。通过在cookie上使用到期,将触发它再次被下载。

答案 2 :(得分:0)

将数据保留在外部JSON中会增加加载表的时间,但会减少加载页面本身所需的时间。 取而代之的是,对表进行硬编码将立即加载该表,但也会增加加载页面的时间。