Be Prepared before writing code[9:35]

Understand how V8 optimzes Javascript;

Write code mindfully;

Learn you tools and how they can help you;

Be Prepared - Hidden Classes[10:30]

Hidden Classes Make JavaScript Faster.

(注:Hidden Class 可以理解为VM内部实现对描述抽象类的描述,共享隐藏类才能让VM更高效)

Limit Compile-time type information

It's expensive to reason about JavaScript types at compile time...

  • V8 internally creates hidden classes for objects at runtime.
  • Objects with the same hidden class can use the same optimzed generated code.

Initialize all object members in constructor functions;

Always Initialize members in the same order;

(If you add members in different orders, you create a different tree of hidden classes.

And at the end, you'll have objects with two different hidden classes that can't use the same optimized code)

Be Prepared - Numbers[15:30]

We use a technique called tagging. So inside of V8 we pass around values of 32-bit numbers and objects.

But we want to be able to use the same 32 bits to represent both. And that way we can have one code path that can handle, in many cases, the objects and integers. So what we do is we use the bottom bit.

And each of the values have s special meaning. If the bit is se, it's an object pointer. If it's clear, it's what we call small integer or smi. And that's a 31-bit signed integer. Now if you have a numeric value that you're passing around, assigning to a member that is bigger -it's a numeric value that's bigger than 31 signed bits - then it doesn't fit in one of these smis. And we have to create what's called a box for it. We box the number. We turn it into a double and we create a new object to put that number inside of it. And what follows from that is the next speed trap to avoid, which is make sure, whenever possible, you use 31-bit signed numbers for performance critical calculations.

Prefer numberic values that can be represented as 31-bit signed integers.

Be prepared - Arrays[17:25]

  • Fast Elements: linear storage for compact key sets.
  • Dictionary Elements: hash table storage otherwise.

