Code Renaissance is about building great teams and great software. By exploring best practices, team interactions, design, testing and related skills Code Renaissance strives to help you create the team and codebase that you've always wanted.

Clean up JSLint with LintBrushJS

Before I can talk about how LintBrushJS came into being, I first have to talk about JSLint.

I've been addicted to JSLint for some time now though I occasionally find it frustrating to use. Currently I'm doing maintenance on a lot of really big JavaScript files that have never been through JSLint. After clearing all the errors that stop the file from processing I inevitably end up with 200 to 400 errors.

Some of the errors that JSLint provides I consider really important but there are others that can wait (like all the == and != errors). Unfortunately its hard to sift through the less critical errors to find the ones I want. Also because JSLint doesn't give a count of the errors its impossible to know if any changes I make to the file introduce new errors.

That's why I created my first FireFox add-on LintBrushJS to clean up the JSLint output and make it more livable. LintBrushJS refactors the JSLint output by grouping like errors together and giving you a count of each group and a total count for page.

Here's some sample output:

Among other benefits this allows you to work through like errors at the same time and track your progress as your error count slowly makes its way to zero.

I'm a huge fan of Douglas Crockford, who created JSLint. Overtime he has worked to make JSLint more and more stringent about errors — an effort I wholeheartedly agree with. I have however, felt frustrated from time to time that those efforts have made my job more difficult, often when I have the least amount of time to spare. There are a lot of people that I know that shy away from JSLint for just those reasons. I hope that LintBrushJS helps make JSLint more manageable and helps it see wider adoption.

LintBrushJS started as a GreaseMonkey that I wrote with identical functionality (ironically this project was both my first GreaseMonkey script and my first Firefox add-on). When I finished the script I wanted to share it with others on my team and but distributing the script and having everyone install GreaseMonkey seemed a poor way to share it. So I decided to make it into an add-on. It was a fun experience that I'd recommend to others (and not so hard as I'd feared).

I hope you enjoy using LintBrushJS as much as I have (and to to Crockford, thanks for an awesome tool).