在前端開(kāi)發(fā)中，“輪子”一詞是指各種工具、庫(kù)和框架等。不知你是否注意到，程序員們特別熱衷于造輪子，尤其是在前端領(lǐng)域，新的工具和技術(shù)層出不窮。那么，為什么前端程序員如此熱衷于造輪子呢？本文就來(lái)簡(jiǎn)單探討一下。

造輪子可以分為兩種：重新造輪子和重新發(fā)明輪子。

• 重新造輪子，是指盡管市面上已有類(lèi)似工具，開(kāi)發(fā)者仍出于練習(xí)目的去模仿實(shí)現(xiàn)。比如，許多前端新手入門(mén)時(shí)都?jí)粝胫蛟熳约旱?UI 組件庫(kù)或?qū)崿F(xiàn)一個(gè)后臺(tái)管理系統(tǒng)。這類(lèi)項(xiàng)目通常以練手為主，旨在發(fā)現(xiàn)其中的難點(diǎn)并積累經(jīng)驗(yàn)。
• 重新發(fā)明輪子，則是由于現(xiàn)有工具不完全符合個(gè)性化需求，于是開(kāi)發(fā)者決定從零開(kāi)始打造新工具，或在現(xiàn)有工具基礎(chǔ)上進(jìn)行二次開(kāi)發(fā)，以滿足個(gè)性化需求，同時(shí)為其他開(kāi)發(fā)者提供便利。

無(wú)論是造輪子還是發(fā)明輪子，并無(wú)好壞之分。造輪子有助于提升個(gè)人經(jīng)驗(yàn)，而重新發(fā)明輪子既滿足個(gè)性化需求，又能惠及他人，實(shí)現(xiàn)雙贏。我們經(jīng)常看到前端領(lǐng)域涌現(xiàn)出各種新框架和工具，很多都是在重新發(fā)明輪子。作者發(fā)現(xiàn)了現(xiàn)有工具的不足之處，因此決定自己動(dòng)手，打造全新的解決方案。

正是有人不斷發(fā)明輪子，才有了越來(lái)越完美的輪子：

圖片

接下來(lái)，讓我們通過(guò)分析幾個(gè)近幾年被重新發(fā)明的新輪子，來(lái)理解重新發(fā)明輪子的意義。

Bun

2022 年，JavaScript 運(yùn)行時(shí) Bun 一發(fā)布便迅速走紅。Bun 之所以引人注目，主要?dú)w功于其卓越的速度和全面的功能。我們目前最常用的 JavaScript 運(yùn)行時(shí)是 Node.js，然而它存在一個(gè)顯著的問(wèn)題——速度較慢。為了解決這一問(wèn)題，Bun 應(yīng)運(yùn)而生。它針對(duì) Node.js 的緩慢性能問(wèn)題提供了顯著的改進(jìn)，并且作為一個(gè)一體化的解決方案，集成了打包器、測(cè)試運(yùn)行器以及與Node.js兼容的包管理器。Bun不僅彌補(bǔ)了Node.js的不足，還通過(guò)提供完善的工具鏈，為JavaScript開(kāi)發(fā)帶來(lái)了革新。

圖片

Bun 的 Github Star 增長(zhǎng)趨勢(shì)Bun 的誕生可以說(shuō)是重新發(fā)明輪子的過(guò)程。其作者洞察到 Node.js 的局限性后，決定親自打造一款新的運(yùn)行時(shí)。在我看來(lái)，這個(gè)過(guò)程頗具意義。

Rspack

Rspack 是字節(jié)跳動(dòng)去年推出的一款自主研發(fā)的構(gòu)建工具。在此之前，開(kāi)發(fā)團(tuán)隊(duì)廣泛采用的構(gòu)建工具是 Webpack，它也是目前市面上使用最廣泛的構(gòu)建工具。然而，Webpack 存在兩個(gè)顯著問(wèn)題：一是配置不夠靈活，二是性能有待提升。由于前端社區(qū)沒(méi)有合適的解決方案，團(tuán)隊(duì)決定自行研發(fā) Rspack。Rspack 實(shí)現(xiàn)了 Webpack 的大部分功能，能夠?qū)ΜF(xiàn)有的 Webpack 項(xiàng)目實(shí)現(xiàn)無(wú)縫遷移，并帶來(lái)了 5 到 10 倍的編譯性能提升。

圖片

Rspack 每周 npm 下載量如今，許多使用 Webpack 的項(xiàng)目紛紛選擇遷移到 Rspack，從而獲得了顯著的性能提升。這一趨勢(shì)不僅彰顯了 Rspack 的強(qiáng)大優(yōu)勢(shì)，也從側(cè)面證明了重新研發(fā) Rspack 的意義。

shadcn/ui

去年開(kāi)源的 shadcn/ui UI 組件庫(kù)，自發(fā)布以來(lái)在 GitHub 上已迅速積累了 64k Star，吸引了眾多國(guó)外項(xiàng)目的青睞。面對(duì)社區(qū)中琳瑯滿目的優(yōu)秀 UI 組件庫(kù)，為何還要再造一個(gè)新的呢？關(guān)鍵在于 shadcn/ui 的獨(dú)特定位：它并非一個(gè)傳統(tǒng)意義上的組件庫(kù)，而是個(gè)組件的大熔爐，讓用戶能夠直接取用單個(gè) UI 組件的源代碼，賦予開(kāi)發(fā)者前所未有的靈活性和定制自由。開(kāi)發(fā)者不必再費(fèi)盡心思去覆蓋組件庫(kù)的默認(rèn)樣式，使用起來(lái)隨心所欲，非常便捷。

圖片

shadcn/ui 的 Github Star 增長(zhǎng)趨勢(shì)在眾多優(yōu)秀的 UI 組件庫(kù)中，shadcn/ui 成功地脫穎而出，堪稱(chēng)是對(duì)“重新發(fā)明輪子”理念的一次精彩演繹。

小結(jié)

如果你是以學(xué)習(xí)為目標(biāo)，那么投入時(shí)間造輪子無(wú)疑是一種非常有效的學(xué)習(xí)方法。

然而，在實(shí)際開(kāi)發(fā)過(guò)程中，我們必須注重效率，避免不必要的努力。當(dāng)有成熟且優(yōu)質(zhì)的工具可供使用時(shí)，直接采用這些經(jīng)過(guò)時(shí)間檢驗(yàn)、設(shè)計(jì)周全的工具是明智之舉，無(wú)需浪費(fèi)時(shí)間在重復(fù)性工作上。

但是，當(dāng)現(xiàn)有工具無(wú)法滿足個(gè)人需求，或者存在許多可以通用化的方法時(shí)，重新發(fā)明輪子就顯得非常有價(jià)值。