Logging Timing Data to the Console

Share this video with your friends

Send Tweet
Published 6 years ago
Updated 4 years ago

Learn to use console.time with console.timeEnd to get accurate timings of operations in javascript. This tool can help with javascript profiling and performance optimization, and knowing how to use the console to do it means you don't have to pollute your codebase with timers and placeholders.

[00:00] Something we do a lot when we're profiling our applications, trying to make sure that we've optimized. We know how long everything takes to run. We want to figure out just the durations of the various things we're doing. It can be helpful to time how long something took. Let's say we're going to create an array and we're going to add 10 million objects to that array. Say array.push this new object.

[00:34] I want to know how long this is going to take to do. This is a great place to use one of the additional utility methods on the console. Rather than manually storing the start time and the end time and then doing our own duration computation, we can say console.time, create objects.

[00:58] Then, down here, console.timeend, create objects. As long as we're using the same key, it doesn't matter what the key is. By saying console.time, we've created a timer with this key. Until we call console.timeend with the same key, it's just going to keep counting. Then, when we call console.timeend, it's going to spit out a report for us.

[01:22] You see what that looks like here. It's running. You can see that's the label and it took about three seconds in order to create these 10 million items and push them into our array.