`
鹤惊昆仑
  • 浏览: 223935 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

为什么safari浏览器新的js引擎squirrelfish非常快

阅读更多
announcing-squirrelfish
引用

Why It’s Fast
Like the interpreters for many scripting languages, WebKit’s previous JavaScript interpreter was a simple syntax tree walker. To execute a program, it would first parse the program into a tree of statements and expressions. For example, the expression “x + y” might parse to

        +
      /   \
     x     y
Having created a syntax tree, the interpreter would recursively visit the nodes in the tree, performing their operations and propagating execution state. This execution model incurred a few types of run-time cost.

  • First, a syntax tree describes a program’s grammatical structure, not the operations needed to execute it. Therefore, during execution, the interpreter would repeatedly visit nodes that did no useful work. For example, for the block “{ x++; }”, the interpreter would first visit the block node “{…}”, which did nothing, and then visit its first child, the increment node “x++”, which incremented x.
  • Second, even nodes that did useful work were expensive to visit. Each visit required a virtual function call and return, which meant a couple of indirect memory reads to retrieve the function being called, and two indirect branches—one for the call, and one for the return. On modern hardware, “indirect” is a synonym for “slow”, since indirection tends to defeat caching and branch prediction.
  • Third, to propagate execution state between nodes, the interpreter had to pass around a bunch of data. For example, when processing a subtree involving a local variable, the interpreter would copy the variable’s value between all the nodes in the subtree. So, starting at the “x” part of the expression “f((x) + 1)”, a variable node “x” would return x to a parentheses node “(x)”, which would return x to a plus node “(x) + 1”. Then, the plus node would return (x) + 1 to an argument list node “((x) + 1)”, which would copy that value into an argument list object, which, in turn, it would pass to the function node for f. Sheesh!


In our first rounds of optimization, we squeezed out as much performance as we could without changing this underlying architecture. Doing so allowed us to regression test each optimization we wrote. It also set a very high bar for any replacement technology. Finally, having realized the full potential of the syntax tree architecture, we switched to bytecode.

SquirrelFish’s bytecode engine elegantly eliminates almost all of the overhead of a tree-walking interpreter. First, a bytecode stream exactly describes the operations needed to execute a program. Compiling to bytecode implicitly strips away irrelevant grammatical structure. Second, a bytecode dispatch is a single direct memory read, followed by a single indirect branch. Therefore, executing a bytecode instruction is much faster than visiting a syntax tree node. Third, with the syntax tree gone, the interpreter no longer needs to propagate execution state between syntax tree nodes.

The bytecode’s register representation and calling convention work together to produce other speedups, as well. For example, jumping to the first instruction in a JavaScript function, which used to require two C++ function calls, one of them virtual, now requires just a single bytecode dispatch. At the same time, the bytecode compiler, which knows how to strip away many forms of intermediate copying, can often arrange to pass arguments to a JavaScript function without any copying.


squirrelfish-bytecode
分享到:
评论

相关推荐

    Knowledge-Map:知识图

    名词引擎,编译器与作用域浏览器不同,其引擎也不同,例如Chrome采用的是v8,Safari采用的是SquirrelFish Extreme。编译器:编译过程主要分为“词法分析”,“语法分析”和“代码生成”。作用域(范围):根据名称...

    完整版《HTML5高级程序设计》2

    1.6.8 Monkeys、Squirrelfish和其他JavaScript引擎 19 1.7 小结 20 第2章 Canvas API 22 2.1 HTML5 Canvas概述 22 2.1.1 历史 22 2.1.2 canvas是什么 23 2.1.3 canvas坐标 23 2.1.4 什么情况下不用canvas 24 2.1.5 ...

    完整版《HTML5高级程序设计》4

    1.6.8 Monkeys、Squirrelfish和其他JavaScript引擎 19 1.7 小结 20 第2章 Canvas API 22 2.1 HTML5 Canvas概述 22 2.1.1 历史 22 2.1.2 canvas是什么 23 2.1.3 canvas坐标 23 2.1.4 什么情况下不用canvas 24 2.1.5 ...

    完整版《HTML5高级程序设计》5

    1.6.8 Monkeys、Squirrelfish和其他JavaScript引擎 19 1.7 小结 20 第2章 Canvas API 22 2.1 HTML5 Canvas概述 22 2.1.1 历史 22 2.1.2 canvas是什么 23 2.1.3 canvas坐标 23 2.1.4 什么情况下不用canvas 24 2.1.5 ...

    完整版《HTML5高级程序设计》3

    1.6.8 Monkeys、Squirrelfish和其他JavaScript引擎 19 1.7 小结 20 第2章 Canvas API 22 2.1 HTML5 Canvas概述 22 2.1.1 历史 22 2.1.2 canvas是什么 23 2.1.3 canvas坐标 23 2.1.4 什么情况下不用canvas 24 2.1.5 ...

    HTML5高级程序设计

    1.6.8 monkeys、squirrelfish和其他javascript引擎 19 1.7 小结 20 .第2章 canvas api 22 2.1 html5 canvas概述 22 2.1.1 历史 22 2.1.2 canvas是什么 23 2.1.3 canvas坐标 23 2.1.4 什么情况下不用canvas 24...

    HTML5高级程序设计.part5

    1.6.8 Monkeys、Squirrelfish和其他JavaScript引擎 19 1.7 小结 20 第2章 Canvas API 22 2.1 HTML5 Canvas概述 22 2.1.1 历史 22 2.1.2 canvas是什么 23 2.1.3 canvas坐标 23 2.1.4 什么情况下不用canvas 24 ...

    HTML5高级程序设计.part4

    1.6.8 Monkeys、Squirrelfish和其他JavaScript引擎 19 1.7 小结 20 第2章 Canvas API 22 2.1 HTML5 Canvas概述 22 2.1.1 历史 22 2.1.2 canvas是什么 23 2.1.3 canvas坐标 23 2.1.4 什么情况下不用canvas 24 ...

    HTML5高级程序设计.part1

    1.6.8 Monkeys、Squirrelfish和其他JavaScript引擎 19 1.7 小结 20 第2章 Canvas API 22 2.1 HTML5 Canvas概述 22 2.1.1 历史 22 2.1.2 canvas是什么 23 2.1.3 canvas坐标 23 2.1.4 什么情况下不用canvas 24 ...

    HTML5高级程序设计.part2

    1.6.8 Monkeys、Squirrelfish和其他JavaScript引擎 19 1.7 小结 20 第2章 Canvas API 22 2.1 HTML5 Canvas概述 22 2.1.1 历史 22 2.1.2 canvas是什么 23 2.1.3 canvas坐标 23 2.1.4 什么情况下不用canvas 24 ...

    HTML5高级程序设计.part3

    1.6.8 Monkeys、Squirrelfish和其他JavaScript引擎 19 1.7 小结 20 第2章 Canvas API 22 2.1 HTML5 Canvas概述 22 2.1.1 历史 22 2.1.2 canvas是什么 23 2.1.3 canvas坐标 23 2.1.4 什么情况下不用canvas 24 ...

    HTML5程序设计(第2版).[荷]Peter Lubbers(带详细书签).pdf

    1.6.8 Monkeys、Squirrelfish和其他JavaScript引擎 19 1.7 小结 21 第2章 Canvas API 22 2.1 HTML5 Canvas概述 22 2.1.1 历史 22 2.1.2 canvas是什么 23 2.1.3 canvas坐标 23 2.1.4 什么情况下不用canvas 23 ...

Global site tag (gtag.js) - Google Analytics