webmatze.de

Profi Tipps für einen erfolgreichen Internetauftritt

5 extrem nützliche Tools für JavaScript Entwickler

| Keine Kommentare

Wenn es eine Programmiersprache gibt, die ich wirklich liebe, dann ist dies auf jeden Fall JavaScript. Früher von vielen belächelt, hat sich JavaScript heute zu einem wirklich mächtigen Tool unter Webentwicklern gemausert. Viele hilfreiche Seiten wie z.B. Google Maps wären ohne JavaScript überhaupt nicht möglich gewesen und selbst auf der Serverseite findet es in letzter Zeit immer mehr Verwendung - siehe node.js. Heute möchte ich euch fünf interessante und nützliche Tools vorstellen, die einem das Arbeiten mit JavaScript sehr erleichtern können.

JSFIDDLE - JavaScript direkt im Browser entwickeln

Dieses Tool ist noch relativ jung, hat sich aber für mich bereits jetzt zu einem der wichtigsten Tools beim Entwickeln und Testen von JavaScript Scripten entwickelt. Das Besondere an JSFIDDLE ist, dass man vier verschiedene Felder zur Verfügung gestellt bekommt. Im Ersten schreibt man seinen HTML Code, im Zweiten den benötigten CSS Code und im Dritten schließlich das JavaScript.

Wenn man möchte lassen sich externe JavaScript Bibliotheken wie Prototype, jQuery, Mootools und viele weitere per Klick einbinden.

Ein Klick auf 'Run' und das fertige Script wird ausgeführt und das Ergebnis im vierten Feld angezeigt. Diese so geschriebenen Scripte können gespeichert werden und sind über eine feste URL jederzeit wieder aufrufbar. Bei jedem Speichern bleibt übrigens die vorherige Version erhalten und kann über die alte URL aufgerufen werden.

Die mit JSFIDDLE erstellten Scripte lassen sich übrigens über eine 'Share' Funktion in jede beliebige Seite einbinden. Das könnte dann z.B. wie folgt aussehen:

Wie ich finde ein wirklich geniales und nützliches Tool.

http://jsfiddle.net

JavaScript Obfuscator - Den Code unkenntlich machen

Ein Problem mit dem man bei der Entwicklung von JavaScript leben muss ist, dass sich der Code jederzeit im Browser betrachten lässt. Häufig stecken in dem Code jedoch viele Stunden Arbeit und geistige Schaffenskraft, wo man natürlich nicht möchte, dass sich jeder gleich an der eigenen Arbeit bedienen kann, indem er den Code einfach kopiert.

Hier springt der Free Javascript Obfuscator in die Presche, denn mit diesem Tool lässt sich der Code auf einfache Weise unleserlich machen, indem es den Code unkenntlich macht und es so fast unmöglich wird, den so bearbeiteten Code zu analysieren. Dabei bleibt das Script natürlich weiterhin funktionsfähig.

http://javascriptobfuscator.com/

Packer - Große Scripte verkleinern und Bandbreite sparen

Wer komplette JavaScript Bibliotheken wie Prototype kennt der weiß, dass diese schon mal ziemlich groß werden können. Doch im Web kommt es oft auf schnelle Ladezeiten und damit auf geringe Dateigrößen an. Jedes Kilobyte kann dabei entscheidend sein. Und genau hier kommt Packer von Dean Edwards in Spiel.

Mit diesem Tool lassen sich große Script schnell auf kleinere Größen schrumpfen, indem überflüssige Zeichen entfernt und Variablennamen gegen Kürzere ausgetauscht werden. Außerdem lässt sich alles noch per Base62 kodieren, was den so entstandenen Code gleichzeitig unleserlich macht.

http://dean.edwards.name/packer/

Bananascript - Effizientes JavaScript Koprimierungstool

Wem Packer noch nicht ausreicht, oder wer damit Probleme hat - Packer benötigt 100% richtig geschriebenen Code - der sollte sich zusätzlich auch Bananascript ansehen. Dieses Komprimierungstool verspricht noch bessere Kompressionsraten und funktioniert auch mit Bibliotheken wie Prototype.

Einfach die entsprechende JavaScript Datei auswählen, hochladen und schon bekommt man die komprimierte Version zum Download angeboten. Die Komprimierung tendiert dabei meistens bei 73%, kann aber auch mal 99% erreichen, wenn man den Statistiken von Bananascript trauen darf.

http://www.bananascript.com/

JSBeautifier - JavaScript Code verschönern

Als letztes Tool möchte ich euch den JavaScript Beautifier vorstellen. Mit diesem Tool lassen sich gleich zwei Fliegen mit einer Klappe schlagen. Zum einen kann man damit den eigenen JavaScript Code verschönern lassen, indem dieser richtig eingerückt und umgebrochen wird. Bei JavaScript ist es eigentlich egal, ob das komplette Script in einer Zeile geschrieben wird, aber es lässt sich nun mal viel besser lesen, wenn es ordentlich eingerückt und über mehrere Zeilen geschrieben wird.

Aber der JSBeautifier bietet noch mehr, denn damit lassen sich außerdem z.B. mit Packer oder JavaScript Obfuscator gepackte und unkenntlich gemachte Scripte wieder lesbar machen. Zwar lassen sich Variablennamen nicht immer wieder herstellen, aber der verschönerte und entpackte Code lässt sich auf jeden Fall wieder besser lesen und analysieren. (Aber pssst nicht weitersagen!!!!)

http://jsbeautifier.org/

Fazit

Wie ihr sehen könnt, gibt es einige Tools, die einem die Arbeit mit JavaScript erleichtern können. Viele von den oben genannten verwende ich selbst auch regelmäßig und möchte sie heute nicht mehr missen. Ich hoffe auch für euch war etwas Interessantes dabei, aber vielleicht kennt ihr ja selbst auch noch ein paar nützliche Tools. Wenn ja, dann berichtet doch einfach in den Kommentaren davon.

Diese Artikel könnten dich auch interessieren: