将CSS和JavaScript放在文件或主HTML中?

前端之家收集整理的这篇文章主要介绍了将CSS和JavaScript放在文件或主HTML中?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
虽然总是建议将JavaScript和CSS代码放入适当的文件(如.js和.css)中,但大多数主要网站(如Amazon,Facebook等)将JavaScript和CSS代码的很大一部分直接放在主HTML页面.

哪里最好的选择?

解决方法

http://developer.yahoo.com/performance/rules.html#external

雅虎(即使他们有很多内联样式和脚本),建议将其设为外部.我相信谷歌页面的速度用于(或仍然吗?)做同样的事情.

把它们分开是一件合乎逻辑的事情.保持CSS和JS分离到HTML有如此多的好处.像逻辑代码管理,这些页面的缓存,较小的页面大小(你宁愿为一个400kb的缓存资源请求一个约200ms的缓存,还有每个页面上不得不下载4000ms的延迟?),SEO选项当脚本/样式是外部的时候,谷歌来看看),更容易的缩小外部脚本(在线工具等),可以从不同的服务器同步加载它们….

这应该是您在任何网站的主要目标.组成整个网站的所有样式应该在一个文件(或每个页面文件,然后在更新时合并和缩小),与javascript相同.

在现实世界中(没有为自己做一个项目,为一个客户端或需要结果的利益相关者做一个项目),只有加载另一个javascript资源或其他样式表(并因此使用内联样式/ javascript)是否有某种动态信息是一种每用户,每会话或每个时间段,无法以任何其他方式完成.示例:当我的网站有一个促销,我们转储一个脚本标签与一个小的JSON对象的信息.因为我们不会缩小和合并多个文件,所以只需将其包含在页面中就更有意义了.当然还有其他的方法可以做到这一点,但花费20美元来做到这一点. $100做另一种方式.

也许亚马逊/ Facebook / Google等使用这么多的内联代码,所以他们的服务器没有这么多税.我不太确定在一次命中请求1MB文件或请求10个100KB文件(假设1MB / 10 = 100KB为例),但是会更快?潜在的1MB文件,但是较小的请求可以同步加载,这意味着这10个请求中的每一个可能来自一个单独的服务器/域可能,从而减少总体负载时间.

此外,谷歌主页似乎似乎转储了一个JSON数组的小部件的信息,大概是因为它编译来自各种来源的所有信息,将其细化,缓存它,然后放入页面,然后javascript函数构建布局(客户端处理能力而不是服务器端).

猜你在找的CSS相关文章