![]() ![]() In my opinion, using console.table() for nested arrays is the best use case. ![]() When logging Arrays as well, the results are more elegant and much easier to understand than direct console log. With traditional console.log() the results in the console looks like this:īut if you use console.table(), the console shows all the data in a very clear manner. In many cases, the log output of arrays or objects data is very ugly and hard to understand. This filter is turned off by default so that all the logs will be hidden until ‘Verbose’ is turned on. Console debug allows you to hide all the logs in the console unless the ‘Verbose’ level of logs are enabled from the ‘All levels’ filter. But if you still want to track logs from your code and don’t want the general public to see it, use bug(‘Found Error 1’). When your application is in the production phase, it’s better not to show errors and your logs to the general public. Keep logs private with bug(‘Found Error 1’) It gives a clear picture of all the functions that were used along with its location.Ħ. Using ace() can be very helpful to identify the stack of a statement. Sometimes these libraries can be very complex and hard to understand. If you use libraries in your code, it is very likely that you have run into errors that involve fixing something in the library’s code. TIP: Using unt() along with oup() will be a good combination while dealing with nested loops 5. In order to reset the counter back to 0 just use untReset() or untReset(‘Loop 1’) This will help you to identify them in the mess of all other loops. If you’re tracking iterators in a nested loop, you can add a label like this: unt(‘Loop 1’). Here’s what the results should look like: In these scenarios, it’s better to use unt() in the loop, then to console log the iterator. When it comes to debugging loops, I catch myself just console logging the iterator to keep track of the other logs from the loop. In here, you can use the same console log command after completion of each stage.Ĥ. If the function you’re tracking has multiple stages and requires you to log time after completing each stage, you can use the following code:Ĭonsole.log(‘Your function took ‘ + (Date.now() – start) + ‘ millis’) Like this: console.time(‘function foo’), and to end them use: console.timeEnd(‘function foo’). To avoid confusion between which timer was started and ended, you can attach a label to the timers when you start them. In some cases, you’ll have a bunch of timers running together for multiple functions. The time between those two commands will automatically be output in milliseconds. Use console.time() to start the timer and use console.timeEnd() to end the timer. If you’re trying to optimize your functions to return data quickly, you should use this amazing console hack instead of the typical setTimeout() functions. Getting things served to users quickly is amazing for UX. Improve UX using console.time() & console.timeEnd() If you want them to be collapsed and hidden use oupCollapsed() instead.ģ. Just using oup() will give you an uncollapsed view of the logs. This will group all of your logs into a group, that way it doesn’t get mixed up with the rest of the logs. In these situations, it’s a good choice to use oup(). It gets hard to know where each of the logs came from. All of these console logs can get very unorganized. Sometimes when you’re debugging statements within functions, you console log every stage of those functions. This will make higher priority issues stand out from the rest of the output: A better way to output errors and warnings is to use console.warning() and console.error(). Typical console.log() gets the job, but sometimes, when you use it too often, the important stuff can get lost in the giant output of every message type – from critical errors to standard reminders. I bet you’re using console log as a debugger for your web app projects. Output errors using console.warning() & console.error() Here are 10 of the top browser console hacks that will make you (or your dev’s) life much easier: 1. While these two are the most common uses, that’s just a fraction of what the console is capable of. Still, most developers just use it to search for syntax errors and console logging. ![]() The console is arguably the most used tool that a developer uses to debug their code. If you’re developing any kind of web-based project and your code isn’t working as planned (which is most of the time) the first place you’d check is your browser console. So what about finding ways to improve our productivity when we’re coding? We try all kinds of things to boost our productivity from using productivity apps like Asana, Brief or using the 2-Minute rule, to bringing an entire garden to work. Productivity in the workplace is always a major concern. ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |