前言 最近在翻<高性能JavaScript>这本书(2010年版 丁琛译),感觉可能是因为浏览器引擎的改进或是其他原因,书中有些原本能提高性能的代码在最新的浏览器中已经失效.但是有些章节的有些内容还是相当不错的,譬如第八章编程实践,为了方便以后的查阅,对此做个总结.失效的代码也会在以后做更进一步的探索. 避免双重求值 这个优化策略很好理解,我们可能都已经不知不觉地运用在了实际的编程中: // not use this setTimeout('alert("hello world&qu…

代码为什么要这样写? function initUI(){ var doc = document, bd = doc.body, links = doc.getElementsByTagName_r("a"), i = 0, len = links.length; while(i < len){ update(links[i++]); } doc.getElementById("go-btn").onclick = function(){ start(); }…

When the browser encounters a <script> tag, as in this HTML page, there is no way of knowing whether the JavaScript will insert content into the <p>, introduce additional elements, or perhaps even close the tag. Therefore, the browser stops pr…

if else 和 switch    &&    递归 if else 和 switch 一般来说,if-else 适用于判断两个离散的值或者判断几个不同的值域.如果判断多于两个离散值,switch表达式将是更理想的选择. 如同 我们在写sql 总习惯把可以过滤掉更多的where 放在前面一样,当 if else 判断的离散值较多时也因该这么干. 二分搜索法: if (value == 0){ //要优化的代码 return result0; } else if (value == 1)…

第三章  DOM Scripting  最小化 DOM 访问,在 JavaScript 端做尽可能多的事情. 在反复访问的地方使用局部变量存放 DOM 引用. 小心地处理 HTML 集合,因为他们表现出“存在性”,总是对底层文档重新查询.将集合的 length 属性缓 存到一个变量中,在迭代中使用这个变量.如果经常操作这个集合,可以将集合拷贝到数组中. 如果可能的话,使用速度更快的 API,诸如 querySelectorAll()和 firstElementChild. 注意重绘和重排版:批量…

草草的看完第一章,虽然看的是译文也是感觉涨姿势了, 我来总结一下: 由于 大多数浏览器都是 single process 处理 ui updatas and js execute 于是产生问题: js (script tag) will blocking page processing 上图说话: 于是大家动脑筋想办法 想到了三个办法 1. Parallel downloads, then execute  并行下载,然后执行. 2.Download times less,Less downlo…

又要开始罗里吧嗦的 第四章  Summary 了. 这一次我尽量精简语言. 如果你认为 重复调用一个方法数次有点辣眼睛的话 比如: function test(i){ process(i++); process(i++); process(i++); process(i++); } 那么你可能选择更优解 比如: function test(i){ for(j=0,j<4,j++){ process(i++); } } 但其实第一种性能优于第二种. 有人可能已经想到  Duff's Device…

我们知道,对DOM的操作都是非常的耗性能的,那么为什么会耗性能呢?      文档对象模型(DOM)是一个独立于语言的,使用 XML和 HTML 文档操作的应用程序接口(API).在浏览器中,主要与 HTML 文档打交道,在网页应用中检索 XML 文档也很常见.DOM APIs 主要用于访问这些文档中的数据.尽管 DOM 是与语言无关的 API,在浏览器中的接口却是以 JavaScript 实现的.客户端大多数脚本程序与文档打交道,DOM 就成为 JavaScript 代码日常行为中重要的组成部…

在 JavaScript 中,数据存储位置可以对代码整体性能产生重要影响.有四种数据访问类型:直接量,变量,数组项,对象成员.         直接量仅仅代表自己,而不存储于特定位置. JavaScript 的直接量包括:字符串,数字,布尔值,对象,数组,函数,正则表达式,具有特殊意义的空值,以及未定义.          变量是指开发人员使用 var关键字创建用于存储数据值.          数组现是指具有数字索引,存储一个 JavaScript数组对象.          对象成员具有字符…

参考高性能javascript 理解浏览器UI线程  用于执行javascript和更新用户界面的进程通常被称为浏览器UI线程  UI线程的工作机制可以理解为一个简单的队列系统,队列中的任务按顺序执行 <button onclick="handleClick()">click</button> <script type="text/javascript"> function handleClick() { var div = do…