はじめに
typescript-eslint の型情報付き Lint(typed linting)を有効にした場合と、しない場合で、ESLint の処理時間がどのくらい変わるかを確認するコマンドをまとめます。コマンドは bash を前提に書き、zsh・fish・dash(sh)・PowerShell での書き方も載せます。
前提
- ESLint 9 のフラットコンフィグ(
eslint.config.js/eslint.config.ts) - typescript-eslint 8 系(TypeScript 6 系を使う場合は 8.58.0 以上)
計測手順
1. プロジェクトの ESLint が使われるか確認する
npx は、プロジェクト内(node_modules)にコマンドが見つからないと、npm から同名のパッケージを取得して実行します。--no-install を付けると、取得せずにプロジェクト内の ESLint だけを探します。
npx --no-install eslint --version
バージョンが表示されれば、プロジェクトの ESLint が使われます。
2. 型情報なしで計測する
time npx eslint src
出力の例です。
real 1m4.444s
user 0m49.438s
sys 0m4.175s
| 項目 | 意味 |
|---|---|
real |
コマンドの開始から終了までに実際にかかった時間 |
user |
CPU がプログラム自身の処理に使った時間 |
sys |
CPU がカーネルの処理(ファイル読み込みの依頼など)に使った時間 |
比べるのは real です。
--cache を付けると変更のないファイルの Lint が省略されるため、計測では付けません。
3. 型情報付き Lint を有効にする
TypeScript ファイル向けの設定の parserOptions に、次の2行を追加します。
{
files: ['src/**/*.{ts,tsx}'],
languageOptions: {
parserOptions: {
projectService: true, // 追加
tsconfigRootDir: import.meta.dirname, // 追加
},
},
},
-
projectService: true:ファイルごとに対応するtsconfig.jsonを自動で見つけて型解析する。 -
tsconfigRootDir:tsconfig.jsonを探す基準のフォルダ。import.meta.dirnameは Node.js 20.11 以降で使える。
この2行を追加すると、型情報を使うルールがなくても、ESLint は実行のたびに型解析を行います。
4. 設定が反映されたか確認する
--print-config は、指定したファイルに適用される最終的な設定を表示します。src 配下に実際にあるファイルを指定します。
npx eslint --print-config src/index.tsx | grep -E "projectService|tsconfigRootDir"
反映されていれば、次のように表示されます。
"projectService": true,
"tsconfigRootDir": "/path/to/project"
5. 型情報ありで計測する
手順2と同じコマンドで計測します。
time npx eslint src
real 1m36.408s
user 1m9.588s
sys 0m11.174s
この例では、型情報なしが約64秒、型情報ありが約96秒で、差は約32秒(約1.5倍)でした。
bash 以外のシェルでの書き方
time は bash に組み込まれたコマンドです。独立したプログラムではないため、シェルによって使えるかどうかと出力形式が異なります。
zsh
time npx eslint src
1行で出力され、total が bash の real に当たります。
npx eslint src 49.44s user 4.18s system 83% cpu 1:04.444 total
設定の確認コマンドは bash と同じです。
fish
fish 3.1 以降では time が使えます。
time npx eslint src
出力の Executed in が総時間です。
dash(sh)
dash には time が組み込まれていないため、time npx eslint src は time: not found になります。Debian 系の Linux では sh が dash です。
独立したプログラム版の time(/usr/bin/time)がインストールされていれば、それを使います。-p を付けると、real / user / sys の形式で秒数が表示されます。
/usr/bin/time -p npx eslint src
/usr/bin/time がない場合は、date で開始と終了の時刻を取って差を計算します。
start=$(date +%s); npx eslint src; end=$(date +%s); echo "$((end - start)) 秒"
bash がインストールされていれば、bash 経由でも実行できます。
bash -c "time npx eslint src"
PowerShell
Measure-Command を使います。
Measure-Command { npx eslint src }
出力の TotalSeconds が総時間です。Measure-Command は中のコマンドの出力を表示しないため、終了するまで画面には何も表示されません。
設定の確認は、grep の代わりに Select-String を使います。
npx eslint --print-config src/index.tsx | Select-String "projectService|tsconfigRootDir"
参考
- Linting with Type Information | typescript-eslint
- Command Line Interface Reference | ESLint
- Measure-Command | Microsoft Learn
JISOUのメンバー募集中!
プログラミングコーチングJISOUでは、新たなメンバーを募集しています。
日本一のアウトプットコミュニティでキャリアアップしませんか?
興味のある方は、ぜひホームページをのぞいてみてください!
▼▼▼
https://projisou.jp
