AJAX是时下最流行的一种WEB端开发技术,而你真正了解它的一些特性吗?--IT北北报

XMLHTTPRequest(XHR)是目前最常用的技术,它允许异步接收和发送数据,所有的主流浏览器都对它有不错的支持,你可以在请求中添加任何头信息或者携带参数,同时也可以读取服务器返回的所有头信息及响应文本。这些正是AJAX产生的基础。

·使用XHR时候,我们到底是应该使用POST还是GET方式呢?

如果你需要在POST和GET间做出选择的时候,对于那些不会改变服务器状态,只会获取数据(幂等行为)的请求,我强烈建议你使用GET方式,因为经GET请求的数据会被缓存起来,如果多次请求同一数据的话,将会命中缓存。

只有当请求的URL加参数后的长度接近或超过2048字节时,应该考虑使用POST方式,因为IE浏览器限制了URL的长度,这可能导致URL被截断,而得不到你想要的数据。

当然,当你使用GET方式的时候,你也可以主动去控制缓存的时间,方法是给请求加上相应的过期时间:

Var rep=new XMLHTTPRequest();

rep.setRequestHeader(“Expires”,”Mon,28 Jul 2020 23:59:59 GMT”);

这样我们主动给那些很久不会发生变化的数据发送一个很久以后才过期的请求。

·关于AJAX传送的四种数据格式XML、Json、Html、自定义格式。

XML:

<users>

<user id=”1” name=”itbbb.com” />

<user id=”2” name=”baby” />

</user>

优点:它是最早的数据传送标准,被各种语言良好支持,格式严谨、易于验证。

缺点:数据传送量消耗巨大,会携带大量标签,解析需要消耗一些性能。

Json:

users=[{id:1,name:”itbbb.com”},{id:2,name:”baby”}]

优点:轻量级数据传送方式,结构轻巧,文件尺寸小,解析快。

缺点:可读性差,比较脆弱,可能因为一个标点符号的错误导致整个数据解析失败。

HTML:

<ul class=”users”>

<li class=”user” id=”1”><a>itbbb.com</a></li>

<li class=”user” id=”2”><a>baby</a></li>

</ul>

优点:结构通常在服务器端已经组织好,通常服务器端解析性能要明显优于客户端解析的性能,这样的数据通常可以直接输出。

缺点:这样的数据包含了比XML过多的标签信息,数据更加冗长。

通常当客户端的瓶颈是CPU而不是带宽的时候,会使用这种技术。

自定义格式:

1:itbbb.com,;2:baby;

优点:这样的纯文本格式把数据缩短到最短,只需要一个特定的分隔符就可以解析,通常用于大数据量传输时,可以解决数据体积的问题。

缺点:通常要自己构造方法去解析,兼容性较差,语言类库通常不提供任何解析方法。

相信看了以上关于数据格式的剖析,您一定已经选择出了最适合你项目中的数据格式。

想了解更多高性能Javascript的技术您可以尝试阅读IT北北报

 

