欢迎来到天天文库
浏览记录
ID:58855027
大小:360.00 KB
页数:10页
时间:2020-09-23
《改善Web20应用程序的性能.doc》由会员上传分享,免费在线阅读,更多相关内容在教育资源-天天文库。
1、简介: 随着Web2.0应用程序的出现和流行,人们使用Internet的方式已经悄然改变。现在,这些Web2.0应用程序拥有许多典型的特征,包括拥有富客户端、大页面、包含许多小项目的页面、大量的JavaScript编码等等。鉴于目前的浏览器技术,大部分这些特征都会导致浏览器端性能问题,特别是在长距离网络中。本文将分析典型Web2.0应用程序的关键方面,并介绍它们如何影响浏览器端性能。本文还将检查浏览器端性能的一个非常重要的部分——浏览器端缓存。简介随着Web2.0应用程序的出现和流行,Internet的使用方式已经发生改变,出现了一种新趋势:针对内容
2、管理、信息共享、通信、团队合作等创建一种更加以用户为中心的方法。从技术角度看,Web2.0应用程序并没有带来很多新的技术突破。但是,这些应用程序的确带来了一种新的Internet使用模式。现在,Web2.0应用程序拥有许多典型特征,包括拥有富客户端、大页面、包含许多小项目的页面、大量的JavaScript编码等等。这些特征会导致浏览器端性能问题,特别是在长距离网络中。这些性能问题会对用户体验造成不利影响,但您甚至不会意识到这些问题的存在。由于开发人员拥有很好的网络条件,因此这些性能问题很难完全暴露出来。本文将首先分析典型的Web2.0应用程序的关键方
3、面,解释它们如何影响浏览器端性能。然后,本文介绍浏览器端性能的一个非常重要的部分——浏览器缓存。通过使用适当的缓存设置,您可以向用户提供较好的应用程序体验。如果您没有一个整体缓存策略设计,那么您的缓存策略不仅会导致低劣的性能,还会引发一些功能缺陷。有许多影响浏览器缓存的规则,其中的部分规则包括Cache-Control、Etag、Expires、Last-Modified和Vary。所有这些设置拥有不同的含义和最适用的情形。困难之处在于对于相同的设置,并不是所有流行浏览器都拥有相同的行为。因此,在您决定使用这些设置之前,您应该准确了解这些浏览器是如何
4、工作的。本文将检查目前市面上最流行的浏览器的行为:InternetExplorer、Firefox、Chrome和Safari。在本文中,我们还使用IBM®Mashups和开源“RollerWeblogger”来提供一些示例,展示如何应用不同的指令以最好地使用浏览器缓存。背景在当今的Internet环境中,Web2.0应用程序正在变得越来越流行。许多Web站点都使用Web2.0构建,比如Facebook、Youtube等。IBM也有Web2.0应用程序,比如LotusConnections和LotusMashups。以下是一种用于计算浏览器响应时间的
5、基本方法:·浏览器响应时间=服务器端时间+页面加载时间+浏览器呈现时间·页面加载时间=(请求数/并发数)*延迟时间+页面总大小/带宽在上述等式中:·“服务器端时间”是指服务器端处理所花费的时间,比如通过LDAP验证和从数据库检索信息。·“浏览器呈现时间”是指浏览器呈现页面所花费的时间,包括执行JavaScript和解析DOM树的时间。·“请求数”是指HTTP请求的数量。·“并发数”是指浏览器与服务器之间的并行连接的数量。·“页面总大小”是指一个页面的完整大小。·“延迟时间”和“带宽”是网络状态指标。在常见的长距离网络环境中,带宽大约为1M,延迟时间大
6、约为100毫秒。因此,减少到100KB或减少为一个请求能够节约0.1秒响应时间。请注意一点,鉴于真实环境的复杂性,这个等式可能不能涵盖所有情形。在一个典型的Web2.0富Internet应用程序(例如LotusMashupMaker)中,浏览器首先发送格式定义请求到服务器。接收到定义响应数据后,浏览器向服务器发送数据请求。然后,浏览器对用户呈现页面。在这种模式中,有大量的小项目请求,比如JavaScript文件、CSS文件等。在长距离网络环境中,这会导致严重影响用户体验的客户端性能问题。大多数文件是可以被缓存的静态文件,因此,如果您添加适当的缓存控件
7、、expiry头部以及其他影响浏览器缓存的头部元数据,就可以明显改善用户体验。浏览器缓存机制有几个影响浏览器缓存的规则,这个小节将分别讨论它们。Cache-ControlCache-Control是最重要的规则。这个字段用于指定所有缓存机制在整个请求/响应链中必须服从的指令。这些指令指定用于阻止缓存对请求或响应造成不利干扰的行为。这些指令通常覆盖默认缓存算法。缓存指令是单向的,即请求中存在一个指令并不意味着响应中将存在同一个指令。cache-control定义是:Cache-Control="Cache-Control"":"cache-direct
8、ive。表1展示了适用的值。表1.常用cache-directive值Cache-directive说明pu
此文档下载收益归作者所有