【发布时间】：2011-01-22 12:05:34
【问题描述】：
可以对网站进行哪些重要的优化以减少加载时间？
【问题讨论】：
-
我一直以来的最爱alistapart.com/articles/sprites
标签： php javascript html css optimization
【发布时间】：2011-01-22 12:05:34
【问题描述】：
消除/最小化服务器端的任何瓶颈。为此，请使用 Xdebug 或 Zend Debugger 之类的分析器来找出您的应用程序在哪里执行昂贵且缓慢的操作。尽可能实施缓存。使用操作码缓存。如果这仍然不够快，请考虑投资更多 CPU、RAM 或 SSD（取决于您是否受 CPU、IO 或内存限制）
对于一般的服务器/客户端优化，请参阅 Yahoo YSlow! User Guide。
基本上总结为：
- 最小化 HTTP 请求
- 使用内容交付网络
- 添加过期或缓存控制标头
- Gzip 组件
- 将样式表放在顶部
- 将脚本放在底部
- 避免使用 CSS 表达式
- 使 JavaScript 和 CSS 外部化
- 减少 DNS 查找
- 缩小 JavaScript 和 CSS
- 避免重定向
- 删除重复的脚本
- 配置 ETag
- 使 AJAX 可缓存
- 将 GET 用于 AJAX 请求
- 减少 DOM 元素的数量
- 没有 404s
- 减小 Cookie 大小
- 为组件使用无 Cookie 域
- 避免使用过滤器
- 不要在 HTML 中缩放图像
- 使 favicon.ico 小且可缓存
另请参阅下方贡献的 cmets，因为它们包含一些对其他用户有用的额外信息。
【讨论】：
-
还可以查看 Google 的 PageSpeed code.google.com/speed/page-speed，它是 YSlow 的一个很好的替代/补充，也是一个 Firebug 插件。它捕获了一些 YSlow 没有捕获的东西，反之亦然。
-
还有一件事：如果您控制了足够多的服务器来安装额外的插件并拥有足够的 RAM，请使用内存会话。 memcache 插件包括一个会话处理程序。 php.net/memcache
-
好答案。在这篇（优秀的）雅虎文章中更详细地解释了所有这些事情：developer.yahoo.com/performance/rules.html
-
Google Speed Tracer 是另一个很好用的工具，它是一个 Chrome 扩展程序，可以衡量网站性能的许多不同方面：code.google.com/webtoolkit/speedtracer
肯定想看看缓存，因为往返 DB 的成本很高。 另外，缩小JS
【讨论】：
这里有一些“最佳实践”：
- 缓存 CSS、JavaScript、图像等
- 缩小 Javascript 文件。
- gzip 内容。
- 尽可能将指向 JavaScript 文件、JavaScript 代码和指向 CSS 文件的链接放在页面底部。
- 仅加载必要的内容。
- 对于现有网站，在您执行任何这些操作之前，请使用 Firebug 等工具确定您的瓶颈在哪里，正如其他人提到的 YSlow（我强烈推荐此工具）。
【讨论】：
安装 firebug 和 pagespeed 插件 遵循所有 pagespeed 指令（直到可能）并感到高兴 http://code.google.com/intl/it/speed/page-speed/
无论如何，根据我的经验，最重要的优化是将 HTTP 请求的数量减少到最少......
【讨论】：
我能想到的简单选项是：
- Gzip (x)html，因此压缩文件应该更快地到达用户手中
- 缩小 CSS
- 缩小 JS
- 尽可能使用缓存
- 使用内容交付网络
- 使用诸如yslow 之类的工具来识别瓶颈并提出进一步的建议
【讨论】：
在优化时，您可以关注两个方面：
- 服务器端：重要的是更快地生成输出
- 客户端：重要的是让所有必须更快地显示出来。
注意：作为开发人员，我们通常会首先考虑优化服务器端...在大多数情况下，这仅占页面加载时间的不到 10%！
在服务器端，您通常希望：
- 配置文件，以确定什么是长的
- 优化您的 SQL 查询，并减少它们的数量
- 使用缓存
更多信息，你可以看看我前段时间给这个问题的答案：Optimizing Kohana-based Websites for Speed and Scalability
在客户端，通常通过以下方式获得最大收益：
- 减少 HTTP 请求的数量 - 减少 JS/CSS/images 文件数量的最简单方法是将多个文件合并为一个
- 压缩 CSS/JS/HTML，例如使用 Apache 的
mod_deflate。
关于这一点，Yahoo's Exceptional Performance 上有很多很棒的东西：他们发布了很多good pratices 和工具，例如yslow。
【讨论】：
我们最近在我们的网站上这样做了。在这里，我们概述了似乎影响最大、难度最小的九种技术：http://mentormate.com/blog/easy-ways-speed-website-load-time/
【讨论】：
第一个优化是：判断是否慢，如果不慢，不要打扰。
这比听起来要复杂，因为它不像测试桌面应用或游戏。如果在目标硬件上玩游戏时，帧速率太低，则游戏会很慢。这很容易衡量。
网站比较棘手，因为作为开发人员，您可能正在使用具有非常快速网络的本地测试系统。即使您使用登台/系统测试服务器，您也可能仍在本地网络上。甚至您的生产服务器也很可能在同一个大陆上。
对于您的很多用户来说，情况可能并非如此。
因此存在的选项是：
- 通过询问您的用户来了解他们是否觉得它很慢
- 模拟高延迟环境并自己（或您的 QA 团队）进行测试
- 猜测
不推荐后者。
一个比你更神圣的雅虎网站性能书（是的，这是一本你可以购买的书）没有提到很多的选项是 HTTPS。大多数处理重要数据的 Web 应用程序主要或完全通过 HTTPS 运行，这极大地改变了游戏规则。请记住在启用它的情况下进行所有测试。
【讨论】：
我写了一些关于，见：
【讨论】：
如前所述，您可以使用 Yslow 或 PageSpeed firefox 扩展。但您也可以使用GTmetrix，这是一种使用这两种工具扫描您的页面的在线服务。
我喜欢/使用的功能：
- 柔和、干净和可用的演示文稿
- 与另一页比较。看看你的朋友/竞争对手在哪里真的很有趣。
（顺便说一句，我和gtmetrix没有关系！）
【讨论】：
为了减少网络流量，您可以压缩静态文件，例如 CSS 和 Javascript，并对生成的内容使用 gzip 压缩。您也可以尝试使用 optipng 等工具来减小图像的大小。
但是，要采取的第一步是实际分析一直占用的时间 - 无论是通过网络发送比特，还是实际生成要发送的内容。如果生成每个 HTML 页面需要一分钟，那么将 CSS 文件缩小 10% 是没有意义的。
【讨论】：
不要在代码中使用空格。
【讨论】：
负载平衡将有助于大大减少加载时间。
【讨论】：
-
不，几乎在所有情况下都不会。