网站重构-你了解AJAX吗?的更多相关文章

  1. PHP Yii框架开发——组织架构网站重构

    最近一段时间在维护公司的组织架构网站(Org),旧版网站只是用了xampp简单搭建了一套环境部署在了windows机器上,代码结构相对简单. 整个架构如下: 整个架构没有用到复杂的结构,class里放 ...

  2. 哈佛大学构建动态网站--第七讲ajax

    Ajax ajax举例: DOM的结构 通过js来修改html页面. Ajax的含义: return false的用途 跨浏览器的ajax 为什么不直接从yahoo获得数据呢? XMLHttpRequ ...

  3. 《编写高质量代码-Web前端开发修改之道》笔记--第一章 从网站重构说起

    本章内容: 糟糕的页面实现,头疼的维护工作 Web标准--结构.样式和行为的分离 前端的现状 打造高品质的前端代码,提高代码的可维护性--精简.重用.有序 糟糕的页面实现,头疼的维护工作 工作中最大的 ...

  4. 对web标准化(或网站重构)知道哪些相关的知识,简述几条你知道的Web标准?

    网页主要有三部分组成:结构(Structrue).表现(Presentation)和行为(Behavior).对应的网站标准也分为三方面: 1.结构化标准语言,主要包括XHTML和XML: 2.表现标 ...

  5. Ajax重构

    Ajax重构简介 Ajax的实现主要依赖于XMLHttpRequest对象,但是在调用其进行异步数据传输时,由于XMLHttpRequest对象的实例在处理事件完成后就会被销毁,所以如果不对该对象进行 ...

  6. 你真正的了解Ajax?Ajax技术简述

    Ajax技术是目前在浏览器中通过JavaScript脚本可以使用的所有技术的集合.Ajax并没有创造出某种具体的新技术,它所使用的大多数技术都是在很多年以前就已经存在了,然而Ajax以一种崭新的方式来 ...

  7. JavaScript学习总结(一)——延迟对象、跨域、模板引擎、弹出层、AJAX示例

    一.AJAX示例 AJAX全称为“Asynchronous JavaScript And XML”(异步JavaScript和XML) 是指一种创建交互式网页应用的开发技术.改善用户体验,实现无刷新效 ...

  8. 一种开发模式:ajax + ashx + UserControl

    一.ajax+ashx模式的缺点     在web开发过程中,为了提高网站的用户体验,或多或少都会用到ajax技术,甚至有的网站全部采用ajax来实现,大量使用ajax在增强用户体验的同时会带来一些负 ...

  9. 一枚招聘信息——分期乐招页面重构/UI开发(8k-12k 深圳 经验1-3年 学历不限 全职)

    腾讯人创建的分期乐公司,急需页面重构人才若干枚,公司前景好,机会难得,有兴趣的速速 8k-12k 深圳 经验1-3年 学历不限 全职 公司网站: http://www.fenqile.com/ 职位诱 ...

随机推荐

  1. mac os升级为 Yosemite 10.10 后不能创建javaproject

    出现这样的情况可能是因为mac系统升级导致JAVA的安装路径发生改变(Xcode升级后也出现模拟器位置改变的情况,不要奇怪) 之前安装的eclipse就自然找不到SDK的路径了,所以会捆绑失败 接下来 ...

  2. Struts2 Action的访问路径

    1.     Action的访问路径 扩展名 缺省以.action结尾,请参考:default.properties文件,可以通过配置改变这一点: <constant name="st ...

  3. Yum本地Rpm库设置

    http://blog.csdn.net/dc_726/article/details/8497188   1 Yum对光盘的支持 查看/etc/yum.repos.d/CentOS-Media.re ...

  4. careercup-中等难度 17.8

    17.8 给定一个整数数组(有正数和负数),找出总和最大的连续序列,并返回总和. 解法: 就是求连续子序列的和最大,不过存在一个问题: 假设整个数组都是负数,怎么样才是正确的行为呢?看看这个简单的数组 ...

  5. IT软件开发 书籍汇总

    数据库: MYSQL ->  Effective MySQL 之 SQL 语句最优化   [美] Ronald Bradford 著 李雪锋 译 清华大学出版社 开发书籍 PHP核心技术与最佳实 ...

  6. Android View的绘制机制流程深入详解(一)

    本系列文章主要着重深入介绍Android View的绘制机制及流程,第一篇主要介绍并分析LayoutInflater的原理, 从而理解setContentView的加载原理.对于LayoutInfla ...

  7. Java设计模式06:常用设计模式之适配器模式(结构型模式)

    1. Java之适配器模式(Adapter Pattern) (1)概述:    将一个类的接口转换成客户希望的另外一个接口.Adapter模式使得原本由于接口不兼容而不能一起工作的那些类,可以在一起 ...

  8. js用斜率判断鼠标进入div的四个方向

    网上大部分判断鼠标移入div移入移出都是使用一下方法: 这个方法确实十分奇特,使用起来十分方便. 后来自己看了一些文章,看到有另一种以斜率的方法来判断鼠标的移动方向. 上图是此方法的示意图,以浏览器左 ...

  9. 你不知道的 Javascript

    作用域 词法作用域:编译阶段确定(欺骗词法作用域 eval with) function foo(str){ "use strict" eval(str) console.log( ...

  10. C++ (P199—P211)多态 虚函数 抽象类

    在介绍多态之前,先回忆:赋值兼容原则.虚基类.二义性.派生类如何给基类赋值等知识. 在赋值兼容原则中:父类对象的指针赋给基类的指针或者父类的对象赋给基类的引用,可以通过强转基类的指针或者引用变为父类的 ...