# 通知設計書 24-NoAsyncChunksWarning

## 概要

本ドキュメントは、Webpackにおける `NoAsyncChunksWarning` の通知仕様を定義する。パフォーマンス警告（アセットサイズ超過やエントリーポイントサイズ超過）が発生しているにもかかわらず、非同期チャンク分割が使用されていない場合に、コード分割の推奨を行う警告クラスである。

### 本通知の処理概要

NoAsyncChunksWarningは、Webpackビルドの出力フェーズ（afterEmit）において、他のパフォーマンス警告（AssetsOverSizeLimitWarning, EntrypointsOverSizeLimitWarning）が発行されている状況下で、非同期チャンクが一つも存在しない場合に追加で発行される推奨警告である。

**業務上の目的・背景**：パフォーマンス問題が検出された際に、その最も効果的な解決策であるコード分割（dynamic import()やrequire.ensure）の利用を開発者に提案するために必要な警告である。サイズ超過警告だけでは「何をすべきか」が明確でないため、具体的なアクション指針としてこの追加警告が発行される。

**通知の送信タイミング**：compiler.hooks.afterEmitフック実行時に、SizeLimitsPluginがサイズ超過警告を発行した後、非同期チャンクの存在を確認する。非同期チャンクが一つも存在しない場合にのみ発行される。

**通知の受信者**：Webpackビルドを実行する開発者。他のパフォーマンス警告と同じリストに追加される。

**通知内容の概要**：コード分割の推奨メッセージ。import()またはrequire.ensureを使った遅延読み込みの提案と、Webpackコード分割ガイドへのリンクを含む固定メッセージ。

**期待されるアクション**：開発者は、アプリケーションの一部をdynamic import()で分割し、非同期チャンクを生成する。これにより初期読み込みサイズが削減される。

## 通知種別

ビルド警告（Webpack Compilation Warning）またはビルドエラー（performance.hints = "error" の場合）。コンソール出力およびStats APIを通じて開発者に通知される。

## 送信仕様

### 基本情報

| 項目 | 内容 |
|-----|------|
| 送信方式 | 同期（afterEmitフック内で即座に生成） |
| 優先度 | 中（推奨レベル） |
| リトライ | なし（一度きりの警告発行） |

### 送信先決定ロジック

SizeLimitsPlugin内で、他のパフォーマンス警告が存在し、かつcompilation.chunksに初期チャンクでないチャンク（非同期チャンク）が一つも見つからない場合に生成される。

## 通知テンプレート

### メール通知の場合

該当なし。本通知はメール通知ではなく、Webpackビルド出力として表示される。

### 本文テンプレート

```
WARNING in webpack performance recommendations:
You can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application.
For more info visit https://webpack.js.org/guides/code-splitting/
```

### 添付ファイル

該当なし。

## テンプレート変数

| 変数名 | 説明 | データ取得元 | 必須 |
|--------|------|-------------|-----|
| name | 警告名 | 固定値 "NoAsyncChunksWarning" | Yes |

本クラスはコンストラクタ引数を取らず、固定メッセージを使用する。

## 送信トリガー・条件

### トリガー一覧

| トリガー種別 | トリガーイベント | 送信条件 | 説明 |
|------------|----------------|---------|------|
| フック実行 | compiler.hooks.afterEmit | (1) 他のパフォーマンス警告が1件以上存在し、かつ (2) compilation.chunksに非同期チャンクが1つも存在しない | SizeLimitsPluginが検査 |

### 送信抑止条件

| 条件 | 説明 |
|-----|------|
| performance.hints が false/未設定 | パフォーマンスヒント自体が無効化されている場合 |
| 他のパフォーマンス警告なし | AssetsOverSizeLimitWarning も EntrypointsOverSizeLimitWarning も発行されていない場合 |
| 非同期チャンクが存在する | compilation.chunks内に canBeInitial() === false のチャンクが1つでもある場合 |

## 処理フロー

### 送信フロー

```mermaid
flowchart TD
    A[SizeLimitsPlugin: パフォーマンス警告チェック完了] --> B{warnings配列にパフォーマンス警告あり?}
    B -->|No| C[終了]
    B -->|Yes| D[compilation.chunksから非同期チャンクを検索]
    D --> E{非同期チャンクが存在?}
    E -->|Yes| F[NoAsyncChunksWarningはスキップ]
    E -->|No| G[NoAsyncChunksWarning生成]
    G --> H{hints === 'error'?}
    H -->|Yes| I[compilation.errorsに追加]
    H -->|No| J[compilation.warningsに追加]
    F --> K[終了]
    I --> K
    J --> K
```

## データベース参照・更新仕様

### 参照テーブル一覧

該当なし。Webpackはデータベースを使用しない。

