console.time & console.timeEnd
The console.time and console.timeEnd methods allow developers to time any routine and get a duration in milliseconds. Since JavaScript performance is becoming increasingly important, it's good to know basic techniques for benchmarking routines. One of the most basic benchmarking tools is console.time with console.timeEnd.
console.time starts the time and console.timeEnd stops the timer and spits out the duration:
// Kick off the timer
console.time('testForEach');
// (Do some testing of a forEach, for example)
// End the timer, get the elapsed time
console.timeEnd('testForEach');
// 4522.303ms (or whatever time elapsed)
Passing a timer name as the first argument allows you to manage concurrent timers. The console.timeEnd call immediately spits out the elapsed time in milliseconds.
There are more advanced techniques for performance testing and benchmarking but console.time/timeEnd provide a quick manual method for speed testing!
![JavaScript Promise API]()
While synchronous code is easier to follow and debug, async is generally better for performance and flexibility. Why "hold up the show" when you can trigger numerous requests at once and then handle them when each is ready? Promises are becoming a big part of the JavaScript world...
![9 Mind-Blowing Canvas Demos]()
The <canvas> element has been a revelation for the visual experts among our ranks. Canvas provides the means for incredible and efficient animations with the added bonus of no Flash; these developers can flash their awesome JavaScript skills instead. Here are nine unbelievable canvas demos that...
![Morphing Elements Using MooTools and CSS]()
Morphing an element between CSS classes is another great trick the MooTools JavaScript library enables you to do. Morphing isn't the most practical use of MooTools, but it's still a trick at your disposal.
Step 1: The XHTML
The block of content that will change is...
![Create Snook-Style Navigation Using MooTools]()
Jonathan Snook debuted a great tutorial last September detailing how you can use an image and a few jQuery techniques to create a slick mouseover effect. I revisited his article and ported its two most impressive effects to MooTools.
The Images
These are the same...
no necessary label, the default label is
default