一、webpack會先進行編譯，再運行，vite會直接啟動，再按需編譯文件。

首先看兩張圖，可以清晰的看到，上面的圖是webpack編譯過的，而下面的圖是vite直接使用工程內文件。

二、區別于Webpack先打包的方式，Vite利用ES Modules,將開發環境下的模塊文件直接作為瀏覽器執行文件。

ES Modules是指通過export和import語句，允許再瀏覽器端導入導出模塊。開發者實際上構建了一個依賴關系圖，主流瀏覽器是直接支持的，vite正是利用這點。

三、Nodejs是毫秒級的，Go是納秒級的，Webpack是基于Node.js構建的，Vite是基于esbuild預構建的，esbuild是Go語言編寫的，打包速度Vite也更優。

四、在Webpack中，模塊更新是需要重新編譯的，而Vite只需要讓瀏覽器重新請求。

綜上所述，Vite比webpack更快的原因有4：

1. 編譯模式不同
2. 對瀏覽器的利用不同（Vite利用了現代瀏覽器的esModules）
3. 底層語言不同
4. 熱更新處理不同