[ ← blog / css ](/) Nov 23, 2012  ·  \#css  ·  1 min read 

# jsFiddle for your debugging needs



 We all love JavaScript and what it can do, especially the various frameworks created to make the life of a developer easier. However, with scripting comes debugging, and debugging can take a lot of time. We all have our own ways of going about this process, but a few months ago at an interview I was introduced to [jsFiddle](http://jsfiddle.net/ "jsFiddle").jsFiddle allows you to select your favorite JavaScript framework - or import a link to your own script file - and debug the code. You're presented with four blocks: one for HTML, one for CSS, and one for your JavaScript. The fourth box is reserved for your output. Simply input your HTML and CSS, write up your jQuery or MooTools and hit Run. It will execute your script and let you play with the results. I love jsFiddle, so do my refresh keys. Trying to find that "perfect" speed to have an HTML element fade in or out? Your life just got that much simpler. There are two other awesome features to mention: TidyUp and JSLint. TidyUp is self explanatory - it'll format your code. [JSLint](http://www.jslint.com/ "JSLint") is a tool to check the quality of your scripting. 

  ![](/themes/custom/mglaman/images/headshot.webp)Thanks for reading

I write about Drupal, PHP, and the quiet infrastructure behind large sites — caching, config, and testing. New posts land every week or two.

 [Subscribe via RSS →](/rss.xml) [About me →](/about-me) 

 



 

  [← Older

JCM Solutions

 ](/blog/jcm-solutions) [Newer →

Optimize your website

 ](/blog/optimize-your-website)