6 leichtgewichtige jQuery-Alternativen im Vergleich

Die Javascript Library jQuery ist mit der Zeit ordentlich gewachsen und bringt selbst als .min.js inzwischen fast 100 KB auf die Waage. Dabei werden viele der Funktionen von jQuery häufig gar nicht benutzt. Neben der Download-Größe ist auch die Rendering Zeit nicht zu verachten, die größere Dateien mit sich bringen, und ältere Smartphones schnell mal lahmlegen können. Daher kann es daher nicht schaden, sich nach schlankeren Alternativen umzusehen. Die Grundfunktionen, die jQuery ausmachen, sollten aber natürlich weiterhin verfügbar sein.

Ich habe hier mal einige der am Häufigsten genannten jQuery-Alternativen verglichen. Die Auswahl der Features, die verglichen wurden, ist rein subjektiv und basiert auf den Funktionen, die persönlich häufiger nutze. Für die Größenangabe der GZIP-Kompression wurde die höchste Kompressionsrate (gzip -9) angewendet. Die tatsächliche Größe im Browser kann daher abweichen. Die angegeben Funktionen entsprechen den original Funktionen wie sie in jQuery bezeichnet werden und heißen bei einigen der Frameworks anders.

Funktionsvergleich

jQuery 1.12.0 jQuery 2.2.0 Zepto 1.1.6 Sprint.js Minified.js 1.1 (Web) Cash 1.0.0 Umbrella JS 1.1.3 ki.js
Größe (Minified) 97 KB 86 KB 25 KB 17 KB 10 KB 8 KB 5 KB 602 Byte
Größe (GZIP) 34 KB 30 KB 9 KB 5 KB 4 KB 3 KB 2 KB 404 Byte
Ready-Function Ja Ja Ja Ja Ja Ja Nein Ja
each() (Array) Ja Ja Ja Ja Ja Ja Nein Nein
Ajax Ja Ja Ja Nein Ja Nein Ja Nein
ID-Selector Ja Ja Ja Ja Ja Ja Ja Ja
Class-Selector Ja Ja Ja Ja Ja Ja Ja Ja
.on()-Events Ja Ja Ja Ja Ja Ja Ja Ja
hide()/show() Ja Ja Ja Nein Ja Nein Nein Nein
append()/html() Ja Ja Ja Ja Ja Ja Ja Nein

Dateigrößen Vergleich

Hier ist nochmal ein Diagramm, das die Dateigrößen der verschiedenen Libraries darstellt. Beachtlich ist hier ki.js, das weniger als 1 KB groß und damit über 100 Mal kleiner als jQuery ist:

jQuery Alternativen Dateigrößen

Enthaltsamkeit

Bei Webseiten, die nur wenig Javascript einsetzen, kann es sich sogar lohnen komplett auf jQuery und Co. zu verzichten und wieder die guten alten nativen Funktionen zu benutzen. Hierfür bietet sich die Seite youmightnotneedjquery.com an, die für viele der jQuery-Funktionen die passenden nativen Funktionen anzeigt.

Kommentare