高性能网站建设读书笔记（3）创建快速响应的Web应用

创建快速响应的Web应用

浏览器使用单线程从队列中取出事件，然后对事件本身进行处理或执行JavaScript。因此，浏览器每次只能处理这些任务中的一个，并且任意一个任务都能阻止其他任务执行。

怎样才算足够快

响应时间准则

0.1秒 ：用户直接操作UI中对象的感觉极限。如，从用户选择表格中一列到该列高亮的时间间隔。理想情况下，也是对列进行排序的响应时间。

1秒：用户随意地在计算机指令空间进行操作而无需过度等待的感觉极限。超过一秒的延迟要提示用户计算机正在解决这个问题，如改变光标形状。

10秒：用户专注于任务的极限。超过十秒的任何操作需要一个百分比完成指示器，以及一个方便用户中断操作且有清晰标识的方法。假设用户遭遇超过10秒延迟后才返回原UI的情况，他们需要重新适应。在用户工作中，超过10秒的延迟仅在自然中断时可以接受，比如切换任务时。

测量延迟时间

手动代码检测

<div onclick="myJavaScriptFunction()">...</div>

function myJavaScriptFunction() {
    var start = new Date().getMilliseconds();
    //这是开销大的代码
    var executionTime = stop - start；
    alert("myJavaScriptFunction() executed in " + executionTime + 
        " milliseconds");
}

自动代码检测（性能分析）

Firefox的插件Firebug包含JavaScript代码性能分析器。

但事实上性能分析器也会受到外在的影响，观察代码性能的行为改变了代码的性能。

可以在网页界面上执行一个高级别的任务（如单击发送按钮），然后执行Firebug性能分析器去查看哪些函数消耗的执行时间最多，最后集中在这些函数上进行优化工作。

当延迟变得很严重时

如果JavaScript代码使浏览器线程停滞过长时间，大多浏览器会进行干预并给用户中断执行代码的机会。

what determine that a script is long running

结论：别把运行时间可能很长的低性能代码引入到网页中。

线程处理

JavaScript不支持多线程。

Brendan Eich JavaScript创立者，Mozilla首席技术官