Zweieinhalb Jahre nach dem Release von Webpack 4 hat der Bundler mit Version 5 jetzt erneut ein Update erhalten. Laut offiziellem Blogpost zum Release wird an der neuen Version momentan noch fleißig entwickelt. Das Team um das Open Source Tool erwartet für die kommenden Tage und Wochen noch einige Bug Fixes, Verbesserungen sowie neue Features für V5.

Die wohl spannendste Neuerung an V5 heißt Module Federation. Bislang gab es keine optimale Lösung für das Teilen von Code zwischen voneinander unabhängigen Applikationen. Ein möglicher Weg war es bisher, den betreffenden Code zu extrahieren, ihn zu einem npm-Paket zu verpacken und zu publishen, betreffendes Paket in beiden Codebases einzubinden und beide Apps zu republishen. Ein anderer, den betreffenden Code zu extrahieren, zu bündeln und das Ganze via Edge Side Includes oder einen Microfrontends-Ansatz jeweils zur Laufzeit zu integrieren. Das Resultat: Die betreffenden Anwendungen waren nicht mehr eigenständig und meistens wurde nur eine geringe Anzahl Dependencies geteilt. Es lohnte sich somit quasi kaum, Feature-Code oder Komponenten zwischen separat gebündelten Applikationen zu teilen.

Dieses Problem soll mit Webpacks fünftem Versions-Update gelöst werden: Module Federation ermöglicht das Teilen von Code über verschiedene Webpack Builds hinweg. Aus Laufzeitperspektive verhalten sich die Module verschiedener Builds wie ein großes zusammenhängendes Modul-Diagramm. Module Federation ermöglicht JS-Apps das Laden von Code aus anderen Applikationen und das Teilen bereits vorhandener Dependencies mit dem geladenen Modul. Fehlt eine von dem Code aus der anderen Codebase benötigte Dependency, lädt Webpack diese vom Build-Origin des federierten Codes, ansonsten stützt sich dieser auf die bereits vorhandenen. So können Dopplungen und unnötiger Payload vermieden werden. Module Federation ermöglicht quasi das Teilen von Dependencies zwischen voneinander komplett unabhängigen Codebases wie in einem monolithischen Webpack-Build. Mit dem Unterschied, dass die einzelnen Builds weiterhin komplett in ihrem eigenen Repository leben, unabhängig voneinander deployed werden können und als eigenständige (Single Page) App funktionieren. Wer sich weitergehend für die Funktionsweise und Entstehungsgeschichte des Features interessiert, sei an den zugehörigen Blogpost des verantwortlichen Entwicklers, Zack Jackson, verwiesen.

Zudem wurde die Build-Performance in V5 über eine Neuerung namens Persistent Caching verbessert. Auch Webpacks Langzeit-Caching-Mechanismus hat mit verbesserten Algorithmen und Defaults ein Update erhalten. Für verbesserte Bundle-Größen wurden Tree Shaking und Code Generation des Bundling-Tools überarbeitet, zudem soll das Tool jetzt besser mit der Webplattform kompatibel sein. Außerdem hat das Webpack-Team mit dem neuen Release wohl gründlich aufgeräumt und unausgegorene Strukturen, die aufgrund der Implementation neuer Features in V4 unter Vermeidung nicht abwärts kompatibler Änderungen entstanden waren, wurden laut Webpack-Blog in V5 bereinigt und veraltete Features entfernt. Wer weiterführende Informationen zu den zahlreichen Änderungen und Neuerungen oder zur Migration auf die neue Version wünscht, sei an den offiziellen Blogpost zum Release verwiesen.

Passend dazu: Webpack-Core-Member Johannes Ewald: „Ein Open Source Projekt ist kein Startup“