New feature in ECMAScript 2015
Yusuke Miyazaki
2016/7/3
Gee-Fes Kyoto @MTRL KYOTO
Proper Tail Calls
Slide 2
Slide 2 text
ECMAScript
Slide 3
Slide 3 text
ECMAScript 2015 (ES6)
• ECMA-262 Edition 6, released in June 2015
• Features: arrow functions / classes / promise /
let / const / template literals / generators /
proper tail calls etc…
• You can try some of them with recent
implementations or compilers (e.g. Babel,
Traceur)
Slide 4
Slide 4 text
ECMAScript 2016 (ES7)
• ECMA-262 Edition 7, released in June 2016
!!!!!!!!!"""""""""
• Minor update from ECMAScript 2015
• exponentiation operator **
• Array.prototype.includes
Implementation
• Implement factorial using recursive definition
• It’s natural & functional!!
"use strict";
function fact(n) {
if (n == 0) { return acc; }
return n * fact(n - 1); // Not tail call
}
fact(100); // 100!
Slide 8
Slide 8 text
Tail Call Implementation
• Rewrite previous code using tail call
• Function call is performed in return statement
"use strict";
function fact(n, acc) {
if (n == 0) { return acc; }
return fact(n - 1, n * acc); // Tail call
}
fact(100, 1); // 100!
Slide 9
Slide 9 text
Let’s try it
n Result Time [msec]
1,000 Infinity 0.36
10,000 Infinity 1.65
100,000
Maximum call stack size
exceeded.
14655.18
049&M$BQJUBO4BGBSJ
.BD#PPL1SP &BSMZ
$PSFJ6
???
Slide 10
Slide 10 text
Call Stack
Slide 11
Slide 11 text
Call Stack
• Call stack is used when
function is called
• Includes arguments, return
address, etc…
• Size is limited
→ We reached that limit
when we call fact(100,000)
ộ
n = 97
n = 98
n = 99
n = 100
ộ
Slide 12
Slide 12 text
Proper Tail Calls
Slide 13
Slide 13 text
Proper Tail Calls (PTC)
• If a tail call meets some conditions…
• strict mode, normal function or arrow
function, etc…
• ECMAScript 2015 requires that a call in tail
position will reuse the caller’s stack space!!
• Differs from tail call optimization
Slide 14
Slide 14 text
Pseudo-translation
"use strict";
function fact(n, acc) {
while (true) {
if (n == 0) {
return acc;
}
acc = n * acc;
n = n - 1;
}
}
"use strict";
function fact(n, acc) {
if (n == 0) {
return acc;
}
return fact(n - 1,
n * acc);
}
Slide 15
Slide 15 text
Benefit of PTC
• Unbounded number of consecutive tail calls
• Reduce stack size / memory footprint
• Performance improvements
• Less processing when returning value
• But maybe slower than for-loop
→ Better performance with beautiful code!
Slide 16
Slide 16 text
Let’s try it again!
n Result Time [msec]
1,000 Infinity 0.41
10,000 Infinity 1.84
100,000 Infinity 13.56
10,000,000 Infinity 106.07
049&M$BQJUBO4BGBSJ5FDIOPMPHZ1SFWJFX 4VQQPSUT15$
.BD#PPL1SP &BSMZ
$PSFJ6
Slide 17
Slide 17 text
Conclusion
• Proper Tail Call is one of the best feature in ES2015
• Natural, beautiful & high-performance code!
• Let’s try it with following implementations
• Safari Technology Preview
• WebKit Nightly Build
• XS6
Slide 18
Slide 18 text
Thank You for Listening!
• Reference
• http://www.ecma-international.org/
ecma-262/6.0/
• https://webkit.org/blog/6240/ecmascript-6-
proper-tail-calls-in-webkit/
• Demo
• https://ymyzk.github.io/ptc-example/