DevTools tips — day 9: timing the console
part of the “Advent calendar for front-end developers” series
Over the 24 days leading to the holidays I am publishing short articles with tips on how to use DevTools in more performant and fun way. Yesterday we’ve played with the versatile color picker tool and today we’ll have 2 short tips about working with time:
26. Timestamp your logs
If you want to take a note of the exact time an event happened in your application, turn on timestamps. You can do it from the Settings screen (find it in the DevTools’
⋮ dropdown or press
F1) or using Commands Menu.
27. Measure execution times
Instead of displaying a timestamp on everything, you may be more interested in a time span between specific points in your script.
For such a case we can employ a pair of useful
console.time()— starts a timer
console.timeEnd()— ends counting time and logs the result in the console
If you want measure multiple things at once, provide different labels into these methods (e.g.
As usual, if you’ve learned something new, please:
→ clap 👏 button below️ so more people can see this
→ follow me on Twitter (@sulco) so you won’t miss future posts:
Tomek Sułkowski (@sulco) | Twitter
Also, the 10th day is already published, read it here: