前言

今天這篇文章主要來比較一下目前比較流行的 Monorepo 框架。

Turborepo

首先是 Turborepo，上次的文章中只提到 Turborepo 的使用方式，今天這篇文章就來提提 Turborepo 的相關(guān)觀念吧！

Truborepo 是一套相當(dāng)輕量的且可以快速建立出 Monorepo 架構(gòu)的框架，這套框架是由一位很有名氣的工程師 Jared Palmer 開發(fā)，后續(xù)也是由鼎鼎大名的 vercel 團隊進(jìn)行維護。

雖然 Turborepo 是 2021 年才問世的算是相當(dāng)新的一個框架，后續(xù)可能會有許多問題以及待優(yōu)化項目需要處理，不過畢竟人家背后有 vercel 在幫忙，所以讀者其實是可以放心使用的不用擔(dān)心XD。

而 Turborepo 一共有以下幾種特性：

• Faster, incremental builds：更快的 build 速度。
• Content-aware hashing：自動查看項目內(nèi)所有文件進(jìn)行 build，而不是利用 timestamp 的方式來決定哪些文件是需要 build 的。
• Cloud caching：可以分享 cloud build caching 來加速 CI/CD 的構(gòu)建。
• Parallel execution：有效利用所有 CPU 核心的性能，不會浪費閒置 CPU 的性能。
• Task pipelines：定義 task 的關(guān)系，讓 Turborepo 可以最佳化的決定這些 task 的 build 時機。
• Pruned subsets：藉由建立 subset 來加速 Platform as a Service(Paas) 的 deploy 效能。
• Convention-based config：利用 JSON file 來降低複雜度。

有了以上幾點特性讓 Turborepo 可以成為一套既容易上手又可以兼具項目性能的好用的 Monorepo 框架。

Nx

Nx 是一套相當(dāng)好用的 Monorepo 框架，本身內(nèi)置相當(dāng)多好用的工具提供給開發(fā)者使用，此框架也是最多人拿來跟 Turborepo 比較。

相較于 Turborepo ，Nx 是從 2018 年問世，所以整體來說一定有更好的優(yōu)化以及更好的開發(fā)體驗，接下來筆者會一一介紹幾個筆者在使用此框架時有用到的好用工具，讀者如果后續(xù)有想要玩玩看 Nx 的話不妨也可以試試看這些功能。

• Local computation caching：本地端讀取，緩存已經(jīng) build 過的內(nèi)容，讓后續(xù)在 build 的過程中不必再花時間 build 先前的文件，藉此加速項目整體 build 的時間。
• Project graph visualization：互動式圖形化界面，讓開發(fā)者可以快速知道項目間彼此的相依性，也可以藉此檢查是否有 repo 引用了錯誤的 repo。

這件事在 Turborepo 中如果要達(dá)到必須要安裝一個叫 Graphviz 的工具，且此工具只能生成圖案無法產(chǎn)生互動式界面。

• task coordination：任務(wù)協(xié)調(diào)，可以同步進(jìn)行項目 repo build 的 task 藉此達(dá)加速整個 build 的流程，詳細(xì)的內(nèi)容會在下方介紹 Lerna 的時候一併介紹給讀者。

除了以上這幾點特性外，筆者認(rèn)為 Nx 還有一個特性做得比 Turborepo 好，在終端機的顯示上 Nx 給人一種一目了然的感覺，可以知道有哪些文件正在 build 而且也有顏色上的區(qū)分。

除了終端機的顯示差別外，在 build 的時間上拜 local caching 所賜，Nx 也是贏過 Turborepo 的。

Lerna

Lerna 這套 Monorepo 框架相較于上面提到的 Nx 以及 Turborepo 來說可以說是最老牌的，是從 2015 年開始問世的，而 Lerna 包含的東西非常多可以說是奠定了一套最完整的 Monorepo 架構(gòu)的基礎(chǔ)。

Lerna 提供了相當(dāng)多的 command 可以使用，其中最重要的兩個 command 分別是 lerna bootstrap 以及 lerna publish ，想了解更多 command 的讀者可以參考官網(wǎng)，筆者只會單純介紹這兩個好用的 command。

• lerna bootstrap：用來連結(jié)項目內(nèi)的 dependencies。
• lerna publish：用來發(fā)布 updated package。

還記得上面提到的 task coordination 嗎？Lerna 其實沒有比較優(yōu)化的 task coordination 流程，必須要一個 task 完成后才能執(zhí)行下一個 task，假如項目內(nèi)的 repo 有相依性的問題，這時候整體的 build 時間就會拉得很長。

然而 Turborepo 以及 Nx 都有完美做到 task coordination 的效果，下圖為 task coordination 的簡單事例，相信讀者應(yīng)該可以馬上感受出來整體在 build 的過程中的時間差。

不過 Lerna 在最新的 v5 版本中加入了不少元素，最大的特點莫過于可以跟 Nx 結(jié)合并且使用一些 Nx 才有的功能，例如：Local computation caching、Project graph visualization 甚至是 task coordination 等等，讓 Lerna 不會被時代的推進(jìn)而淘汰。

使用的方式也很簡單，只要將根目錄下的 lerna.json 中加上 useNx: true 這個條件即可使用 Nx 的功能，當(dāng)然讀者也要記得安裝 Nx 才能真的使用這些功能喔。

總結(jié)

這次文章介紹了在 React 中比較主流的三大 Monerepo 框架，這三個框架彼此都有各自的優(yōu)缺點，所以沒有絕對的好用跟不好用，一切都可以取決于自己的喜好來做選擇喔！

不過由于筆者自己本身是寫 React 的，也用了不少 Vercel 團隊的工具，例如 Next.js、swr 等，所以一開始筆者接觸的 Monorepo 框架也是先從 Turborepo 開始，但用著用著后續(xù)也覺得 Nx 更好用一些所以就打算寫一篇文章來比較各個常見的 Monorepo 框架了，希望能藉此幫助到跟我一樣有選擇障礙的讀者XD。