第四章、算法和流程控制 Algorithms And Flow Control

原因:代码整体结构是执行速度的决定因素之一。代码量少不一定运行速度快,代码量多不一定运行速度慢。性能损失与组织代码和具体问题解决办法直接相关。

解决:

  1. 与其他编程语言一样,代码的写法和算法选用影响JavaScript的运行时间。与其他编程语言不同是,JavaScript可用的资源有限,所以优化的技术更为重要。
  2. For, While, Do while循环特性相似,谁也不必谁更快或更慢。
  3. 除非迭代遍历一个未知的属性, 否则不用for in 循环(效率低)。
  4. 一般来说,switch 比if else 效率高,但判断条件少时用if else结构更好。
  5. 当判断条件多时,查表法比if else或者switch速度更快。
  6. 浏览器调用栈尺寸限制了递归算法在JavaScript中的应用,栈溢出错误导致其他代码也不能正常执行。
  7. 如果遇到栈溢出错误,将方法修改为一个迭代算法或者使用制表法可以避免重复工作。
  8. 运行的代码总量越大,使用这些策略带来的性能提升越明显。

第五章、字符串和正则表达式 String and Regular Expressions

问题: 密集的字符串操作和粗劣的编写正则表达式可能是主要的性能障碍。

解决:

  1. 当连接数量巨大或者尺寸巨大的字符串时,数组联合是IE7和它早期版本上唯一具有合理性能的方法。
  2. 如果不关心IE7和早期版本,数组联合则是最慢的方法之一。使用简单的+和+=取而代之,可以避免产生不必要的中间字符串。
  3. 回溯既是正则表达式匹配功能的基本组成之一,又是正则表达式影响效率的常见原因。
  4. 避免回溯失控:使用邻字元互斥,避免嵌套量词对一个字符串的相同部分多次匹配,通过重复利用前瞻操作的原子特性除去不必要的回溯。
  5. 正则表达式不总是完成工作的最佳选择,比如当你搜索一个字符串的时候。

第六章、响应接口 Responsive Interfaces

问题: 网页应用程序响应的速度是一个重要的性能关注点。

建议:

  1. Javascript运行时间不能超过100毫秒,过长的运行时间可能导致UI更新出现可观察的延迟,从而对整体用户体验产生负面影响。
  2. Javascript运行期间,浏览器响应用户交互的行为存在差异。无论无何,Javascript长时间运行将导致用户混乱和脱节。
  3. 定时器可用于安排代码推迟执行,它使得你可以将长运行脚本分解成一系列较小的任务。
  4. 网页工人线程(worker)是新式浏览器才支持的特性,他允许你在UI进程之外运行Javascript代码和避免锁定了UI。
  5. 网页程序越复杂,积极主动的管理UI线程就越显得重要。没有什么Javascript代码可以重要到允许影响用户体验的程度。

第七章、Ajax --异步的Javascript 和 xml

问题: Ajax是高性能Javascript的基石。他可以通过延迟下载和异步下载,是页面加载更快。

建议:

  1. 作为数据格式,纯文本和HTML是高度限制的,但他们可以节省客户端CPU周期。XML被广泛应用普遍支持,但它非常冗长且解析缓慢。JSON是轻量级的,解析迅速,交互性与XML相当。字符分隔的自定义格式非常轻量,在大量数据解析时速度最快,但需要编写额外的程序在服务器端构造格式,并在客户端解析。
  2. 当从页面域请求数据时,XML提供最完善的控制和灵活性,尽管它将所有传入的数据视为一个字符串,这有可能降低解析速度。另一方面,动态脚本标签插入技术允许跨域请求和本地运行Javascript和Json,虽然它的接口不够安全,而且不能读取信息头或响应报文代码。多部分的XHR可以减少请求的数量,可以在单次响应中处理不同的文件类型,尽管它不能缓存到响应报文中。当发送数据时,图像灯标(使用image标签发送请求)是最简单和最有效的方法。XHR也可以用POST发送大量数据。
  3. 减少请求数量,可通过Javascript和CSS文件打包,或者使用XHR。
  4. 缩短页面的加载时间,在页面其他内容加载之后,使用Ajax获取少量重要文件。
  5. 确保错误代码不要直接显示给用户,并在服务器端处理错误。
  6. 学会何时使用一个健壮的Ajax库,何时编写自己的底层Ajax代码。

《高性能Javascript》 Summary(三)

