JavaScript: How to log execution times to your browser console

Posted About 10 years ago. Visible to the public.

If you are trying to inspect timings in JavaScript, you can use console.time and console.timeEnd which will write to your browser console.

Example:

console.time('lengthy calculation');
lengthyCalculation();
console.timeEnd('lengthy calculation');

lengthy calculation: 1.337ms

Note that this allows using console.timeEnd in another context which is helpful when you are doing things asynchronously, or just in different places.

Works in all browsers, including recent Internet Explorers. For older IEs, you may activate Firebug Lite to get these commands.

Arne Hartherz
makandra.com
Say thanks
Last edit
Over 8 years ago
Dominik Schöler
License
Source code in this card is licensed under the MIT License.

Related cards:

How to: Apache logs on a daily basis without logrotate

If you want to have a new log file every day automatically, but avoid using logrotate, the CustomLog directive is your friend:

CustomLog "|/usr/sbin/rotatelogs /opt/www/awesome-project/log/access.%Y-%m-%d.log 86400" combined

Adding that ...

How to create giant memory leaks in AngularJS (and other client-side JavaScript)

This guide shows how to create an AngularJS application that consumes more and more memory until, eventually, the browser process crashes on your users.

Although this guide has been written for Angular 1 originally, most of the advice is relevant...

Split your parallel tests by execution time and keep execution logs up to date

Both knapsack and parallel_tests have the option to split groups by historic execution time. The required logs for this might be outdated since you manual...

Invoices: How to properly round and calculate totals

While it might seem trivial to implement an invoice that sums up items and shows net, gross and vat totals, it actually involves a lot of rules and caveats. It is very easy to create invoices where numbers don't add up and a few cents are missing....

How to make your application assets cachable in Rails

Note: Modern Rails has two build pipelines, the asset pipeline (or "Sprockets") and Webpacker. The principles below apply for both, but the examples shown are for Sprockets.

Every page in your application uses many assets, su...

How to emulate simple classes with plain JavaScript

If you want a class-like construct in JavaScript, you can use the module pattern below. The module pattern gives you basic class concepts like a constructor, private state, public methods.

Since the module pattern only uses basic JavaScript, your...

Customize tokenization of the MySQL FULLTEXT parser

The way MySQL's FULLTEXT tokenizer splits text into word tokens might not always be what you need. E.g. it splits a word at period characters.

Since the tokenizer has near-zero configuration options (minimum word length and stopwords list), you n...

How to rotate log files explicitly

Usually, the logrotate service takes care of renaming log files each night or so to avoid logs becoming huge. That will rename your.log to your.log.1, the next time to your.log.2.gz, etc. Here is how to make that happen out of band (you sh...

How to make Rational#to_s return strings without denominator 1 again

The way Rational#to_s works on Ruby has changed from Ruby 1.9 on. Here is how to get the old behavior back.

You may want this for things where Rationals are being used, like when subtracting Date objects from one another.

What's happening?...

Useful tricks for logging debugging information to the browser console

During debugging you might pepper your code with lines like these:

console.log('foo = ' + foo + ', bar = ' + bar)

I recommend to use [variable interpolation](https://makandracards.com/makandra/30113-the-developer-console-can-do-more-than...

Posted by Arne Hartherz to makandra dev (2014-03-17 14:05)
This website uses short-lived cookies to improve usability.
or learn more