javascript和css加载

javascript和css加载,javascript,css,performance,browser,Javascript,Css,Performance,Browser,我想知道,如果我有6个javascripts包含在一个页面上,4-5个css包含在同一个页面上,那么如果我创建一个或两个文件并将它们全部附加在一起,而不是一堆文件,那么页面加载是否真的会变得最理想 是的。它将以更少的文件获得更好的性能 这其中有几个原因,我相信其他人也会加入进来,因为我不会一一列举 除了文件大小之外,请求中还有开销,例如请求本身、头、cookie(如果已发送)等等。即使在许多缓存场景中,浏览器也会发送一个请求,以查看文件是否已被修改。当然,适当的头/服务器配置可以帮助实现这一点

我想知道,如果我有6个javascripts包含在一个页面上,4-5个css包含在同一个页面上,那么如果我创建一个或两个文件并将它们全部附加在一起,而不是一堆文件,那么页面加载是否真的会变得最理想

是的。它将以更少的文件获得更好的性能

这其中有几个原因,我相信其他人也会加入进来,因为我不会一一列举

  • 除了文件大小之外,请求中还有开销,例如请求本身、头、cookie(如果已发送)等等。即使在许多缓存场景中,浏览器也会发送一个请求,以查看文件是否已被修改。当然,适当的头/服务器配置可以帮助实现这一点

  • 默认情况下,浏览器一次将打开到给定域的有限数量的同时连接。我相信IE有2个,firefox有4个(我可能弄错了数字)。不管怎么说,关键是,如果你有10个图像,5个js文件和2个css文件,那就是17个需要下载的项目,并且只有少数项目会同时完成,其余的只是排队


  • 我知道这些都是模糊和简单的解释,但我希望它能让你走上正轨。

    你的目标之一是减少http请求,所以是的。名为yslow的工具可以对应用程序进行分级,以帮助您了解如何获得更好的用户体验


    每个include都是用户浏览器必须发出的一个单独的HTTP请求,HTTP请求带来的开销(在服务器和连接上)。组合多个CSS和JavaScript文件将使您和您的用户更轻松


    这也可以通过一种称为CSS sprites的技术对图像进行处理。

    是的。这样做可以减少HTTP请求。

    最好的解决方案是将所有代码添加到一个页面中,这样浏览器就可以在一个GET请求中获取代码。如果要链接到多个文件,则每次加载页面时,浏览器都必须请求这些外部页面

    如果在浏览器中启用了Pieplinging,并且站点没有产生太多流量,则这可能不会导致问题


    谷歌已经将他们的代码简化为一体。我甚至无法想象有多少请求通过如此大的流量节省并减轻了服务器的负载。

    我对影响服务器负载的因素不是很了解,然而,我认为最好的办法是在拥有一大块代码和将脚本组织成有意义的单独文件之间找到平衡。我不认为拥有五个左右不同的文件会对性能产生太大的影响


    一个更具影响力的因素是脚本的压缩,有各种各样的在线实用程序,它们去掉了空白,使用了更有效的变量名,我认为,与将文件放在一起相比,这些将带来更显著的改进。

    即使browse执行多个请求,它也会尝试打开最少数量的TCP连接(请参阅Keep Alive HTTP header option docs)。在服务器端设置向上压缩(DEFLATE或GZIP)模式也可以提高网页加载速度。

    正如其他人所说,是的,可以包含的文件越少越好


    我强烈建议缩小和合并多个CSS/JS文件。如果你像我一样,经常会得到10-15个样式表(重置、屏幕、打印、主页、关于、产品、搜索等),那么这个工具非常有帮助。

    不再有任何理由在一方面为了组织而想要对js&css文件进行分区,另一方面为了效率而想要很少的文件之间感到纠结。有一些工具可以让您同时实现这两个目标


    例如,您可以在构建过程中合并(并压缩)CSS和JavaScript资产。Java开发人员应该看看,这是最先进的技术。

    +1。Keep alives将减少在现代web服务器上使用单独文件的延迟。连接脚本/工作表仍然有好处,但不会太大。mod_deflate在这两种情况下都是值得启用的。请记住,YSlow的大多数建议都是针对大型网站的,比如,嗯。。。如果你在使用PHP或其他脚本语言的服务器上,你通常可以通过脚本语言连接Javascript和CSS(同时缩小它)。出于上面列出的原因,这对于生产环境是个好主意。这实际上不适用于移动浏览器和大文件大小(由于附加了它们)。IIRC在iPhone上有缓存限制。大于25kB的文件将不会被缓存。因此,在移动设备上,有时最好使用更小但可能更多的文件。(好的,今天iOS 4的限制是100kB,但这个论点仍然成立。)