ajax性能优化

例:

模块:  A  B  C  D

开销:  50%  3% 25%   22%

如果我们优化B就如同那些那些只执行一次的代码,性能·提高不到哪里去;反之,我们去优化A,比如去优化它的循环,减少循环的嵌套,就能很好的提高网站性能(当然,这必须建立在程序符合要求的前提下)。

使用ajax技术(ajax库http://developer.yahoo.com/yui/)

ajax实现方式:发送数据包到服务器(通常编码为json),然后服务端返回一个数据包(也就是json编码)来响应,最后js程序使用这些数据来更新浏览器的显示。

使用ajax优点:数据的传输量,用户操作和可视化反馈的时间·减少,服务器和浏览器需要做的工作也减少了。

使用ajax缺点:程序员需要做的工作量因此而增加。

使用ajax事项:数据包应该尽可能小。

使用ajax常见错误:把所有数据都传给浏览器,这会再次引入ajax本应避免的延迟问题。增加了浏览器处理的数据量,n值增大,性能降低。

ajax中的炫酷特效,可能会分散用户注意力,降低生产效率,并且会产生不必要的DOM操作。

总结:   1  选择那些消耗量大的代码去提速

     2  减少DOM操作

     3  编码要有质量,易于维护、理解与优化

     4  使用ajax技术能使应用程序更快。

ajax性能优化的更多相关文章

  1. input屏蔽历史记录 ;function($,undefined) 前面的分号是什么用处 JSON 和 JSONP 两兄弟 document.body.scrollTop与document.documentElement.scrollTop兼容 URL中的# 网站性能优化 前端必知的ajax 简单理解同步与异步 那些年,我们被耍过的bug——has

    input屏蔽历史记录   设置input的扩展属性autocomplete 为off即可 ;function($,undefined) 前面的分号是什么用处   ;(function($){$.ex ...

  2. react生命周期函数的应用-----1性能优化 2发ajax请求

    知识点1:每次render其实就会将jax的模板生成一个虚拟dom,跟上一个虚拟dom进行比对,通过diff算法找出不同,再更新到真实dom上去. 1性能优化 每次父组件render一次(除了第一次初 ...

  3. 性能优化之AJAX

    明天就放假啦~哈哈.四月份好像还没有输出呢,吓得我赶紧写点东西... Ajax是高性能JavaScript的基础. Ajax,从最基本的层面来说,是一种与服务器通信而无需重载页面的方法.数据可以从服务 ...

  4. CSS3与页面布局学习总结(八)——浏览器兼容与前端性能优化

    一.浏览器兼容 1.1.概要 世界上没有任何一个浏览器是一样的,同样的代码在不一样的浏览器上运行就存在兼容性问题.不同浏览器其内核亦不尽相同,相同内核的版本不同,相同版本的内核浏览器品牌不一样,各种运 ...

  5. CSS3与页面布局学习笔记(八)——浏览器兼容性问题与前端性能优化方案

    一.浏览器兼容 1.1.概要 世界上没有任何一个浏览器是一样的,同样的代码在不一样的浏览器上运行就存在兼容性问题.不同浏览器其内核亦不尽相同,相同内核的版本不同,相同版本的内核浏览器品牌不一样,各种运 ...

  6. web前端之性能优化

    作为一个前端工作人员,而且只会写点HTML5和CSS3的“假”前端工程师,为了能更好地理解一下前端的花花世界,最近拜读了<高性能网站建设指南>一书,对作者提出的前端性能优化的14个规则获益 ...

  7. web前端性能优化

    性能优化对于用户体验无疑是非常重要的,下面介绍一些性能优化的方法. 1.减少HTTP请求 http请求越多,那么消耗的时间越多,如果在加上网络很糟糕,那么问题就更多了.且如果网页中的图片.css文件. ...

  8. Jquery学习笔记--性能优化建议

    一.选择器性能优化建议 1. 总是从#id选择器来继承 这是jQuery选择器的一条黄金法则.jQuery选择一个元素最快的方法就是用ID来选择了. 1 $('#content').hide(); 或 ...

  9. 【读书笔记】读《高性能网站建设指南》及《高性能网站建设进阶指南:Web开发者性能优化最佳实践》

    这两本书就一块儿搞了,大多数已经理解,简单做个标记.主要对自己不太了解的地方,做一些记录.   一.读<高性能网站建设指南> 0> 黄金性能法则:只有10%~20%的最终用户响应时间 ...

随机推荐

  1. python-基本数据类型(int,bool,str)

    一.python基本数据类型 1. int ==>  整数. 主要⽤用来进⾏行行数学运算 2. str ==> 字符串串, 可以保存少量量数据并进⾏行行相应的操作 3. bool==> ...

  2. React性能优化之PureComponent 和 memo使用分析

    前言 关于react性能优化,在react 16这个版本,官方推出fiber,在框架层面优化了react性能上面的问题.由于这个太过于庞大,我们今天围绕子自组件更新策略,从两个及其微小的方面来谈rea ...

  3. 移动端使用rem.js,解决rem.js 行内元素占位问题

    父级元素: letter-spacing: -0.5em;font-size: 0; 子级元素: letter-spacing: normal; display: inline-block; vert ...

  4. Spring Boot2(四):使用Spring Boot多数据源实现读写分离

    前言 实际业务场景中,不可能只有一个库,所以就有了分库分表,多数据源的出现.实现了读写分离,主库负责增改删,从库负责查询.这篇文章将实现Spring Boot如何实现多数据源,动态数据源切换,读写分离 ...

  5. 工作中vue项目前后端分离,调用后端本地接口出现跨域问题的完美解决

    在我们实际开发中,选择不错的前端框架可以为我们省掉很多时间,当然,有时我们也会遇到很多坑. 最近在做vue项目时就遇到了跨域问题,一般来说,出现跨域我们第一反应使用jsonp,但是这个只支持get请求 ...

  6. 微服务之服务注册与发现--Consul(转载)

    http://blog.csdn.net/buxiaoxia/article/details/69788114 https://www.cnblogs.com/xiaohanlin/p/8016803 ...

  7. css之vw布局

    vw,vh是视口单位,是相对视口单位,与百分百布局不一样的是,百分百是相对于父及元素,而vw布局是相对与窗口. 而rem布局是要与js一起配合 // 以iphone6设计稿 @function px2 ...

  8. (2)Linux文件和目录操作命令

    简单就是高效 pwd cd -/~/.. tree–a/d/f/i/L mkdir–p/v/m touch ls –l/a//i/h/F cp –r/p/d/a mv rm –f/r/i rmdir ...

  9. 联盟链FISCO BCOS v2.0.0-rc3 发布

    FISCO BCOS是完全开源的联盟区块链底层技术平台,由金融区块链合作联盟(深圳)(简称金链盟)成立开源工作组通力打造.开源工作组成员包括博彦科技.华为.深证通.神州数码.四方精创.腾讯.微众银行. ...

  10. Disruptor 详解 一

    这篇博客将主要通过几个示例,简单讲述 Disruptor 的使用方法: 一.disruptor 简介 Disruptor 是英国外汇交易公司 LMAX 开发的一个无锁高性能的线程间消息传递的框架.目前 ...