《高性能Javascript》 Summary(二)的更多相关文章

  1. 高性能JavaScript笔记二(算法和流程控制、快速响应用户界面、Ajax)

    循环 在javaScript中的四种循环中(for.for-in.while.do-while),只有for-in循环比其它几种明显要慢,另外三种速度区别不大 有一点需要注意的是,javascript ...

  2. 《高性能Javascript》 Summary(一)

    第一章.加载和执行 Loading & Execution 原因:Javascript 的执行导致页面渲染中止等待. 解决: 将script放在页面底部,紧靠body 闭合标签之前,保证页面在 ...

  3. 《高性能javascript》 领悟随笔之-------DOM编程篇(二)

    <高性能javascript> 领悟随笔之-------DOM编程篇二 序:在javaSctipt中,ECMASCRIPT规定了它的语法,BOM实现了页面与浏览器的交互,而DOM则承载着整 ...

  4. 《高性能Javascript》 Summary(三)

    第八章.编程实践 Programming Practices 经验: 避免使用 eval_r()和Function构造器避免二次评估.此外,给setTimeout()和setInterval()函数传 ...

  5. 高性能JavaScript 重排与重绘

    先回顾下前文高性能JavaScript DOM编程,主要提了两点优化,一是尽量减少DOM的访问,而把运算放在ECMAScript这一端,二是尽量缓存局部变量,比如length等等,最后介绍了两个新的A ...

  6. 【读书笔记】读《高性能JavaScript》

    这本<高性能JavaScript>讲述了有关JavaScript性能优化的方方面面,主要围绕以下几个方面: 1> 加载顺序 2> 数据访问(如怎样的数据类型访问最快,怎样的作用 ...

  7. 高性能JavaScript(1)

    ---------------------------------------------------------------------------------------------------- ...

  8. 《高性能JavaScript》--读书笔记

    第一章 加载和运行 延迟脚本 defer 该属性表明脚本在执行期间不会影响到页面的构造,脚本会先下载但被延迟到整个页面都解析完毕后再运行.只适用于外部脚本 <script src="j ...

  9. QrCode C#生成二维码 及JavaScript生成二维码

    一 C#的二维码    示例: class Program { static void Main(string[] args) { QrEncoder qrEncoder = new QrEncode ...

随机推荐

  1. 最长递增子序列问题—LIS

    问题:给定一组数 a0,a0,....,an-1. 求该序列的最长递增(递减)序列的长度. 最长递增子序列长度的求法有O(n^2)和O(nlogn)两种算法. 1.复杂度为O(n^2)的算法. 设L[ ...

  2. pandas常用操作

    删除某列: concatdfs.drop('Unnamed: 0',axis=1) 打印所有列名: .columns

  3. ZOJ - 3228 Searching the String (AC自己主动机)

    Description Little jay really hates to deal with string. But moondy likes it very much, and she's so ...

  4. 查看网络port占用

    Linux和Mac下通用: 1.  利用 netstat 查看网络状态命令: netstat -an|grep port号 2. 利用list open file 命令打开文件(一切都是文件. 包含网 ...

  5. npm使用指南

    npm使用指南 作者:chszs,未经博主同意不得转载.经许可的转载需注明作者和博客主页:http://blog.csdn.net/chszs npm介绍 npm全称为Node Package Man ...

  6. 2016年蓝桥杯C/C++B组

    第一次參加蓝桥杯.也是有非常多感触的,时间全然不够写最后一题... 最后一题没做...还有全排序非常重要... 1. 煤球数目 有一堆煤球,堆成三角棱锥形.详细: 第一层放1个, 第二层3个(排列成三 ...

  7. vue.js+koa2项目实战(三)登录注册模态框

    登录注册模态框 注: [Vue warn]: Do not use built-in or reserved HTML elements as component id: diaLog 原因:diaL ...

  8. NGINX下如何自定义404页面

    什么是404页面 如果碰巧网站出了问题,或者用户试图访问一个并不存在的页面时,此时服务器会返回代码为404的错误信息,此时对应页面就是404页面.404页面的默认内容和具体的服务器有关.如果后台用的是 ...

  9. 开发ActiveX控件调用另一个ActiveX系列2——调试ActiveX

    关于调试ActiveX控件,有若干方法,例如可以建一个MFC工程调用调试,我则倾向于使用附加到浏览器进程,因为浏览器才是真正运行的环境. 打开加载ActiveX的目标页面,当然希望我们的调试内容不是自 ...

  10. 链接脚本使用一例2---将二进制文件 如图片、MP3音乐、词典一类的东西作为目标文件中的一个段

    参考文章: <程序员的自我修养——链接.转载与库> P68 这里介绍两种方法,实现将将一张图片作为二进制可执行程序的一个段,其中第一种方法在我之前的博客中已经有所介绍,不过,那是采用的是交 ...