diff --git a/deep-js-stacks/README.md b/deep-js-stacks/README.md new file mode 100644 index 0000000..869394a --- /dev/null +++ b/deep-js-stacks/README.md @@ -0,0 +1,10 @@ +# deep-js-stacks + +This test case exists to show what happens to JS callstacks at around 256 frames tall. + +The known bug: the v8 sampling profiler only emits the _top-most_\* 256 callframes on the stack. + +\* Visually in the flamechart it's the bottom-most. + +top of flamechart +bottom of flamechart diff --git a/deep-js-stacks/app.js b/deep-js-stacks/app.js new file mode 100644 index 0000000..9ef9cce --- /dev/null +++ b/deep-js-stacks/app.js @@ -0,0 +1,46 @@ +// The problem manifests at a stack depth of 256, but startDemo and stall count as well. +const lowBound = 248; +const highBound = 256; +// Additionally, worth pointing out that the named functions (call250, call252, etc) may not appear at exactly that index in the stack. For extra debugging fun. :) + +const output = document.getElementById('output'); +let currentMaxDepth = 0; + +function stall() { + const start = Date.now(); + while (Date.now() - start < 0.5) {} +} + +function startDemo() { + const start = performance.now(); + + for (let maxDepth = lowBound; maxDepth <= highBound; maxDepth++) { + currentMaxDepth = maxDepth; + call0(); + } + for (let maxDepth = highBound; maxDepth >= lowBound; maxDepth--) { + currentMaxDepth = maxDepth; + call0(); + } + + const measure = performance.measure( + `stack-calling ${lowBound}-${highBound}`, + { start, end: performance.now() }, + ); + + output.textContent += `Total execution time: ${measure.duration.toLocaleString()}ms\n`; +} + +// Generate all the call functions +for (let i = highBound; i >= 0; i--) { + window[`call${i}`] = new Function(`return function call${i}() { + if (${i} > currentMaxDepth) return; + if (${i} === currentMaxDepth) stall(); + else call${i + 1}(); + + ${i % 4 === 0 ? `//# sourceURL=colorcall${i}.js \n` : ''} + }`)(); +} + +startDemo(); +document.querySelector('button').addEventListener('click', startDemo); diff --git a/deep-js-stacks/index.html b/deep-js-stacks/index.html new file mode 100644 index 0000000..7595c18 --- /dev/null +++ b/deep-js-stacks/index.html @@ -0,0 +1,11 @@ + + + + Generate icicles ~256 entries high + + + +

+    
+
+
diff --git a/index.html b/index.html
index 1d2263f..25a9d5e 100644
--- a/index.html
+++ b/index.html
@@ -10,6 +10,7 @@
 
  • basic-samples-stack
  • changing-resource-priority
  • console-timings
  • +
  • deep-js-stacks
  • forced-layout-main-thread
  • gpu-tasks
  • idle-callback-time