একটা recursive function-এর call stack সত্যিই বাড়তে আর কমতে দেখুন, প্রতিটা frame-এ আসল argument আর আসল return value দেখানোসহ — আর ঠিক যে মুহূর্তে এটা unwind করে একটা উত্তরে পরিণত হয়।
Programming পাঠ দেখুনএটা আপনার আসল কোড একটা sandboxed iframe-এ চালায় — আপনি যে stack দেখছেন সেটা সত্যিই call কতটা গভীরে গিয়েছিল তার হিসাব, হাতে আঁকা animation না। Preset-গুলো একটা ছোট trace() helper দিয়ে আগে থেকে wrap করা আছে যাতে argument আর return value ধরা যায়; নিজের কোড চেষ্টা করতে "Edit code"-এ যান, একই wrapping অনুসরণ করে।
let sumTo;
sumTo = trace('sumTo', function (n) {
if (n === 0) return 0;
return n + sumTo(n - 1);
});
sumTo(5);একটা function-এর আসল argument আর return value পাওয়া — শুধু নাম না — traced function-কে একটা ছোট trace() helper-এ wrap করতে হয়, যা তিনটা preset-ই আগে থেকে করে (একটা let x; x = trace("x", function (n) {...}) pattern, যাতে function-এর নিজের recursive call traced version দিয়েই যায়, নিজের একটা untraced ভেতরের কপি দিয়ে না)। এই কারণে এই টুল preset আর একটা editable-code বিকল্প নিয়ে আসে, Event Loop ভিজুয়ালাইজারের মতো যেকোনো free-form কোড auto-trace করার চেষ্টা করার বদলে — যেকোনো call site নিরাপদে rewrite করতে একটা পূর্ণাঙ্গ JS parser দরকার হতো, আর এই টুলের সেটা নেই। Call stack প্যানেল, order আর দেখানো প্রতিটা argument/return value আসল, আপনার কোড সত্যিই চলার সময় রেকর্ড করা — demo-র জন্য বানানো না।