Webentwicklung: Snowpack befreit vom Bundling

Das Tool Snowpack soll die Webentwicklung beschleunigen, indem es alle Dependencies zusammenfasst und so das Bundling umgeht.

In Pocket speichern vorlesen Druckansicht 17 Kommentare lesen
Webentwicklung: Snowpack befreit vom Bundling

(Bild: Rainald Menge-Sonnentag)

Lesezeit: 2 Min.
Von
  • Rainald Menge-Sonnentag

Das ursprünglich unter der Bezeichnung Pika entwickelte Paketverwaltungswerkzeug für JavaScript hat für den Sprung auf Version 1.0 den Namen gewechselt und ist nun als Snowpack erschienen. Das Tool soll die Webentwicklung beschleunigen, indem es alle Dependencies für ein Projekt einmal zusammenfasst. Bei späteren Änderungen am Sourcecode entfällt damit das Bundling.

Snowpack, das sich mit Schneedecke übersetzen lässt, installiert alle Dependencies für ein Projekt in einem separaten web_modules-Verzeichnis. Entwickler können sie anschließend über ESM-import (ECMAScript Modules) zum Verwenden im Browser in ihr Projekt importieren. Damit lassen sich Änderungen direkt im Browser testen, ohne auf Tools wie webpack oder parcel zurückgreifen zu müssen.

Snowpack arbeitet nicht nur mit reinem JavaScript, sondern lässt sich unter anderem mit TypeScript und Babel verwenden. Auch das Zusammenspiel mit Frameworks wie React und Vue ist möglich. Da es auf ESM setzt, arbeitet es nur mit entsprechenden Browsern zusammen. Die aktuellen Varianten von Firefox, Chrome, Safari, Edge und Opera lassen sich somit verwenden, aber der Internet Explorer, die mobilen Opera-Varianten sowie der UC Browser fallen heraus.

Der Großteil der Browser lässt sich mit ESM verwenden.

(Bild: caniuse.com)

Daher rät die Projektseite vom Einsatz von Snowpack für Unternehmensanwendungen, die auf IE 11 setzen, sowie für den chinesischen Markt, in dem der UC Browser stark vertreten ist, ab. Besonders geeignet sei das Werkzeug für frische Projekte, zumal es keine zusätzlichen Abhängigkeiten erzeugt, sodass Entwickler jederzeit zum herkömmlichen Bundling-Prozess wechseln können.

Standardmäßig installiert Snowpack alle Dependencies ohne Optimierungen und Minifizierung. Um Code für den produktiven Einsatz zu optimieren dient das Flag --optimizie, das die Dependencies auf das benötigte Minimum reduziert und eine Transpilierung vornimmt. Mit dem Release von Version 1.0 führt Snowpack zudem das Tree Shaking ein, also das Entfernen von ungenutztem Code.

Snowpack arbeitet beim Optimieren länger, erzeugt aber deutlich kleineren Code.

(Bild: Snowpack.dev)

Weitere Details zu Snowpack lassen sich der Projektseite und dem GitHub-Repository entnehmen. Erstere bietet neben einer Einführung zusätzlich Anleitungen für das Zusammenspiel unter anderem mit Babel, TypeScript, Vue und React. (rme)