TypeScript ベストプラクティス

TypeScript アプリケーションの包括的なパフォーマンス最適化ガイド。自動リファクタリングとコード生成を導くため、8 カテゴリーにわたる 45 のルールが影響度順に優先付けされています。

適用のタイミング

以下の場合にこのガイドラインを参照してください：

• 新規または既存プロジェクト用に tsconfig.json を設定する場合
• 複雑な型定義またはジェネリクスを記述する場合
• async/await パターンとデータ取得を最適化する場合
• モジュールを整理しインポートを管理する場合
• コンパイルまたはランタイムパフォーマンスのためにコードをレビューする場合

ルールカテゴリーの優先度

目次

1. 型システムパフォーマンス — CRITICAL
   • 1.1 エクスポートされた関数に明示的な戻り型を追加 — CRITICAL (宣言出力が 30-50% 高速化)
   • 1.2 深くネストされたジェネリック型を回避 — CRITICAL (指数関数的なインスタンス化コストを防止)
   • 1.3 大規模な共用型を回避 — CRITICAL (二次 O(n²) 比較コストを軽減)
   • 1.4 条件型を名前付きエイリアスに抽出 — CRITICAL (コンパイラーキャッシングを有効化、再評価を防止)
   • 1.5 型再帰の深さを制限 — HIGH (該当時に指数関数的な型展開を防止)
   • 1.6 型交差よりもインターフェースを推奨 — CRITICAL (型解析が 2-5 倍高速化)
   • 1.7 複雑なマップ型を単純化 — HIGH (該当時に型計算を 50-80% 削減)
2. コンパイラー設定 — CRITICAL
   • 2.1 Include と Exclude を適切に設定 — CRITICAL (不要なファイルスキャン数千件を防止)
   • 2.2 インクリメンタルコンパイルを有効化 — CRITICAL (リビルドが 50-90% 高速化)
   • 2.3 並列宣言出力用に isolatedDeclarations を有効化 — CRITICAL (型チェッカーなしで並列 .d.ts 生成を有効化)
   • 2.4 高速ビルド用に skipLibCheck を有効化 — CRITICAL (コンパイルが 20-40% 高速化)
   • 2.5 高速な分散チェック用に strictFunctionTypes を有効化 — CRITICAL (最適化された分散チェックを有効化)
   • 2.6 Node.js ネイティブ TypeScript 用に erasableSyntaxOnly を使用 — HIGH (Node.js 型削除ランタイムエラーの 100% を防止)
   • 2.7 単一ファイルトランスピレーション用に isolatedModules を使用 — CRITICAL (バンドラーを使用した場合トランスピレーションが 80-90% 高速化)
   • 2.8 大規模コードベース用にプロジェクト参照を使用 — CRITICAL (インクリメンタルビルドが 60-80% 高速化)
3. Async パターン — HIGH
   • 3.1 Async 関数の戻り型を注釈付ける — HIGH (ランタイムエラーを防止、推論を改善)
   • 3.2 ループ内の await を回避 — HIGH (N 回の反復で N 倍高速化、10 ユーザー = 10 倍改善)
   • 3.3 不要な async/await を回避 — HIGH (自明な Promise ラッパーを排除しスタックトレースを改善)
   • 3.4 値が必要になるまで await を遅延 — HIGH (暗黙的な並列化を有効化)
   • 3.5 独立した操作に Promise.all を使用 — HIGH (I/O バウンドコードで 2-10 倍改善)
4. モジュール構成 — HIGH
   • 4.1 バレルファイルインポートを回避 — HIGH (200-800ms インポートコスト、30-50% 大きなバンドル)
   • 4.2 循環依存を回避 — HIGH (ランタイム undefined エラーと低速コンパイルを防止)
   • 4.3 @types パッケージの包含を制御 — HIGH (型競合を防止しメモリ使用量を削減)
   • 4.4 大規模モジュール用に動的インポートを使用 — HIGH (初期バンドルを 30-70% 削減)
   • 4.5 型専用の import 構文を使用 — HIGH (型情報用のランタイムインポートを排除)
5. 型安全パターン — MEDIUM-HIGH
   • 5.1 noUncheckedIndexedAccess を有効化 — MEDIUM-HIGH (チェックされていないインデックスアクセスエラーの 100% をコンパイル時に防止)
   • 5.2 strictNullChecks を有効化 — MEDIUM-HIGH (null/undefined ランタイムエラーを防止)
   • 5.3 any より unknown を推奨 — MEDIUM-HIGH (型絞り込みを強制しランタイムエラーを防止)
   • 5.4 検証用にアサーション関数を使用 — MEDIUM-HIGH (検証ボイラープレートを 50-70% 削減)
   • 5.5 リテラル型用に const アサーションを使用 — MEDIUM-HIGH (リテラル型を保持し推論を改善)
   • 5.6 共用型に網羅的チェックを使用 — MEDIUM-HIGH (欠落ケースエラーの 100% をコンパイル時に防止)
   • 5.7 ランタイム型チェック用に型ガードを使用 — MEDIUM-HIGH (型アサーションを排除し境界でエラーをキャッチ)
6. メモリ管理 — MEDIUM
   • 6.1 クロージャーメモリリークを回避 — MEDIUM (長命コールバック内の保持参照を防止)
   • 6.2 グローバル状態の蓄積を回避 — MEDIUM (無制限のメモリ成長を防止)
   • 6.3 イベントリスナーをクリーンアップ — MEDIUM (無制限のメモリ成長を防止)
   • 6.4 タイマーと間隔をクリア — MEDIUM (コールバック保持と重複実行を防止)
   • 6.5 オブジェクトメタデータに WeakMap を使用 — MEDIUM (メモリリークを防止し自動クリーンアップを有効化)
7. ランタイム最適化 — LOW-MEDIUM
   • 7.1 ホットループ内のオブジェクトスプレッドを回避 — LOW-MEDIUM (オブジェクト割り当てを N 倍削減)
   • 7.2 ループ内のプロパティアクセスをキャッシュ — LOW-MEDIUM (ホットパス内のプロパティ参照を N 倍削減)
   • 7.3 Lodash より Lodash ネイティブ配列メソッドを推奨 — LOW-MEDIUM (ライブラリオーバーヘッドを排除しツリーシェイキングを有効化)
   • 7.4 単純な反復に for-of を使用 — LOW-MEDIUM (反復ボイラープレートを 30-50% 削減)
   • 7.5 モダン文字列メソッドを使用 — LOW-MEDIUM (正規表現より 2-5 倍高速)
   • 7.6 O(1) 検索に Set/Map を使用 — LOW-MEDIUM (検索あたり O(n) から O(1) に)
8. 高度なパターン — LOW
   • 8.1 型安全 ID に Branded Types を使用 — LOW (互換性のない ID 型の混在を防止)
   • 8.2 型検証と推論に satisfies を使用 — LOW (プロパティアクセスエラーを防止し 100% のオートコンプリート精度を有効化)
   • 8.3 文字列パターンにテンプレートリテラル型を使用 — LOW (文字列フォーマットエラーの 100% をコンパイル時に防止)

参考資料

1. https://github.com/microsoft/TypeScript/wiki/Performance
2. https://www.typescriptlang.org/docs/handbook/
3. https://v8.dev/blog
4. https://nodejs.org/en/learn/diagnostics/memory