Denoを触ってみる
Denoとは
Deno（ディーノ）とは、JavaScript/TypeScriptのランタイム環境です。
Node.jsを開発したRyan Dahlが開発しており、2018年に開始されたJsConfで「Node.jsに関する10の反省点」というタイトルで発表されました。
では、具体的にNode.jsのどのような部分が反省点だったのでしょうか？
- APIの設計においてPromiseを使用しなかったこと
- 古いGYPビルドシステムを採用したこと
-
package.jsonとnode_modulesを採用したこと - モジュールのインポートで拡張子を除外したこと
- index.jsによりモジュール依存関係の解決を採用したこと
- JavaScriptのコアエンジンV8によるサンドボックス環境を破壊するような実装をしたこと
...
と挙げています。
それらの反省点を踏まえて、開発されたのがDenoです。
ロゴは、🦕ですね。
ちなみに、DenoはNodeのアナグラムとなっており、nodeをアルファベット順に並び替えるとDenoとなります。
Denoの特徴に関しては、他の記事で紹介されているので、詳細はそちらをご確認ください。
インストール
$ brew install deno
$ deno -V
deno 1.33.3
それでは、試しにcreate-react-appでアプリケーションを作ってみたいと思います。
$ deno install -A --unstable -n deno-create-react-app https://deno.land/x/create_react_app/mod.ts
$ deno-create-react-app init deno-sample
$ cd deno-sample
$ deno-create-react-app run
触ってみた第一印象は、起動が爆速だなという印象ですね。
あとは、無駄なコンソール出力も少なくミニマムな印象があります。
それでは、アプリのディレクトリ構造を見てみましょう。
びっくりするぐらい中身が少ないですね...
試しに、npmでcreate-react-appを実行した場合は、このような感じです。
比較すると、node_modulesがなく、package.jsonがないことが印象的です。
また、Reactの設定ファイルを見てみると、import部分にURLが直接記述されています。
export * as ReactDOM from "https://jspm.dev/react-dom@17.0.0"
import * as React from "https://jspm.dev/react@17.0.0"
const { default: any, ...rest } = React
const react = React.default
export { react as React }
export { rest as react }
これを見て分かる通り、node_modulesのようにパッケージをダウンロードするのではなく、レジストリと呼ばれる場所を参照しています。
ファイルをコンパイルする時に、importに記載されたモジュールをローカルにダウンロードし、キャッシュ化させています。
キャッシュ化されているので、コンパイル時に都度ダウンロードすることはないようです。
ただ、create-react-appのソースコードを見てみると、Reactを毎回URLでimportするのが煩わしいためか、deps.tsというファイルでReactを一度読み込んで、exportしてページで流用する方法を取っています。
トラブルシューティング
-
create-react-appを入れようとしたら、正常にインストールはできているようなんですが、PATHが通っていないと怒られました。
$ deno install -f -A --unstable -n deno-create-react-app https://deno.land/x/create_react_app/mod.ts
/Users/user/.deno/bin/deno-create-react-app
ℹ️ Add /Users/user/.deno/bin to PATH
export PATH="/Users/user/.deno/bin:$PATH"
- 自分の試し方が悪かったのか、
deno-create-react-app run -wを実行しても、ホットリロードが実行されませんでした...
Discussion