This page compares
Open the browser developer tools (F12).
No output will be visible until you enable logging. To enable
logging in both
You can do this using the developer tools GUI (tab Application in
Chrome), or in the Console tab run this command:
or you can press the button below:
Log some messagesPress the buttons to log messages with both loggers:
You should get output like this:
ulog monitors the config
You may notice that
debug is not producing any output,
ulog is. That's because
the configuration at runtime but
debug doesn't. So to get
debug to pick up our configuration change, reload the
page (F5). Then, press both buttons again. This time, we can see
ulog output side by side:
The output of
debug is very similar.
Both loggers add the name of the logger to the message and both loggers
show some timing information. Also, both loggers use colors to produce
more clear output. But, there are actually more differences here than
initially meet the eye.
ulog preserves the callstack
One big difference between
is marked with arrows in the screenshot.
the callstack, meaning file names and line numbers shown in the
console point to the client code. This is in big contrast to
debug, which injects it's own formatting function in
the callstack, meaning all file names and line numbers point to that
function in the
debug minified source file. Not very
ulog has configurable formatting
debug only allows some tweaks to it's formatting.
ulog allows you to take full control of formatting.
You can change the format for all or some loggers using config
option log_format. For example, let's try adding the time to the
log_format=time lvl name perf in the
devtools or press the button below: