2
Wechat search [Great Relocation to the World], I will share with you the front-end industry trends, learning methods, etc. as soon as possible.
This article GitHub https://github.com/qq449245884/xiaozhi has been included, there are complete test sites, materials and my series of articles for interviews with first-line manufacturers.

foreword

Today's article mainly compares the currently more popular Monorepo framework.

Turborepo

image.png

The first is Turborepo. The last article only mentioned the use of Turborepo. Today, this article will mention the related concepts of Turborepo!

Truborepo is a fairly lightweight framework that can quickly build a Monorepo architecture. This framework was developed by a well-known engineer, Jared Palmer , and subsequently maintained by the well-known vercel team.

Although Turborepo is a fairly new framework that came out in 2021, there may be many problems and projects to be optimized in the future, but after all, vercel is helping behind the scenes, so readers can actually use it without worrying about XD

Turborepo has the following features:

  • Faster, incremental builds: Faster build speed.
  • Content-aware hashing: Automatically view all files in the project to build, instead of using timestamp to decide which files need to be built.
  • Cloud caching: Share cloud build caching to speed up CI/CD builds.
  • Parallel execution: Efficiently utilize the performance of all CPU cores without wasting idle CPU performance.
  • Task pipelines: Define the relationship of tasks, so that Turborepo can optimally determine the build timing of these tasks.
  • Pruned subsets: Accelerate the deployment performance of Platform as a Service (Paas) by creating subsets.
  • Convention-based config: Utilize JSON file to reduce complexity.

With the above features, Turborepo can become a useful Monorepo framework that is both easy to use and has project performance.

Nx

image.png

Nx is a very useful Monorepo framework. It has a lot of built-in useful tools for developers to use. This framework is also used by most people to compare with Turborepo.

Compared with Turborepo, Nx came out in 2018, so overall there must be better optimization and better development experience. Next, I will introduce some useful tools that I use when using this framework. , if readers want to play with Nx in the future, they may as well try these functions.

  • Local computation caching: The local side reads and caches the content that has already been built, so that the subsequent build process does not need to spend time building previous files, thereby speeding up the overall build time of the project.
  • Project graph visualization: An interactive graphical interface that allows developers to quickly know the dependencies between projects, and to check whether any repo references the wrong repo.

If you want to achieve this in Turborepo, you must install a tool called Graphviz, and this tool can only generate patterns and cannot generate an interactive interface.

  • task coordination: task coordination, which can synchronize the tasks of the project repo build to speed up the entire build process. The detailed content will be introduced to readers when Lerna is introduced below.

In addition to the above features, the author thinks that Nx has another feature that is better than Turborepo. On the display of the terminal, Nx gives people a clear feeling at a glance, you can know which files are being built and there are also color distinctions.

In addition to the difference in terminal display, Nx also beats Turborepo in build time thanks to local caching.

Lerna

image.png

Compared with the Nx and Turborepo mentioned above, Lerna 's Monorepo framework can be said to be the oldest. It has been in existence since 2015, and Lerna contains a lot of things. It can be said that it has established a set of the most complete Monorepo. The foundation of architecture.

Lerna provides quite a few command that can be used. The two most important commands are lerna bootstrap and lerna publish . Readers who want to know more commands can refer to On the official website , the author will only introduce these two useful commands.

  • lerna bootstrap: used to link dependencies within the project.
  • lerna publish: used to publish the updated package.

Remember the task coordination mentioned above? In fact, Lerna does not have an optimized task coordination process. The next task can only be executed after a task is completed. If the repo in the project has a dependency problem, the overall build time will be very long.

However, both Turborepo and Nx have the effect of perfectly achieving task coordination . The following picture shows a simple example of task coordination. I believe readers should immediately feel the overall time difference in the build process.

image.png

However, Lerna has added a lot of elements in the latest v5 version. The biggest feature is that it can be combined with Nx and use some Nx-only functions, such as: Local computation caching , Project graph visualization and even task coordination , etc., let Lerna It will not be eliminated by the advancement of the times.

The way to use it is also very simple. Just add useNx: true to the lerna.json in the root directory to use the functions of Nx. Of course, readers must remember to install Nx to really use these functions.

image.png

Summarize

This article introduces the three major Monerepo frameworks that are more mainstream in React. These three frameworks have their own advantages and disadvantages, so there is no absolute easy to use or bad. Everything can depend on your own preferences. oh!

However, since the author himself wrote React, and also used a lot of tools from the Vercel team, such as Next.js, swr, etc., the Monorepo framework that the author came into contact with at the beginning also started with Turborepo, but after using it, I also felt that Nx is better to use, so I plan to write an article to compare various common Monorepo frameworks, hoping to help readers who have a choice barrier like me XD

The bugs that may exist in editing cannot be known in real time. In order to solve these bugs afterwards, a lot of time is spent on log debugging. By the way, here is a useful BUG monitoring tool , Fundebug .

Author: Andy Chen Translator: Xiaozhi Source: medium

Original: https://medium.com/tarbugs/%E5%B8%B8%E8%A6%8B%E7%9A%84-monorepo-%E6%A1%86%E6%9E%B6%E5%A4% A7%E6%AF%94%E8%BC%83-bf49f921668a

comminicate

If you have dreams and dry goods, you can search for [Great Move to the World] on WeChat and pay attention to this Shawanzhi who is still washing dishes in the early hours of the morning.

This article GitHub https://github.com/qq449245884/xiaozhi has been included, there are complete test sites, materials and my series of articles for interviews with first-line manufacturers.


王大冶
68.1k 声望105k 粉丝