Tree Shakingは、JavaScriptの最適化技術の1つで、未使用のコード（関数、変数、モジュールなど）を自動的に検出して除去することを指します。この技術は、バンドルされたJavaScriptコードのサイズを削減し、パフォーマンスの向上やロード時間の短縮を実現するために使われます。
Tree Shakingの名前は、コードの依存関係を木構造（ツリー）として表現し、未使用の部分を「揺り落とす」（shake off）ことからきています。具体的には、以下のようなプロセスでTree Shakingが行われます：
- 静的解析: ビルドツール（例: Webpack）は、コードベースを静的に解析し、モジュールの依存関係を特定します。これによって、どの関数や変数がどのモジュールで使用されているかが把握されます。
- 未使用コードの特定: 静的解析に基づいて、コードベース内で使用されていない（参照されていない）関数や変数を特定します。これには、条件分岐や動的なコードパスの解析も含まれます。
- 除去: 未使用のコードを除去することで、バンドルされた最終的なJavaScriptコードのサイズを減少させます。これによって、ユーザーがダウンロードするファイルのサイズが小さくなり、ページの読み込みが高速化します。
Tree Shakingは、特にモジュールシステム（例: ES6モジュール）を使用する場合に効果的です。ただし、一部の条件下では正確な未使用コードの検出が難しい場合があります。例えば、動的なインポートや外部ライブラリの使用などが挙げられます。
Tree Shakingを実現するためには、適切なビルドツールや設定を使用する必要があります。例えば、Webpackではmodeオプションを "production"に設定することで、自動的にTree Shakingが有効になります。また、必要に応じて手動で未使用コードを記述することも可能です。