Http页面缓存机制.docVIP

改善 Web 2.0 应用程序的性能 探秘不同的浏览器端缓存机制 Jian Qiao Sun, 软件工程师, IBM Hua Pin Shen, 顾问软件工程师, IBM 简介：?随着 Web 2.0 应用程序的出现和流行，人们使用 Internet 的方式已经悄然改变。现在，这些 Web 2.0 应用程序拥有许多典型的特征，包括拥有富客户端、大页面、包含许多小项目的页面、大量的 JavaScript 编码等等。鉴于目前的浏览器技术，大部分这些特征都会导致浏览器端性能问题，特别是在长距离网络中。本文将分析典型 Web 2.0 应用程序的关键方面，并介绍它们如何影响浏览器端性能。本文还将检查浏览器端性能的一个非常重要的部分 —— 浏览器端缓存。 发布日期：?2010 年 2 月 25 日?级别：?中级?其他语言版本：?英文 ?平均分 （共 2 个评分 ） 简介 随着 Web 2.0 应用程序的出现和流行，Internet 的使用方式已经发生改变，出现了一种新趋势：针对内容管理、信息共享、通信、团队合作等创建一种更加以用户为中心的方法。从技术角度看，Web 2.0 应用程序并没有带来很多新的技术突破。但是，这些应用程序的确带来了一种新的 Internet 使用模式。现在，Web 2.0 应用程序拥有许多典型特征，包括拥有富客户端、大页面、包含许多小项目的页面、大量的 JavaScript 编码等等。这些特征会导致浏览器端性能问题，特别是在长距离网络中。这些性能问题会对用户体验造成不利影响，但您甚至不会意识到这些问题的存在。由于开发人员拥有很好的网络条件，因此这些性能问题很难完全暴露出来。 本文将首先分析典型的 Web 2.0 应用程序的关键方面，解释它们如何影响浏览器端性能。然后，本文介绍浏览器端性能的一个非常重要的部分 —— 浏览器缓存。通过使用适当的缓存设置，您可以向用户提供较好的应用程序体验。如果您没有一个整体缓存策略设计，那么您的缓存策略不仅会导致低劣的性能，还会引发一些功能缺陷。 有许多影响浏览器缓存的规则，其中的部分规则包括 Cache-Control、Etag、Expires、Last-Modified 和 Vary。所有这些设置拥有不同的含义和最适用的情形。困难之处在于对于相同的设置，并不是所有流行浏览器都拥有相同的行为。因此，在您决定使用这些设置之前，您应该准确了解这些浏览器是如何工作的。本文将检查目前市面上最流行的浏览器的行为：Internet Explorer、Firefox、Chrome 和 Safari。 在本文中，我们还使用 IBM? Mashups 和开源 “Roller Weblogger” 来提供一些示例，展示如何应用不同的指令以最好地使用浏览器缓存。 背景 在当今的 Internet 环境中，Web 2.0 应用程序正在变得越来越流行。许多 Web 站点都使用 Web 2.0 构建，比如 Facebook、Youtube 等。IBM 也有 Web 2.0 应用程序，比如 Lotus Connections 和 Lotus Mashups。 以下是一种用于计算浏览器响应时间的基本方法： 浏览器响应时间 服务器端时间 + 页面加载时间 + 浏览器呈现时间 页面加载时间 （请求数 / 并发数）* 延迟时间 + 页面总大小 / 带宽 在上述等式中： “服务器端时间” 是指服务器端处理所花费的时间，比如通过 LDAP 验证和从数据库检索信息。 “浏览器呈现时间” 是指浏览器呈现页面所花费的时间，包括执行 JavaScript 和解析 DOM 树的时间。 “请求数” 是指 HTTP 请求的数量。 “并发数” 是指浏览器与服务器之间的并行连接的数量。 “页面总大小” 是指一个页面的完整大小。 “延迟时间” 和 “带宽” 是网络状态指标。在常见的长距离网络环境中，带宽大约为 1M，延迟时间大约为 100 毫秒。因此，减少到 100KB 或减少为一个请求能够节约 0.1 秒响应时间。 请注意一点，鉴于真实环境的复杂性，这个等式可能不能涵盖所有情形。 在一个典型的 Web 2.0 富 Internet 应用程序（例如 Lotus Mashup Maker）中，浏览器首先发送格式定义请求到服务器。接收到定义响应数据后，浏览器向服务器发送数据请求。然后，浏览器对用户呈现页面。在这种模式中，有大量的小项目请求，比如 JavaScript 文件、CSS 文件等。在长距离网络环境中，这会导致严重影响用户体验的客户端性能问题。大多数文件是可以被缓存的静态文件，因此，如果您添加适当的缓存控件、expiry 头部以及其他影响浏览器缓存的头部元数据，就可以明显改善用户体验。 浏览器缓存机制 有几个影响浏览器缓存的规则，这