console.log timestamps in Chrome?
Try this:
console.logCopy = console.log.bind(console);
console.log = function(data)
{
var currentDate = '[' + new Date().toUTCString() + '] ';
this.logCopy(currentDate, data);
};
Or this, in case you want a timestamp:
console.logCopy = console.log.bind(console);
console.log = function(data)
{
var timestamp = '[' + Date.now() + '] ';
this.logCopy(timestamp, data);
};
To log more than one thing and in a nice way (like object tree representation):
console.logCopy = console.log.bind(console);
console.log = function()
{
if (arguments.length)
{
var timestamp = '[' + Date.now() + '] ';
this.logCopy(timestamp, arguments);
}
};
With format string (JSFiddle)
console.logCopy = console.log.bind(console);
console.log = function()
{
// Timestamp to prepend
var timestamp = new Date().toJSON();
if (arguments.length)
{
// True array copy so we can call .splice()
var args = Array.prototype.slice.call(arguments, 0);
// If there is a format string then... it must
// be a string
if (typeof arguments[0] === "string")
{
// Prepend timestamp to the (possibly format) string
args[0] = "%o: " + arguments[0];
// Insert the timestamp where it has to be
args.splice(1, 0, timestamp);
// Log the whole array
this.logCopy.apply(this, args);
}
else
{
// "Normal" log
this.logCopy(timestamp, args);
}
}
};
Outputs with that:
P.S.: Tested in Chrome only.
P.P.S.: Array.prototype.slice
is not perfect here for it would be logged as an array of objects rather than a series those of.
You can use dev tools profiler.
console.time('Timer name');
//do critical time stuff
console.timeEnd('Timer name');
"Timer name" must be the same. You can use multiple instances of timer with different names.
I originally added this as a comment, but I wanted to add a screenshot as at least one person could not find the option (or maybe it was not available in their particular version for some reason).
On Chrome 68.0.3440.106 (and now checked in 72.0.3626.121) I had to
- open dev tools (F12)
- click the three-dot menu in the top right
- click settings
- select Preferences in the left menu
- check show timestamps in the Console section of the settings screen
In Chrome, there is the option in Console Settings (Either press F1 or select Developer Tools -> Console -> Settings [upper-right corner] ) named "Show timestamps" which is exactly what I needed.
I've just found it. No other dirty hacks needed that destroys placeholders and erases place in the code where the messages was logged from.
Update for Chrome 68+
The "Show timestamps" setting has been moved to the Preferences pane of the "DevTools settings", found in the upper-right corner of the DevTools drawer: