Vite vs. Bun: Trenger vi begge?

- Bun vil ikke erstatte Vite i nær fremtid. Dette kan likevel være noen berømte siste ord, skriver Magne Matre Gåsland.

- Hvorfor trenger vi Vite eller en separat "bundler"? Kunne vi ikke klart oss med Bun alene? spør Magne Matre Gåsland. 📸: Privat / kode24
- Hvorfor trenger vi Vite eller en separat "bundler"? Kunne vi ikke klart oss med Bun alene? spør Magne Matre Gåsland. 📸: Privat / kode24 Vis mer

Du har kanskje hørt at Bun ikke bare er en JavaScript motor ("runtime", slik som Node.js), men også kan pakke sammen JS-filene som sendes til klientens nettleser i en bunt (i.e. pakking, bedre kjent som "bundling").

Da har du kanskje lurt på: Hvorfor trenger vi Vite eller en separat "bundler"? Kunne vi ikke klart oss med Bun alene?

Jeg har samlet de relevante tweetene og dokumentasjonen jeg har kommet over, for å gi et sentralisert og søkbart svar på dette spørsmålet. Siden jeg ikke kunne finne det, og søking på Twitter suger.

Hva Vite bruker til bundling

Vite er en rask lokal utviklings-server. Vite fremhever at den lar deg gjøre "unbundled development". Dvs. at den sparer arbeidet med å pakke sammen JS filene før de sendes til klienten, siden den lener seg på nettleseren ved å bruke modul-systemet ESM.

Men djevelen ligger i detaljene. Spesielt til bruk i produksjons-miljøet bruker Vite en bundler for å opprette bunten med JS som klienten mottar. Den bruker faktisk for øyeblikket to bundlere.

I ditt lokale utviklingsmiljø bruker Vite en bundler kalt esbuild til å forhåndspakke biblioteker web-appen din er avhengig av (dependency pre-bundling), og konvertere dem til ESM. Dette er for å muliggjøre rask oppstart og raske omstarter av den lokale serveren når du utvikler. Siden Vite bruker ESM når du jobber (i stedet for å skape og alltid gjenskape en klient-bunt med JS når du oppdaterer koden). Det er dette du har hørt beskrevet som "unbundled development".

Til produksjons-miljøet bruker Vite bundleren Rollup for å opprette en minimal JS-bunt til klienten (for raskere nedlasting over nettet), og til evt. plugins som bruker Rollups fleksible API. Selv om Vite bruker ESM i ditt lokale utviklings-miljø, for økt hastighet (siden en her ikke må optimalisere for at det skal sendes over nettet). Men i produksjon kan Vite samtidig også bruke esbuild for å øke hastigheten av oversetting av koden fra TS til JS og minifisering av koden ("transpilation and minification. I fremtiden kan Vite bruke esbuild utelukkende for bundling i produksjons-miljøet i stedet for Rollup, for å oppnå økt hastighet.

Oppdatering: Rolldown (en Rust basert bundler) vil erstatte Rollup og esbuild som bundler i Vite**. Hvorfor Rolldown? Hovedsakelig for å oppnå raskere bygg til produksjons-miljøet ('hastigheten til esbuild, men ikke kun i dev-miljøet') samtidig som en kan bevare det fleksible API'et til Rollup. Ved å konsolidere til å bruke Rolldown som eneste bundler så vil Vite også håndheve bedre samsvar mellom dev og prod miljøene. Mer i lanseringspresentasjonen til Rolldown, og her:

Bun er mange ting, også en bundler

Bun er ikke bare en erstatning for Node, men en Zig port av esbuild (i utgangspunktet den samme raske algoritmen), så den inkluderer sin egen (for øyeblikket begrensede) bundler:

Men hva da med den åpenbare overlappen mellom Bun og Vite? Siden du kan bruke Bun som en bundler (Bun's skaper Jarred adresserte de relaterte utfordringene på HN). Hvorfor trenger vi da fortsatt Vite?

Svaret: Hvorfor Vite fortsatt er nødvendig

Kort sagt, Vites skaper Evan You svarte på spørsmålet her:

Så du kan kjøre Vite på Bun, uten problem. Bun har fullt ut støttet Vite siden Bun v0.7.

Men med den nåværende begrensningen:

Mens Vite for øyeblikket fungerer med Bun, har det ikke blitt betydelig optimalisert, og Vite har heller ikke blitt tilpasset for å bruke Buns bundler, modul-løser eller transpilator.

Så for øyeblikket står skillet slik:

Bun er fantastisk som en erstatning for Node.js på serveren (som JS motor).

Vite er flott for rask lokal utvikling uten pakking (pga. ESM), og i produksjons-miljøet gir Vite fleksibel og optimal pakking av JS-koden som må sendes over nettet til klientenes nettlesere. Vite har også API-er som mange utviklere elsker, og har dermed allerede et godt økosystem.

Vite har Hot Module Reloading (HMR), som er viktig for rask lokal utvikling. Buns HMR har for øyeblikket minst én åpen sak.

Buns HTTP-server dokumentasjon har for øyeblikket en merknad om HMR:

Merk - I en fremtidig versjon av Bun er støtte for Vites import.meta.hot planlagt for å muliggjøre bedre livssyklushåndtering for varme omstarter og for å tilpasse seg økosystemet.

Kort sagt: Bun vil ikke erstatte Vite i nær fremtid. (Dette kan likevel være noen berømte siste ord, med tanke på Buns forfatter Jarreds produktivitet!)

«Men jeg antar at Vite fortsatt vil være "Neste Generasjons Frontend Verktøy" en stund til.»

Fremtiden?

Det er vanskelig å spå fremtiden på lang sikt. Men jeg antar at folk vil bruke Vite med Bun under panseret, men at Bun sakte vil inkorporere mange av Vites API-er, slik at Bun til slutt vil være alt du trenger på ett sted. Det virker som det passer med Buns visjon om å være "en rask JavaScript alt-i-ett verktøykasse", som deres landingsside sier.

Men jeg antar at Vite fortsatt vil være "Neste Generasjons Frontend Verktøy" en stund til. Om ikke annet for alle prosjektene som fortsatt vil kjøre på Node, pga.:

Tror du Bun vil erstatte Vite i medium til fjern fremtid, og i så fall, hvorfor? Del dine tanker i kommentar-seksjonen!

💡 Innlegget kan leses i engelsk versjondev.to. Forfatteren blogger også om tech på magnemg.eu.