ndb describes itself as "an improved debugging experience for Node.js, enabled by Chrome DevTools".
It enables some of the best features of Chrome DevTools to become an ally when debugging Nodejs applications.
In a previous blog post, we went through debugging through VSCode. In this post, I will show how the profiler from ndb can help you identify and address bottlenecks where possible.
Install ndb globally, initialise a new project and create a new file for the example:
package.json, update the scripts to include a
Our first example
We are going to calculate the Fibonacci number and code it in a way that costs
2^n where the time to calculate doubles the more we need to recursively call the number (excluding the base case).
ndb-example.js, add the following:
We are going to run the same calculation to get the Fibonacci number for 40 (102334155). To do so, start-up ndb by running
ndb . in the console at the base directory. You should be faced with the following:
Initial ndb state
On the left-hand panel under
NPM Scripts, you will see our
start script is available. Hovering over it we can see buttons highlight that enables us to "play" or "record" the script. Given that our
start script will run through the
ndb-example.js file, we can hit record to see what happens during execution:
Running expensive calculation twice
On the profiler, it shows us the two different call stacks under
calcFibonacci40, with the two largest
expensiveCalc directly underneath being the two calls that we made from
calcFibonacci40. Both cost me 1.49 seconds on this hardware each! In fact, as our code is at the moment, if we continually call
calcFibonacci40, that expensive calculation will always be recalculated!
So what can we do? We will memoise the function.
Memoizing the function
Memoizing the function will "cache" our previous results and make any calls with the same arguments return back what is stored in the cache instead of re-calculated that expensive calculation.
Let's implement this by updating our code:
Here we add a simple memoisation function that essentially uses closures to "maintain" a cache and return the original function with the argument passed. I won't speak too much to the memoisation, but more information can be found on this blog post.
Finally, we replace the expensive function with the memoized version of the function.
To add dramatic effect, we are now going to iterate over the function 100 times. On my current machine, I would be expecting the function to take about 2 minutes to run without memoisation!
Let's re-record the performance and see what happens.
Memoized expensive call
Analysing the performance, we see that we still made our expensive calculation (and it still took 1.49 seconds), but we also see in our console that we logged the answer 100 times? What happened?
If we zoom into the very end, we see that
calcFibonacci40 has a direct child of
console.log at the tail-end of the call!
Memoized remaining calls
This is our memoisation at work! Since we are continually passing the same argument, our cache is picking this up and we are no longer calling
expensiveCalc to fetch the answer!
We can actually see the while the first call took 1.49 seconds, the remaining 99 calls took a total of 14.69ms! As far as performance goes, this is a great success!
In today's post, we installed ndb and used to help profile and pinpoint expensive calculations.
Finally, we ended by memoizing the function and visually seeing our improvements!
ndb is a great debugging tool to add to your tool belt, particularly when debugging performance and memory issues.
Resources and further reading
Image credit: Sigmund
See how you can get started with the VSCode debugger for Node.js applications
See how you can dynamically create UIs based on React State using dynamic imports, Next.js 10 and React State
Have you ever wanted to build a UI Component Library with TypeScript and React? This blog post will take you through a straightforward set up that uses the bare minimum to get a working component library that you can re-use across your different React projects.
1,200+ PEOPLE ALREADY JOINED ❤️️
Get fresh posts + news direct to your inbox.
No spam. We only send you relevant content.