JavaScript Komprimieren

November 6, 2009 – 10:09 pm

Mit dem Wachsenden Web sind auch die JavaScripte gewachsen. Heute ist ein durchschnittliches JavaScript Framework etwa 100KB groß. Ein Teil davon sind aber nur Platzverschwender wie Umbrüche, Lehrzeichen und Kommentare um den code auch leserlich zu machen. Die sind eigentlich für den Browser unbrauchbar und so werden sie zu einer unnötigen Last die beim jeden aufrufen des Scripts mit transportiert wird.

Auf dem Markt haben sich ein Paar bekannte JavaScript Kompresser positioniert wie Packer 3.1, Dojo ShrinkSafe, YUI Compressor und JSMin, die den JavaScript Code komprimieren und den unnötigen Code zu entfernen. Jeder von ihnen nutz seine Technik wie zum Beispiel der Packer es mit der Komprimierung macht wie ein ZIP Programm. Der ShrinkSafe und JSMin entfernen die Umbrüche, Lehrzeichen und Kommentare. Der YUI Compressor macht es mit der Compiler Technik um den JavaScripte Code sozusagen neu zu Kompilieren mit abgekürzten Funktion- und Variablen Namen.
Alle Vier haben bis jetzt ihr Gutes getan um den Code so klein wie Möglich zu komprimieren. Doch jetzt komm wer den sonst? Google.

Google hat vor kurzem seinen Closure Compiler der JavaScript Welt öffentlich gemacht den jeder nutzen kann um seinen JavaScript Code zu Komprimieren. Da ich öfters auf die Komprimierung zugreife, hab ich auch einen kleinen Test gemacht und siehe da, der Google Compiler hat es um ca 1KB geschafft den Code etwas kleiner zu verpacken .

Getestet hab ich mit dem jQuery 1.3.2 Framework ohne Kommentare. Hier sind die gerundeten Ergebnisse:

Normal: 124KB
Google Closure Compiler: 55KB
YUI Compressor: 56KB
Dojo ShrinkSafe: 70KB
JSMin: 74KB

So gesehen kann man seinen JavaScript Code sehr einfach fast zu Hälfte kleiner machen und damit einen schnellen Download ermöglichen. Denn auch in der Zeit des DSLs ist es Ratsam bei vielen JavaScripten einfach die Komprimierung zu nutzen.

Damit ist es aber noch nicht Schluss und Google macht noch ein Extra dazu, in dem man die Advanced Optimisation nutzen kann die auch Google bei seinen eigenen Scripten nutzt. Die Technik Reduziert den Code noch um 5KB und das sind eigentlich kein Krümel mehr. Leider ist der Code für Außen nicht mehr Verständlich und somit schwer zu Lesen als auch nicht mehr so einfach nutzbar. Alle Funktion und Variablen Namen werden so verkürzt, dass man nur noch ABC Salat hat. Diese Komprimierung ist gut für Autonome JavaScript Schnippsel zu gebrauchen.

Wer sein Code einfach und schnelle Komprimieren will der kann denn altbekannten Compressorrater nutzen der es mit allen Oben genannten Komprimieren den JavaScript Code packt und Plus dazu sogar noch die GZip anbietet.

Oder man kann ab jetzt an den Closure Compiler von Google nutzen. Der ist aber auf 200KB limitiert und bei meinem Test mit jQuery Kompilierung hat er sogar geschafft meinen Firefox zu killen. Ich hab mein Code mit der API REST Schnittstelle komprimiert. Wer mehr vom Google Closure Compiler erfahren will, der kann die Dokumentation ansehen. Dort ist die API Schnittstelle kurz definiert.