Yahoo!网站性能最佳体验的34条黄金守则—内容(3)
作者:dudo 来源:dudo says 发布时间:2008-05-13 12:14:00
4、可缓存的AJAX
Ajax经常被提及的一个好处就是由于其从后台服务器传输信息的异步性而为用户带来的反馈的即时性。但是,使用Ajax并不能保证用户不会在等待异步的JavaScript和XML响应上花费时间。在很多应用中,用户是否需要等待响应取决于Ajax如何来使用。例如,在一个基于Web的Email客户端中,用户必须等待Ajax返回符合他们条件的邮件查询结果。记住一点,“异步”并不异味着“即时”,这很重要。
为了提高性能,优化Ajax响应是很重要的。提高Ajxa性能的措施中最重要的方法就是使响应具有可缓存性,具体的讨论可以查看Add an Expires or a Cache-Control Header。其它的几条规则也同样适用于Ajax:
Gizp压缩文件
减少DNS查找次数
精简JavaScript
避免跳转
配置ETags
让我们来看一个例子:一个Web2.0的Email客户端会使用Ajax来自动完成对用户地址薄的下载。如果用户在上次使用过Email web应用程序后没有对地址薄作任何的修改,而且Ajax响应通过Expire或者Cacke-Control头来实现缓存,那么就可以直接从上一次的缓存中读取地址薄了。必须告知浏览器是使用缓存中的地址薄还是发送一个新的请求。这可以通过为读取地址薄的Ajax URL增加一个含有上次编辑时间的时间戳来实现,例如,&t=11900241612等。如果地址薄在上次下载后没有被编辑过,时间戳就不变,则从浏览器的缓存中加载从而减少了一次HTTP请求过程。如果用户修改过地址薄,时间戳就会用来确定新的URL和缓存响应并不匹配,浏览器就会重要请求更新地址薄。
即使你的Ajxa响应是动态生成的,哪怕它只适用于一个用户,那么它也应该被缓存起来。这样做可以使你的Web2.0应用程序更加快捷。
5、推迟加载内容
你可以仔细看一下你的网页,问问自己“哪些内容是页面呈现时所必需首先加载的?哪些内容和结构可以稍后再加载?
把整个过程按照onload事件分隔成两部分,JavaScript是一个理想的选择。例如,如果你有用于实现拖放和动画的JavaScript,那么它就以等待稍后加载,因为页面上的拖放元素是在初始化呈现之后才发生的。其它的例如隐藏部分的内容(用户操作之后才显现的内容)和处于折叠部分的图像也可以推迟加载
工具可以节省你的工作量:YUI Image Loader可以帮你推迟加载折叠部分的图片,YUI Get utility是包含JS和 CSS的便捷方法。比如你可以打开Firebug的Net选项卡看一下Yahoo的首页。
当性能目标和其它网站开发实践一致时就会相得益彰。这种情况下,通过程序提高网站性能的方法告诉我们,在支持JavaScript的情况下,可以先去除用户体验,不过这要保证你的网站在没有JavaScript也可以正常运行。在确定页面运行正常后,再加载脚本来实现如拖放和动画等更加花哨的效果。


猜你喜欢
- 本文为大家分享了pygame游戏之旅的第7篇,供大家参考,具体内容如下对car和障碍的宽高进行比较然后打印即可:if y < thin
- 今天简单使用了一下python的re模块和lxml模块,分别利用的它们提供的正则表达式和xpath来解析页面源码从中提取所需的title,x
- 介绍据官方所述,mango Cache是对Guava Cache基于go的部分实现,同时mangoCache参考了Caffeine以及go-
- 1. jquery.jqzoom.js//*************************************************
- --1. 创建表,添加测试数据 CREATE TABLE tb(id int, [value] varchar(10)) INSERT tb
- 如何在SQL2000的查询中使用XML-Data?具体程序如下:orders.asp<%@ Language=VBScrip
- 一、分析阶段 一般来说,在系统分析阶段往往有太多需要关注的地方,系统各种功能性、可用性、可靠性、安全性需求往往吸引了我们大部分的注意力,但是
- Mysql Cluster概述 MySql Cluster最显著的优点就是高可用性,高实时性,高冗余,扩展性强。&n
- 虽然淘宝商城的名字中带有“商城”两字,但是很显然的,淘宝商城并不是一个B2C商城,淘宝商城仍只是一个C2C平台,充其量只是个收费版的淘宝。在
- 使用requests下载文件1、获取token,或者session如不需要可忽略login_url = "http://xxxx/
- 一、Scipy 入门1.1、Scipy 简介及安装官网:http://www.scipy.org/SciPy安装:在C:\Python27\
- 字典什么是字典说到字典,第一时间想到的应该就是新华字典,实际上,这跟编程中的字典类似,两者都有一个特点,就是一一对应(yi yi dui y
- 假设你需要允许在Hero管理页面上导入CSV数据。为此,您需要添加一个指向更改Hero列表页面的链接,点击这个链接会跳转到上传页面。你需要编
- 前言有些时候我们在父类中使用了 self.tr('XXX'),使用 Qt Linguist 完成翻译并导出 qm 文件后,发
- 这篇文章主要介绍了python实现实时视频流播放代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的
- matlab程序读取单片机通过串口传来的IMU角度数据,并用曲线显示出来。上传的值为float型,每个数据后有回车符。范围90~-90主文件
- Python获取电脑截图有多种方式,具体如下:PIL中的ImageGrab模块windows APIPyQtpyautoguiPIL中的Im
- 用AJAX刷新一个DIV中的jsp内容 <script type="text/javascript"> va
- 本文实例为大家分享了Vue自定义日历插件的具体代码,供大家参考,具体内容如下由于网上的插件没有符合项目的需求决定自己实现图示如下:默认选择今
- <?xml version="1.0" encoding="utf-8&