Vite (französisches Wort für "schnell", ausgesprochen "veet") ist ein Build-Tool, welches eine schnellere und schlankere Entwicklungserfahrung für moderne Webprojekte bieten soll.
Die Stärken von Vite liegen im Vergleich mit webpack, Rollup und Parcel, bei der Verarbeitung von JavaScript. So ist ein schnellerer Serverstart bei der Entwicklung möglich. Dies erreicht Vite indem es die Module einer Anwendung in zwei Kategorien unterteilt: Dependencies und Quellcode.
Bei den Dependencies handelt es sich meist um JavaScript, welches sich während der Entwicklung nicht oft ändert. Einige große Abhängigkeiten (z. B. Komponentenbibliotheken mit Hunderten von Modulen) sind recht teuer in der Verarbeitung. Abhängigkeiten können auch in verschiedenen Modulformaten ausgeliefert werden. Vite bündelt Dependencies mithilfe von esbuild. Dies geschieht 10-100 mal schneller als mit den JavaScript-basierten Bundlern.
Der Quellcode ist meistens nicht in reinem JavaScript geschrieben (bspw. Vue, Css,...) und wird häufig verändert. Er muss außerdem häufig nicht zeitgleich geladen werden.
Vite stellt den Quellcode über das native ESM bereit. Dies bedeutet, dass der Browser einen Teil der Arbeit eines Bundlers übernehmen kann: Vite muss den Quellcode nur bereitstellen, wenn der Browser ihn anfordert. Code wird nur verarbeitet, wenn er tatsächlich auf dem aktuellen Bildschirm verwendet wird.
In Vite wird HMR über natives ESM durchgeführt. Wenn eine Datei bearbeitet wird, muss Vite nur die Verbindung zwischen dem bearbeiteten Modul und den nächstgelegenen HMR-Grenzen ungültig machen, wodurch HMR-Aktualisierungen unabhängig von der Größe Ihrer Anwendung gleichbleibend schnell sind.