### 更新テーブル一覧

該当なし。

## エラー処理

### エラーケース一覧

| エラー種別 | 発生条件 | 対処方法 |
|----------|---------|---------|
| 該当なし | - | - |

### リトライ仕様

| 項目 | 内容 |
|-----|------|
| リトライ回数 | なし |
| リトライ間隔 | 該当なし |
| リトライ対象エラー | 該当なし |

## 配信設定

### レート制限

| 項目 | 内容 |
|-----|------|
| 1分あたり上限 | 制限なし（ビルド1回につき最大1つの警告） |
| 1日あたり上限 | 制限なし |

### 配信時間帯

制限なし。ビルド実行時に即座に警告が生成される。

## セキュリティ考慮事項

固定メッセージのみであり、動的なデータは含まれない。セキュリティ上のリスクはない。

## 備考

- WebpackErrorを基底クラスとして継承している
- コンストラクタ引数なし。固定メッセージのみ
- 必ずAssetsOverSizeLimitWarningまたはEntrypointsOverSizeLimitWarningと共に発行される（単独では発行されない）
- `find` ユーティリティ関数（lib/util/SetHelpers.js）でSet内の非同期チャンクを検索
- Webpackコード分割ガイドへのURL（https://webpack.js.org/guides/code-splitting/）を含む

---

## コードリーディングガイド

本通知を理解するために参照すべきファイルと、推奨する読み解き順序を以下に示す。

### 推奨読解順序

#### Step 1: データ構造を理解する

NoAsyncChunksWarningは非常にシンプルなクラスである。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 1-1 | WebpackError.js | `lib/WebpackError.js` | 基底クラス |
| 1-2 | NoAsyncChunksWarning.js | `lib/performance/NoAsyncChunksWarning.js` | 引数なしコンストラクタ。固定メッセージのみ |

**読解のコツ**: 全21行の非常にシンプルなクラス。メッセージ文字列はコンストラクタ内にハードコードされている。

#### Step 2: エントリーポイントを理解する

SizeLimitsPluginにおける発行条件を理解する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 2-1 | SizeLimitsPlugin.js | `lib/performance/SizeLimitsPlugin.js` | 164-171行目で非同期チャンクの存在確認とNoAsyncChunksWarning生成 |

**主要処理フロー**:
1. **164行目**: `if (warnings.length > 0)` - 他のパフォーマンス警告が存在するか確認
2. **165-168行目**: `find(compilation.chunks, (chunk) => !chunk.canBeInitial())` - 非同期チャンクを検索
3. **170行目**: someAsyncChunkがundefined（見つからない）場合
4. **171行目**: `warnings.push(new NoAsyncChunksWarning())` - 警告を追加

#### Step 3: チャンクの初期/非同期判定を理解する

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 3-1 | SetHelpers.js | `lib/util/SetHelpers.js` | find関数の実装 |

**主要処理フロー**:
- `chunk.canBeInitial()` がfalseの場合、そのチャンクは非同期チャンク（on-demand chunk）であると判定

### プログラム呼び出し階層図

```
compiler.hooks.afterEmit
    |
    +-- SizeLimitsPlugin.apply() (78行目)
            |
            +-- [AssetsOverSizeLimitWarning 検査] (147-153行目)
            +-- [EntrypointsOverSizeLimitWarning 検査] (155-162行目)
            |
            +-- warnings.length > 0 チェック (164行目)
                    |
                    +-- find(compilation.chunks, chunk => !chunk.canBeInitial()) (165-168行目)
                    |       |
                    |       +-- chunk.canBeInitial() で各チャンクを判定
                    |
                    +-- new NoAsyncChunksWarning() (171行目)
                    |
                    +-- compilation.warnings.push() または compilation.errors.push() (174-178行目)
```

### データフロー図

```
[入力]                         [処理]                         [出力]

warnings[] (他の警告) -------> warnings.length > 0 チェック
                                |
compilation.chunks ----------> find(非同期チャンク検索) ---> NoAsyncChunksWarning
                                |                              |
performance.hints ------------> 出力先判定                     v
                                                       compilation.warnings[]
                                                       または compilation.errors[]
```

### 関連ファイル一覧

| ファイル | パス | 種別 | 役割 |
|---------|------|------|------|
| NoAsyncChunksWarning.js | `lib/performance/NoAsyncChunksWarning.js` | ソース | 警告クラス本体 |
| SizeLimitsPlugin.js | `lib/performance/SizeLimitsPlugin.js` | ソース | 警告の生成・発行を行うプラグイン |
| WebpackError.js | `lib/WebpackError.js` | ソース | 基底エラー/警告クラス |
| SetHelpers.js | `lib/util/SetHelpers.js` | ソース | find関数の実装 |