Use contiguous keys starting at 0 for Arrays. (

Don't pre-allocate large Arrays(e.g. > 64K elements) to their maxium size, instead grow as you go.

Don't delete elements in arrays, especially numberic arrays.

Double Array Unboxing

  • Array's hidden class tracks elements types
  • Arrays contraining only doubles are unboxed
  • Unboxing causes hidden class change

Initialize using array literals for small fixed-sized arrays

Preallocate small arrays to correct size before using them

Don't store non-numeric values(objects) in numeric arrays

Be prepared - Full Compiler[26:36]

V8 has tow compilers

  • "Full" compiler can generate good code for any Javascript
  • Optimizing compiler produces great code for most JavaScript

"Full" compiler Starts Executing Code ASAP

  • Quickly generates good but not great JIT code
  • Assumes(almost) nothing about types at compilation time
  • Uses Inline Caches(or ICs) to refine knowledge about types while program runs

Inline Caches(ICs) handle Types Efficiently

  • Type-dependent code for operations
  • Validate type assumptions first, then do work
  • Change at runtime via backpathcing as more types are discovered

Monomorphic Better Than Polymophic

  • Operations are monomophic if the hidden class is always the same
  • Otherwise they are polymorphic
function add(x,y) {
 return x + y;

add(1,2);         //+ in add is monomorphic
add("a", "b")    //+ in add becomes polymorphic

Prefer monomorphic over polymorphic whenever is possible.

Type Feedback Makes Code Faster

  • Types taken from ICs
  • Operations speculatively get inlined
  • Monomophic functions and constructors can be inlined entirely
  • Inlininig enables other optimizations

Logging What Gets Optimized

d8 --trace-opt prime.js

logs names of optimized functions to stdout

Not Everything Can Be Optimized

Some features prevent the optimizing compiler from running(a "bail-out")

Avoid the speed trap

Optimizing compiler "bail-out" on functions with try{} catch{} blocks.

Maximizing Performance With Exceptions

function perf_sensitive() {
  //Do performance-sensitive work here
} catch(e) {
 //handle exceptions here

How to Find Bailouts

d8 --trace-bailout prime.js

logs optimizing compiler bailouts

Invalid assumptions lead to deoptimization[37:55]


  • ...throws away optimized code
  • ...resumes execution at the right place in "full" compiler code
  • Reoptimization might be triggered again later, but for the short term, execution slows down.

Passing V8 Options to Chrome

"/Applicaitons/Google Chrome.app/Contents/MacOS/Google Chrome" \--js-flags="--trace-opt --trace-deopt --trace-bailout"

Avoid the speed trap

Avoid hidden class changes in functions after they are optimized

Identify and Understand[39:50]

"Identify and Understand" for V8

  • Ensure problem is JavaScript
  • Reduce to pure JavaScript(no DOM!)
  • Collect metrics
  • Locate bottleneck(s)

Prime Generator -- Profile It

%out/ia32.release/d8 prime.js --prof


using teh built-in sampling profiler

  • Takes sampe every millisecond
  • Writes v8.log

What to expect from the primes Code

function Primes() {
this.addPrime = function(i) {
  this.primes[this.prime_count++] = i;

this.isPrimeDivisible = function(candidate) {
  for(var i = 1; i <= this.prime_count; ++i) {
    if(candidate % this.primes[i]) == 0) {
      return true;
  return false;

function main() {
  p = new Primes();
  var c = 1;
  while (p.getPrimeCount() < 25000) {
    if(!p.isPrimeDivisible(c)) {

Prediction: Most Time Spent in main

  • All properties and functions monomorphic
  • All numeric operations are SMIs
  • All functions can be inlined
  • No deoptimizations or bailouts

(输出省略 @42:50)

Can you spot the bug?

this.isPrimeDivisible = function(candidate) {
  for(var i = 1 ; i <= this.prime_count; ++i) {
    if (candidate % this.primes[i] == 0) return true;  
  return false;

(Hint: primes is an array of length prime_count)

% out/ia32.release/d8 primes-2.js --prof


JavaScript is 60% faster than C++


% g++ primes.cc -o primes
% time ./primes

real  0m2.955s
user  0m2.952s
sys   0m.001s


% .js

real 0m1.829s
user 0m1.827s
sys  0m0.010s

JavaScript is 17% slower than optimized C++

Fix What Matters[49:59]

Optimize Your Algorithm

this.isPrimeDivisible = function(candidate) {
  for(var i = 1 ; i < this.prime_count; ++i) {
    var current_prime = this.primes[i];
    if(current_prime*current_prime > candidate){
      return false;
    if (candidate % this.primes[i] == 0) return true;  
  return false;

Final Results


That's more than a 350x Speed-up!

Keep Your Eyes on the Road

  • Be prepared
  • Identify and Understand the Crux
  • Fix What matters

JavaScript 性能优化 --By Google V8 Team Manager的更多相关文章

  1. JavaScript性能优化

    如今主流浏览器都在比拼JavaScript引擎的执行速度,但最终都会达到一个理论极限,即无限接近编译后程序执行速度. 这种情况下决定程序速度的另一个重要因素就是代码本身. 在这里我们会分门别类的介绍J ...

  2. javascript性能优化-repaint和reflow

    repaint(重绘) ,repaint发生更改时,元素的外观被改变,且在没有改变布局的情况下发生,如改变outline,visibility,background color,不会影响到dom结构渲 ...

  3. 摘:JavaScript性能优化小知识总结

    原文地址:http://www.codeceo.com/article/javascript-performance-tips.html JavaScript的性能问题不容小觑,这就需要我们开发人员在 ...

  4. Javascript 性能优化的一点技巧

    把优秀的编程方式当成一种习惯,融入到日常的编程当中.下图是今天想到的一点Javascript 性能优化的技巧,分享一下,抛砖引玉.

  5. JavaScript 性能优化技巧分享

    JavaScript 作为当前最为常见的直译式脚本语言,已经广泛应用于 Web 应用开发中.为了提高Web应用的性能,从 JavaScript 的性能优化方向入手,会是一个很好的选择. 本文从加载.上 ...

  6. JavaScript性能优化:度量、监控与可视化1

    HTTP事务所需要的步骤: 接下来,浏览器与远程Web服务器通过TCP三次握手协商来建立一个TCP/IP连接,类似对讲机的Over(完毕) Roger(明白) TCP/IP模型 TCP即传输控制协议( ...

  7. JavaScript性能优化 DOM编程

    最近在研读<高性能JavaScript>,在此做些简单记录.示例代码可在此处查看到. 一.DOM 1)DOM和JavaScript 文档对象模型(DOM)是一个独立于语言的,用于操作XML ...

  8. javascript性能优化:创建javascript无阻塞脚本

    javaScript 在浏览器中的运行性能,在web2.0时代显得尤为重要,成千上万行javaScript代码无疑会成为性能杀手, 在较低版本的浏览器执行JavaScript代码的时候,由于浏览器只使 ...

  9. javascript性能优化总结一(转载人家)

    一直在学习javascript,也有看过<犀利开发Jquery内核详解与实践>,对这本书的评价只有两个字犀利,可能是对javascript理解的还不够透彻异或是自己太笨,更多的是自己不擅于 ...


  1. Linux下的C Socket编程 -- 获取对方IP地址

    Linux下的C Socket编程(二) 获取域名对应的IP地址 经过上面的讨论,如果我们想要连接到远程的服务器,我们需要知道对方的IP地址,系统函数gethostbyname便能够实现这个目的.它能 ...

  2. css中左侧固定,右侧自适应

    谈谈我开始出来工作时候的一道面试题吧 当初我记得在太平洋网络面试的时候,面试官给我出了这么一道题: 有一个外层的div 中间有左右两个div 要求左侧的div 1.只告诉你宽度;       2.只告 ...

  3. Android应用第一次安装成功点击“打开”后Home键切出应用后再点击桌面图标返回导致应用重启问题

    最近项目中遇到一个问题,用户第一次安装应用在系统的安装器安装完成界面有“完成”和“打开”两个按钮. 当用户点击“打开”按钮进入用户注册页面进行手机号验证码发送和验证码输入等操作界面,若此时用户点击Ho ...

  4. 某app客户端数字签名分析


  5. SkipList算法实现

    SkipList是一种快速查找链表,链表元素的是有序的.由W.Pugh发明于1989年.其算法复杂度如下: Average Worst caseSpace O(n) O(n log n)Search ...

  6. c# 计算1-100之间的所有质数(素数)的和

    求1-100之间的所有质数(素数)的和: 所以先必须知道什么是质数? 一个数是不是素数   “素数”是指除了能被1和自身整除外,不能被任何其它整数整除的自然数. 然后知道有哪些是质数: 记忆的方法: ...

  7. 在maven项目中使用mybatis-generator-maven-plugin生成mybatis代码

    项目整体的目录结构如下: pom.xml如下: <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi=&q ...

  8. Android Studio 学习 - 基本控件的使用;Intent初学

    Android Studio学习第三天. 今天主要学习 1. RadioButton.CheckBox.RatingBar.SeekBar等基础控件的使用. 结合Delphi中相类似的控件,在这些基本 ...

  9. SQL Server 2008 的gis函数

    居然不知道sql有gis函数,孤陋寡闻了 https://msdn.microsoft.com/zh-cn/library/bb933904.aspx   STContains(geometry 数据 ...

  10. C++中的INL

    inl文件介绍 inl文件是内联函数的源文件.内联函数通常在C++头文件中实现,但是当C++头文件中内联函数过多的情况下,我们想使头文件看起来简洁点,能不能像普通函数那样将内联函数声明和函数定义放在头 ...