console.group

Today in the office I started working on a redesign of our subscriber targeting system. Because of the number of publications and different options available, the best way to work with this is using promises in javascript. Awesome technique to use, if you haven't already started using them, take the time to learn them. It will change the way you program in JavaScript forever.

one of the drawbacks to using promises however is the use of console.log. Because all actions can become or are outright asynchronous logging can become something of an unordered nightmare. So before I started too deep into this rebuild, I decided to look into improved console abilities. this is where I found this: Using the Console.

// your code goes here
console.group("Foo");  
console.log("Foo");  
console.log("Bar");  
console.groupEnd();  

When I then encapsulate console.group into my plugin, I can force the addition of console.time as well. this means that I can now quickly scan my console log for bottlenecks and have all functionality grouped together. This is designers dream so far as I have used it.

// ...
    logGroupStart: function(_name) {
        var _this = this;
        if (!_name) _this.log("Must Name the Group","error");
        if (_this.settings.logging) {
            console.groupCollapsed(_name);
            _this.logTimerStart(_name);
        }
    }, // close _this.logGroupStart
    logGroupEnd: function(_name) {
        var _this = this;
        if (!_name) _this.log("Must Name the Group","error");
        if (_this.settings.logging) {
            _this.logTimerEnd(_name);
            console.groupEnd();
        }
    }, // close _this.logGroupEnd
// ...
}