这两种加载javascript文件的优缺点?

时间:2009-06-18 17:45:50

标签: javascript dom

A:

<script type="text/javascript" src="b1.js"></script>
<script type="text/javascript" src="b2.js"></script>
<script type="text/javascript" src="b3.js"></script>
<script type="text/javascript" src="b4.js"></script>

B: 将b1~b4中的所有内容放入另一个文件t.js

<script type="text/javascript" src="t.js"></script>

假设b1~b4的大小均为200 KB

那些b?.js文件已被压缩。

5 个答案:

答案 0 :(得分:2)

连接它们并将它们通过缩小器(最好是YUI Compressor),然后确保在服务器上启用了gzipping。

我的经验是文件大小下降了大约40%到50%。

较少的HTTP请求总是很好,如果它们全部在一起,你会获得更好的gzip结果。从长远来看,它将带来更好的客户端性能。

此外,弄清楚为什么你的JavaScript如此之大!

答案 1 :(得分:2)

检查多个JS文件请求与单个文件请求的费用的好方法是通过 http://tools.pingdom.com/fpt/?url=www.yourdomain.com/两种方式运行您的页面。它显示了连接时间以及响应和数据传输时间的成本。

答案 2 :(得分:1)

HTTP请求开销和连接。通常值得合并 - 我们在构建脚本中执行它,以便我们可以单独开发它们。

答案 3 :(得分:1)

部署单独的JavaScript文件并将用户的浏览器拼接在一起就像部署单独的目标文件并让用户的加载器将它们链接到可执行文件中。

如果用户的浏览器已经缓存了一个(但不是全部)JavaScript组件脚本,那么很有可能让您可以单独呈现它们。如果您使用的是用户可能在访问其他网站时加载的受欢迎的Google或Yahoo服务的JavaScript库组件,那么单独展示这些组件将节省用户时间和带宽。

如果脚本对您的网站来说都是独一无二的,并且您将它们全部部署在多个页面上,那么最好将它们组合并缩小为构建过程的一部分,就像桌面应用程序将对象和库文件作为其一部分组合一样建立过程。

答案 4 :(得分:1)

如果您使用的是Java平台,请尝试使用JAWR(https://jawr.dev.java.net/)。 它以简单明了的方式解决了平凡的前端调整问题。