npmに代わる新たなパッケージマネージャーYarnを使ってみた

FacebookがJavaScriptの新たなパッケージマネージャー「Yarn」がローンチされましたね。Yarn・・npmの上位互換のような印象ですが・・どう違うんでしょうか？

キャッシュが効くからインストールが速い？やっぱりやってみないとわかりませんね。なので、実際に入れて試してみました。

ちなみにYarnは英語で「糸」という意味ですが、それは関係ある？

Yarnのインストール

Yarnはnpmを使用してインストールできます。

sudo npm install -g yarn

私の環境でインストールしてみたら以下のエラーが出力されました。

npm ERR! uid must be an unsigned int
npm ERR!
npm ERR! If you need help, you may report this error at:
npm ERR!     <https://github.com/npm/npm/issues>
npm ERR! Darwin 15.6.0
npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "install" "-g" "yarn"
npm ERR! node v6.2.1
npm ERR! npm  v3.10.8

すんなりインストールできると思ったのに・・とりあえずnodeとnpmのバージョンあげてみました。

Node.jsアップデート

$ sudo npm cache clean -f
$ sudo npm install -g n
$ sudo n stable
$ node -v

npmアップデート

$ sudo npm update -g npm
$ nam —version

再度Yarnをインストールしてみたら無事インストールができました！

Yarnを使ってみよう

早速Yarnで何か入れてみましょう。とりあえずReactを入れてみることにします。

packege.jsonを作成し、Reactをインストールします。

$ yarn init
$ yarn add react

初期化のコマンドはnpmと同じですね。ただ、インストールのコマンドは異なります。yarn addはnpm install -Dと同じになります。

他にも異なる点がありますので、よく使うコマンドを列挙します。

# npm update
$ yarn upgrade 
# npm uninstall
$ yarn remove

Yarnとnpmを比較してみる

Yarnとnpm、どこが違うのか比較してみました。

まずは、packege.jsonから。

npm

{
  "name": "npm",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}

Yarn

{
  "name": "yarn",
  "version": "1.0.0",
  "main": "index.js",
  "license": "MIT"
}

若干シンプルになっていますね。

次はモジュールインストールの速度を比較します。以前私が作成したreact-starterで使用したモジュール一覧を入れてみます。react-starterについては以前記事にしましたので、気になった方はそちらをご覧ください。

www.fact-of-life.com

使用するpackege.jsonの中身はこんな感じです。

"devDependencies": {
    "babel-preset-es2015": "^6.14.0",
    "babel-preset-react": "^6.11.1",
    "babel-register": "^6.14.0",
    "babelify": "^7.3.0",
    "browser-sync": "^2.14.3",
    "browserify": "^13.1.0",
    "gulp": "^3.9.1",
    "react": "^15.3.1",
    "react-dom": "^15.3.1",
    "vinyl-source-stream": "^1.1.0",
    "watchify": "^3.7.0"
  }

こちらをnpm installとyarn installを使って速度を比較します。Yarnはキャッシュが効いているか試したかったので、一度node_modulesを削除した後にもう一度実行してみました。（通信速度があまり速くない場所で行ったため、本来なら共にもう少し速いと思われます）

npm：80.89s
yarn(１回目)：47s
yarn(２回目)：12.76s

これは明らかですね。Yarnの方が速い！そして実際にキャッシュ効きますね。

まとめ

実際使ってみて比較してわかったことですが、特にYarnを使わないという選択肢はないと思います。むしろ、効率が良くなるのではないでしょうか。

本来はキャッシュ以外にもyarn.lockでより厳密にバージョンを固定するとかあるようですが、こちらは運用してみないとわかりませんね。。

実際に運用してさらなるメリットがありましたらまた記事にしたいと思います。