Wer HTML erlernen, mit CSS experimentieren oder eine Javascript Funktionalität testen möchte, der braucht dafür heutzutage nicht unbedingt ein neues Projekt anlegen, Bibliotheken herunterladen oder eine Entwicklungsumgebung starten. Eine Vielzahl web-basierter Entwicklungstools wie JS Bin, CodePen und Thimble ermöglichen es dem Entwickler Quellcode direkt im Browser zu entwickeln und auszuführen.

JSFiddle ist der „Urvater“ Browser-basierter Entwicklungsumgebungen. Die Seite besteht hauptsächlich aus vier weißen Panels für HTML, CSS, Javascript (alle drei Eingabefelder) und dem Ausgabefeld Result. Der Aufbau entspricht dem Ansatz, Struktur (HTML), Design (CSS) und Verhalten (JavaScript) möglichst voneinander zu trennen und in eigene Dateien aufzuteilen.

Die Seitenleiste am linken Rand bietet zusätzliche Einstellungsmöglichkeiten. So lässt sich u.a. der HTML-Doctype ändern, zwischen CSS und SCSS wählen, die bevorzugte Script-Sprache wie jQuery oder AngularJS auswählen und beliebige externe Ressourcen direkt einbinden. Die Formatierungsfunktion für den Quellcode und die Analyse durch JSHint ermöglicht es dem Nutzer die Übersicht zu behalten und Fehler im Javascript leichter zu finden.

Bei Seiten wie JSFiddle.net steht vor allem der Community Gedanke im Vordergrund. Fiddles können daher gespeichert und über einen permanenten Link für andere Entwickler zugänglich gemacht oder auf in andere Webseiten eingebettet werden.

Kurz gesagt – JSFiddle eignet sich hervorragend für Experimente oder zum isolierten Testen von Javascript Funktionen ohne etwaige Seiteneffekte.