用 Yarn 取代 NPM 管理 JavaScript 套件版本

原文轉錄自: 用 Yarn 取代 Npm 管理 JavaScript 套件版本

新一代戰神 Yarn 終於在昨天出爐了,Yarn 跟 Npm 一樣都是 JavaScript 套件版本管理工具,但是 Npm 令人詬病的是安裝都是非常的慢,快取機制用起來效果也不是很好,所以 Yarn 的出現解決了這些問題,透過 Yarn 安裝過的套件都會在家目錄產生 Cache (目錄在 ~/.yarn-cache/),也就是只要安裝過一次,下次砍掉 node_modules 目錄重新安裝都會從 Cache 讀取。Yarn 詳細的功能架構可以參考 Facebook 發表的 Yarn: A new package manager for JavaScript,本篇不會教大家怎麼使用 Yarn,因為指令實在是太容易了,可以參考官方提供的如何從 npm 轉換到 yarn,底下則是來測試比較兩者安裝套件的速度。

前置準備

你可以用任何機器會筆電來做底下測試,或者是直接拿此 Dockerfile 在個人環境先產生乾淨的 Image,Dockerfile 內容很短,也可以從底下複製

FROM node:6.7.0

RUN curl -o- -L https://yarnpkg.com/install.sh | bash && \
  echo "" >> ~/.bashrc && \
  echo 'export PATH="$HOME/.yarn/bin:$PATH"' >> ~/.bashrc

CMD /bin/bash

請準備好底下版本

  • node version: v6.7.0
  • npm verison: 3.10.3
  • yarn verison: 0.15.1

可以自己拿任何專案的 package.json 或是下載我放在 Github 的 package.json 來做測試。

測試 package 安裝速度

第一階段就是沒有任何 Cache 之下來測試安裝速度

$ npm cache clean
$ npm install

結果: 93.00 秒

$ yarn cache clean
$ yarn install

結果: 42.80s

第二階段就是保留 node_modules 目錄,在下一次安裝

$ npm install

結果: 13.00 秒

$ yarn install

結果: 0.16 秒 (注意連 1 秒都不到 XD)

結論

npm yarn
install without cache 93000ms 42800ms
install with cache 13000ms 160ms

上面表格將數據整理好,如果要搞 Devops 至少可以省下將近 13 秒的時間,如果是 Local 團隊開發省下的時間更多了。結論就是大家趕快從 npm 轉到 yarn 吧,yarn 出來不到一個禮拜已經超過 1 萬多個 Star 了,看到開發團隊內包含了許多 Google 前端大神,這讓我更放心的轉換到 Yarn。寫完本篇才發現官方也有提供效能比較表。本文提到的數據及檔案都有一併放到 Github Repo

本帖已被设为精华帖!
本帖由系统于 7年前 自动加精
《L01 基础入门》
我们将带你从零开发一个项目并部署到线上,本课程教授 Web 开发中专业、实用的技能,如 Git 工作流、Laravel Mix 前端工作流等。
《G01 Go 实战入门》
从零开始带你一步步开发一个 Go 博客项目,让你在最短的时间内学会使用 Go 进行编码。项目结构很大程度上参考了 Laravel。
讨论数量: 14

不爽,原来用 npm install 的间隙还能沏一杯茶,做套眼保健操。用了 yarn install 还没站起来就完成了。:worried:

7年前 评论
leo

yarn默认使用facebook的registry,国内是被墙的,经测试yarn可以直接使用npm的registry,所以直接换上淘宝的源即可

yarn config set registry 'https://registry.npm.taobao.org'

7年前 评论

不爽,原来用 npm install 的间隙还能沏一杯茶,做套眼保健操。用了 yarn install 还没站起来就完成了。:worried:

7年前 评论

前端的各种工具和框架真是更新换代太快,从grunt到gulp再到webpack,从jquery时代再到MVVM时代,现在Npm难道也要淘汰?:worried:

7年前 评论
appleboy

誰叫 npm 一堆 issue 不解,只能靠 Facebook 團隊來解決這問題,不過看到官方 npm blog,他們好像也是不以為意。

7年前 评论
appleboy

@Macken Yarn 提供了 Offline Install Package,解決了網路 Issue。增加部署速度 ...

7年前 评论
leo

yarn默认使用facebook的registry,国内是被墙的,经测试yarn可以直接使用npm的registry,所以直接换上淘宝的源即可

yarn config set registry 'https://registry.npm.taobao.org'

7年前 评论
appleboy

@leo Yes 沒錯,可以自己換國內 registry 就可以了。

7年前 评论
appleboy

@zhuzhichao 之前用 mac 安裝,mac 風扇鬼哭神嚎,換了 yarn 後,奇怪怎麼一下子就裝好了,風扇才開始要加速就停止了 XD

7年前 评论

@appleboy 反正每次看到 npm install 我的内心是拒绝的,经常要重复好多次

7年前 评论

好强呀,运维吗。。

7年前 评论

lock 文件机制也很棒 :+1:

7年前 评论

太棒了,之前有些包一直安装失败,现在终于成功了,而且速度杠杠的

7年前 评论
appleboy

目前已經有 0.16 版本了,大家可以試試看

Support auth for private npm packages

7年前 评论
lijinma

使用了,喜欢 lock 文件。

7年前 评论
monkey

已转入 yarn 的怀抱

7年前 评论

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容,与人为善,比聪明更重要!