Goo*_*bot 16 html javascript css web
虽然总是建议将JavaScript和CSS代码放入适当的文件中(因为.js
和.css
),但大多数主要网站(如亚马逊,Facebook等)都将其JavaScript和CSS代码的很大一部分直接放在主HTML页面中.
哪里是最好的选择?
Ray*_*nos 15
将.js放在多个文件中,然后打包,缩小并将其压缩到一个文件中.
将HTML保存为多个单独的文件.
将.css放在多个文件中,然后打包,缩小并将其压缩到一个文件中.
然后,您只需将一个css文件和一个js文件发送到要缓存的客户端.
您没有使用HTML内联它们.
如果你内联它们,那么对css 或 html 或 js的任何更改都会强制用户再次下载这三个.
主要网站在其文件中有js&cs的主要原因是因为主要网站代码腐烂.大公司没有坚持标准和最佳实践,他们只是破解它直到它起作用然后说"为什么在我们的网站上浪费钱,它的工作原理不是吗?".
不要看实况网站的例子,因为互联网上99%的例子都显示不良做法.
也为了上帝的爱,请关注分离.你永远不应该在html页面中使用内联javascript或内联css.
http://developer.yahoo.com/performance/rules.html#external
雅虎(即使他们有许多内联样式和脚本),建议将它们外部化.我相信谷歌网页速度曾经(或仍然如此?)也是这样做的.
将它们分开是一件合乎逻辑的事情.将CSS和JS与HTML分开有很多好处.像逻辑代码管理,这些页面的缓存,较低的页面大小(你宁愿一个400kb的缓存资源的200ms请求,或者每个页面上必须下载这些数据的4000ms延迟?),SEO选项(更少废话为当脚本/样式是外部的时候谷歌查看,更容易缩小外部脚本(在线工具等),可以从不同的服务器同步加载它们....
这应该是您在任何网站的主要目标.构成整个网站的所有样式都应该在一个文件中(或每个页面的文件,然后在更新时合并和缩小),javascript也是如此.
在现实世界中(不是为自己做一个项目,为需要结果的客户或利益相关者做一个),唯一一次加载另一个javascript资源或另一个样式表没有意义(因此使用内联样式/ javascript)是否存在某种每用户,每会话或每时间段的动态信息,这些信息无法以任何其他方式完成.示例:当我的网站进行促销时,我们会转储一个带有小JSON信息对象的脚本标记.因为我们不缩小和合并多个文件,所以将它包含在页面中更有意义.当然还有其他方法可以做到这一点,但这样做需要20美元,而另一种方式可能要花费100美元.
也许亚马逊/ Facebook /谷歌等使用如此多的内联代码是因此他们的服务器不会被征税太多.我不太确定在一次命中请求1MB文件或请求10个100KB文件之间的基准测试(例如假设1MB/10 = 100KB),但更快的是什么?可能是1MB文件,但是可以同步加载较小的请求,这意味着这10个请求中的每一个都可能来自单独的服务器/域,从而减少了总体加载时间.
此外,google主页例如似乎为小部件转储JSON信息数组,大概是因为它编译来自各种来源的所有信息,缩小它,缓存它,然后放入页面,然后javascript函数构建布局(客户端处理能力而不是服务器端).