减少网站呈现页面所需的带宽量,最有效的方法是什么?

积极缓存?缩小JS / CSS? Gzip? CMS?精灵?

评论

重复的问题得到重复的答案:webmasters.stackexchange.com/questions/569/…

首先是这个问题,所以另一个是重复的

#1 楼

可以在任何网站上轻松实现的一些基本方法:


如果发出请求的浏览器支持,请使用deflategzip压缩HTML,CSS和Javascript。使用Google Closure编译器

使用YUI Compressor最小化CSS


更多相关内容:或图片不太可能更改,请告诉浏览器对其进行缓存。大多数Web服务器已经对静态文件执行了此操作,因此您需要做的就是将其添加到动态脚本中。
自动将CSS和JS文件合并为一个文件。这是有利的,因为它减少了HTTP请求(具有开销和某些愚蠢的浏览器-我的意思是Internet Explorer-默认每个域一次限制2个请求)。
移动静态文件(CSS, JS,图片等)转换为单独的域名。这将导致Cookie信息无法在HTTP请求中发送。

使用自动生成的Sprite。子画面是包含多个图标或其他小图像的单个图像。然后选择要使用CSS background属性显示的图像。示例。

优点是客户端发出的HTTP请求更少(有开销)。手动操作,那绝对不值得,这使代码维护成为一场噩梦。通常自动执行意味着编写一个自定义脚本,这就是为什么它“很少参与”的原因,

评论


我打算回答,但我想您已经涵盖了所有问题:)

– Echo说恢复莫妮卡
2010年7月8日23:47

开销确实是要考虑的重要事项,对于小文件,它们可以代表所传输数据的良好比例。

–HoLyVieR
2010年7月8日23:48

除非还仔细检查用户代理,否则不要使用deflate,因为Internet Explorer中存在有关deflate的错误。

–删除
2010年7月9日,0:20

@Kinopiko:是的,很好的建议。请参阅我关于堆栈溢出的问题。

–托马斯·博尼尼(Thomas Bonini)
2010年7月9日,0:28



#2 楼

Google已概述并解释了他们的建议,以最大程度地减少有效载荷大小。它们包括以下技术:


启用压缩
删除未使用的CSS
最小化JavaScript
最小化CSS
最小化HTML
推迟加载JavaScript
优化图像
提供缩放图像
从一致的URL提供资源

这些建议是其开源Firefox / Firebug附加组件的一部分项目称为Page Speed。与Yahoo!的YSlow插件类似。实际的Page Speed加载项将检查比该列表详细说明的更多优化。还提供了有关使用页面速度的说明。 HTTP请求
使用内容传递网络
添加过期或缓存控制标头
Gzip组件
在顶部放置样式表
在底部放置脚本
/>避免CSS表达式
使JavaScript和CSS外部化(<!建议已实施。