网站优化之Ajax优化及相关工具

2016-02-19 17:07 3 1 收藏

想不想get新技能酷炫一下,今天图老师小编就跟大家分享个简单的网站优化之Ajax优化及相关工具教程,一起来看看吧!超容易上手~

【 tulaoshi.com - Web开发 】

  web2.0大量的ajax的使用,提高了ui交互的效率,但是过度的滥用会带来不少的问题。

  ajax使用注意事项:

  1 尽量避免使用同步ajax调用。在一些登录的场合常常使用同步调用服务器的登录接口。

  同步调用,需要将页面上的所有元素给锁定住,代价高昂。

  2 ajax调用时多使用超时设置,目前许多ajax框架如jquery都会提供超时参数的设置。

  利用超时,可以很好的完善ui的交互,同时避免对服务器造成压力。

  3 针对业务特性开启ajax缓存。不需要重新拉取的东东,尽量的缓存起来。

  4 发送请求前对发送的数据进行pre验证,一方面可以做到对用户友好,另一方面避免太多的异常。

  不小心的异常数据会导致服务器down掉。

  5 对于服务器返回的数据也要仔细处理,不要相信其数据一定是格式化和验证好的。譬如对于json的数据,需要先判断相应的key是否存在,再进行操作,

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)

  否则会出现undifined的情况。

  ajax请求处理一般的ui交互流程是这样的:

  1 当发起ajax请求时,更新ui,譬如出现一个高亮的tip,提示用户操作开始进行

  2 锁住需要更新的ui部份,同时提醒用户会什么会锁住,譬如将原div隐藏,加载一个正在加载的gif图标

  3 数据成功返回后,更新ui,解除对ui的锁定

  4 如果服务器返回失败,提示用户友好的失败信息

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)

  ajax使用中一些提示:

  1 由于浏览器的同时向一个域名发起请求的并发数是有限制的,如ie默认的是2个,如果同时发起的ajax太多的话,是会被阻塞的。

  2 返回的数据类型选择json而不是xml,一方面json数据格式会更小一些,另一方面接送封装成为一个js对象,操作起来性能会更好一些

  3 尽量缓存能够缓存的内容,避免重复的发起请求

  1)使用全局对象

  2) flash的本地存储

  3)google gears

  4) ie的userData

来源:https://www.tulaoshi.com/n/20160219/1614225.html

延伸阅读
标签: Web开发
一个网站的结构代表着这个网站性质,每个行业里都有独特的结构模式。政府和机构性质的网站,简单明了,突出重点,不需要过多的美化工作,网站头部通常设置一个通栏Logo,以代表形象。游戏、下载等等都有自己独特的架构。如果网站的结构没有设置好的话,会严重影响网站的效果。但并不是网站结构设计的好就什么问题都解决了,要把网站优化的...
标签: MySQL mysql数据库
一、什么是索引? 索引用来快速地寻找那些具有特定值的记录,所有MySQL索引都以B-树的形式保存。如果没有索引,执行查询时MySQL必须从第一个记录开始扫描整个表的所有记录,直至找到符合要求的记录。表里面的记录数量越多,这个操作的代价就越高。如果作为搜索条件的列上已经创建了索引,MySQL无需扫描任何记录即可迅速得到目标记录所在的...
标签: 网站 网络
网站结构布局 网站结构应选择对搜索引擎比较好的结构方式,目前搜索引擎最欢迎的网站结构是F型树状结构和扁平树状结构的网站。 网站文章的优化 文章标题应包含关键词,选择能吸引人们眼球的标题或选择让人难忘的关键词。 站外优化 站外优化主要是做外链,在b2b平台,博客,黄页等信息平台上发布软文。软文的内容...
如果内容为王的话,那么设计就是城堡。对于企业而言,好的网页设计不仅包含了能够引起访客兴趣的内容,吸引目标用户,而且包含有直观而漂亮的UI设计,促进销售。许多设计师喜欢将自己认为创意爆棚的UI设计直接应用到客户的网站上,但并没有考虑过这种设计是否符合网站的产品,是否符合目标用户群所需要的体验与需求,从这个角度上来说,这样的...
标签: PS PS教程
在使用Photoshop CS之前,需要进行一系列的优化设置。 1.CTRL+K打开Preferences(预设)的对话框,如果不用快捷键,这个命令在Edit(编辑)菜单下。首先查看General(常规),对于Options(选项)区块,选择以下的选项。 1.1:Export Clipboard(输出剪贴板),这个选项允许Photoshop像其他程序中粘贴图像时使用系统剪贴板作为...

经验教程

942

收藏

41
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部