本系列期待能由淺入深剖析各種 bundler、build tool 如 Webpack、Vite (Rollup/Rolldown)、esbuild、Rspack、Turbopack 等工具的特性與優缺點,並通過實際弄髒手做實驗的方式來理解它們的運作原理與實戰技巧
(Photo by Jr Korpa) 此為 Vite dependency pre-bundling 的下集,如果還沒看過上集可以點這裡 實驗 3. 載...
(Photo by Jr Korpa) 前言 昨天實際體驗到了為什麼 Vite 在啟 dev server 時需要做 pre-bundling 的原因,關於怎...
前言 昨天追到 createServer 中的 Chokidar 這段,今天來繼續往下看,看能學到什麼新東西! Vite 怎麼做到監聽檔案異動變化 在 cre...
前言 昨天追到 pre-bundling 的入口 createDepsOptimizer 裡的 init 有三個關鍵函式,今天繼續來往下追,在開始前先複習一下...
前言 看了幾天的 pre-bundling 原始碼,在進到最後打包階段程式碼前,我想先實驗一下前幾天研究時突然好奇的一個問題:「如果一個拿 Vite 當 bu...
前言 先補充一個昨天的實驗的結果,後來重複測了幾遍後,發現影響冷啟動時間可能跟有沒有整個刪除 node_modules 有關。當有完整刪除後,就能穩定在第一次...
前言 昨天在 Vite 原始碼分析的最後看到了 esbuild 的設定們,今天這篇就利用這個機會來了解一下 esbuild 並實際動手玩玩看這個工具。 esb...
前言 這整個系列文轉眼間也要進入下半場,在 Day 9 到現在的 Day 18 不小心用了有一些多的篇幅在研究 Vite,其實原本還有 HMR、Module...
文章已同步發表於個人部落格,也可以前往觀賞好讀版。 前言 這系列命名為探索網頁前端工具的前世今生,在歷經前面的「JS 模組化歷史」、「Webpack 誕生」...
文章已同步發表於個人部落格,也可以前往觀賞好讀版。 前言 剛好前陣子有位讀者詢問「有在 Next.js 中將 bundler 成功替換成 Rspack,但不...