jQuery auf Diät
Angesichts der immensen Verbreitung der von John Resig entwickelten jQuery-Bibliothek gibt es mittlerweile ernsthafte Diskussionen, ob angehende Webentwickler lieber JavaScript oder jQuery lernen sollen. Dass das eine eine Untermenge des anderen darstellt, wird geflissentlich ignoriert. Aber was ist eigentlich mit Zepto? Manch einer mag die minimalistische JavaScript-Bibliothek mit jQuery-inspirierter Syntax schon vergessen haben. Warum sich ein Blick auf den Evergreen aber durchaus lohnt, erklärt dieser Artikel.
Abseits der für klassische Informatiker immens lustigen Debatten um jQuery und JavaScript muss allerdings festgehalten werden, dass jQuery alles andere als klein ist. In Zeiten von Content Delivery Networks mag dies nicht von besonderer Relevanz sein: Wer eine weit verbreitete Bibliothek von einem beliebten CDN einbindet, kann sich darauf verlassen, dass eine andere Website dafür gesorgt hat, dass die Datei bereits im Browsercache des Nutzers ist. In der Praxis gibt es allerdings immer wieder Situationen, wo es auf die maximale Performance ankommt. Ein Beispiel dafür wären JavaScript-basierte Prozessrechner, bei denen der zur Verfügung stehende Codespeicher nicht uneingeschränkt ist und es ob der schwachbrüstigen CPU auf jedes Kilobyte Code ankommt (Stichwort Startzeit). Zudem gibt es immer wieder Szenarien, in denen Content Delivery Networks nicht erlaubt sind oder in denen man als Entwickler Browser unterstützen muss, die von jQuery im Laufe der Zeit nicht mehr abgedeckt werden.
In diesem Moment schlägt die Stunde einer als Zepto bezeichneten Bibliothek (Kasten: „Des Handcomputerprogrammieres Liebling“). Das Projekt, im Jahr 2010 von Thomas Fuchs erdacht, ist ein Evergreen der JavaScript-Welt und zeigt sich – im Großen und Ganzen – mit jQuery kompatibel. Vor allem aber kommt das Produkt je nach Konfiguration mit 5 oder 10 KB kompiliertem Code aus.
Dieser Artikel bietet eine kurze Vorstellung der Bibliothek. Und dank des sehr kompakten Aufbaus haben wir hier sogar eine realistische Möglichkeit, das Produkt als Ganzes abzudecken.
Des Handcomputerprogrammierers Liebling
Thomas Fuchs hatte Zepto ursprünglich als abgespeckte Alternative für die Arbeit mit PhoneGap vorgesehen. Aus diesem Umstand folgt eine sehr interessante Kompatibilitätsliste. Neben den Klassikern unterstützt die Bibliothek im Großen und Ganzen nämlich auch einige seltenere Betriebssysteme. Einige besonders interessante Kandidaten sind beispielsweise Palms WebOS, ältere Versionen von Android, BlackBerry 10 und sogar alte Versionen von Safari für iOS.
Das Core-Modul von Zepto kommt minifiziert auf nur fünf Kilobyte. Es gibt immer wieder Szenarien, in denen man für die im Artikel weiter unten besprochenen Erweiterungsmodule keinen Bedarf hat und somit wirklich mit einer Dateigröße von fünf Kilobyte auskommen kann.
Eine Frage der Modularisierung
Als der Autor dieser Zeilen vor vielen Jahren an einer drittklassigen österreichischen technischen Hochschule einen Analogrechner aus dem Hause Telefunken zerlegen musste, bewunderte er den stark modularen Aufbau des in der Zerstörung befindlichen Rechenbiests. Es handelte sich um ein System, das wirklich in seine Einzelteile zerlegbar war. Sowohl bei der Reparatur als auch beim Verkauf hilfreich, konnte Telefunken auf diese Weise nicht benötigte Teile weglassen, um das Gesamtsystem preiswerter anbieten zu können.
Im Hause Zepto setzt man auf ein ähnliches Konzept. Die Bibliothek besteht aus einem guten Dutzend Modulen, die in Tabelle 1 kurz zusammengefasst sind.
| Modulname | Kurzbeschreibung | In Standarddistribution |
|---|---|---|
| zepto | Kernmodul | ja |
| event | Erweiterungen für eventgetriebene Programmierung | ja |
| ajax | XMLHttpRequest | ja |
| form | Methoden zur Serialisierung von Formularen | ja |
| ie | Unterstützung für Internet Explorer 10 | ja |
| detect | Erkennung von Browser und Hostbetriebssystem | nein |
| fx | „Animate()“-Methode | nein |
| fx_methods | Vordefinierte Beispielanimationen für Animate | nein |
| assets | Bessere Speicherverwaltung für iOS; experimentell | nein |
| data | „Data()“-Methode | nein |
| deferred | Möglichkeit zur Nutzung von Promises | nein |
| callbacks | Erweitert „$.Callbacks“ um die Möglichkeit, im Deferred-Betrieb zu arbeiten | nein |
| selector | Emuliert ein Subset von jQuerys CSS-Selektoren | nein |
| touch | Touchscreen-Basisbibliothek | nein |
| gesture | Gestenerkennung für Pinch-to-Zoom | nein |
| stack | Methodenverkettung | nein |
| ios3 | Unter iOS 3 nicht implementierte Hilfsfunktionen | nein |
Tabelle 1: Die Module von Zepto
An einer eigenen Version von Zepto interessierte Entwickler erreichen dieses hehre Ziel auf zwei Arten: Erstens kann der gesamte Quellcode heruntergeladen werden, um daraufhin unter Nutzung von Node-basierten Werkzeugen eine eigene Version zu kompilieren. Alternativ dazu bietet sich der unter http://github.e-sites.nl/zeptobuilder/ bereitstehende zepto builder an, der nach dem Öffnen in einem beliebigen Webbrowser das in Abbildung 1 gezeigte Benutzerinterface auf den Bildschirm bringt.
Abb. 1. Dank des zepto builders müssen Entwickler nicht mit der Node-Kommandozeile kämpfenIm Interesse der Einfachheit wollen wir an dieser Stelle trotzdem mit der Standa...
