Goal: See an over time fast updating value without flooding the logs.

When a computed value is often updated, as when using requestAnimationFrame, one often want to see the evolution of that value over time. Using console.log might work but if you log other values at the same time, those are hidden in the log flow which make analyzing them very difficult.

Chromium devtools now have implemented live expressions, a feature not related to the console API but which facilitate this kind of workflow. Unfortunately it falls short by not providing a way to emit live expression values from any part of the code. One can only log live expressions from global values.

It would be nice to have a console.live method that would populate, not the log panel, but a live expression UI.

This method could open new ways of consuming logs like displaying a graph of the updated value over time.

As discussed bellow, a new method on the console API is not very practicable. So I propose to add a new formatting specifier for this use case.

%u (for update) could be used to indicate a value changing over time.

Example:

console.log('%u', x); // Would notify the agent that the value x is going to be logged several times
console.log('%uLabel', x); // Same but binding a `Label` to the updated value
console.log('%u%f', x); // With float
console.log('%u%i', x); // or integer modifier the value could be interpreted in a more a advanced UI like a timeline

A user agent then could interpret the log specifically and display the value in a dedicated UI (e.g. like in the live expression of the Chrome DevTools). An agent not implementing the %u specifier would just ignore it.