VS Codeのエージェントモードを拡張するには、を試してください!

ディスクパフォーマンスを向上させる

Dev Containers拡張機能は、デフォルトでローカルファイルシステムのソースコードに「バインドマウント」を使用します。これは最も簡単なオプションですが、macOSとWindowsでは、コンテナ内からyarn installのようなコマンドを実行すると、ディスクパフォーマンスが低下する可能性があります。これらの種類の問題を解決するためにできることがいくつかあります。

Windows上のWSL 2ファイルシステムにソースコードを保存する

Windows 10 2004以降には、完全なLinuxカーネルを提供し、WSL 1と比較してパフォーマンスが大幅に向上したWindows Subsystem for Linux (WSL 2) の改良版が含まれています。Docker Desktop 2.3以降には、VMではなくWSLでDockerを実行する新しいWSL 2エンジンが含まれています。したがって、WSL 2ファイルシステムにソースコードを保存すると、権限設定のようなものに対する互換性の向上とともに、パフォーマンスの改善が見られます。

VS Codeからこの新しいエンジンを使用する方法の詳細については、「WindowsでWSL 2フォルダをコンテナで開く」を参照してください。

ビデオ: WindowsでDev Containersを高速化する

コンテナボリュームにリポジトリをクローンを使用する

Dev Containers: コンテナボリュームにリポジトリをクローン...」コマンドは、ローカルファイルシステムにバインドする代わりに、隔離されたローカルのDocker名前付きボリュームを使用します。ファイルツリーを汚染しないだけでなく、ローカルボリュームはWindowsとmacOSでのパフォーマンス向上という追加の利点があります。

このアプローチの使用方法の詳細については、「隔離されたコンテナボリュームでGitリポジトリまたはGitHub PRを開く」を参照してください。

次の2つのセクションでは、他のシナリオで名前付きボリュームを使用する方法について説明します。

ターゲットとなる名前付きボリュームを使用する

macOSとWindowsはVMでコンテナを実行するため、「バインド」マウントはコンテナのファイルシステムを直接使用するほど高速ではありません。幸いにも、Dockerにはローカルの「名前付きボリューム」という概念があり、これはコンテナのファイルシステムのように機能しますが、コンテナの再構築後も存続します。これにより、書き込みパフォーマンスが重要となるnode_modulesのようなパッケージフォルダ、データフォルダ、またはbuildのような出力フォルダの保存に最適です。devcontainer.jsonで参照するものに基づいて、以下の適切な手順に従ってください。

Dockerfileまたはイメージ:

yarn installを高速化する方法を説明するために、vscode-remote-try-nodeリポジトリを使用しましょう。

次の手順に従ってください

  1. devcontainer.jsonworkspaceMountプロパティを使用して、VS Codeにソースコードをバインドする場所を指示します。次に、mountsプロパティ (VS Code 1.41+) を使用して、node_modulesサブフォルダを代わりに名前付きローカルボリュームにマウントします。

    "mounts": [
        "source=${localWorkspaceFolderBasename}-node_modules,target=${containerWorkspaceFolder}/node_modules,type=volume"
    ]
    

    注意: sourceでは、${localWorkspaceFolderBasename}${devcontainerId}、またはハードコードされた名前を使用できます。

  2. このリポジトリは非ルートユーザー「node」としてVS Codeを実行するため、ユーザーがフォルダにアクセスできることを確認するためにpostCreateCommandを追加する必要があります。

    "remoteUser": "node",
    "mounts": [
        "source=${localWorkspaceFolderBasename}-node_modules,target=${containerWorkspaceFolder}/node_modules,type=volume"
    ],
    "postCreateCommand": "sudo chown node node_modules"
    

    コンテナをrootとして実行する場合は、この2番目の手順は不要です。

既にコンテナをビルドして接続している場合は、変更を適用するためにコマンドパレット (F1) から「Dev Containers: コンテナを再ビルド」を実行します。それ以外の場合は、コンテナに接続するために「Dev Containers: コンテナでフォルダを開く...」を実行します。

このアプローチに関する2つの注意点

  1. コンテナ内のnode_modulesフォルダを削除すると、ボリュームへの接続が失われる可能性があります。必要な場合は、代わりにnode_modulesフォルダの内容を削除してください (rm -rf node_modules/* node_modules/.*)。

  2. この方法では、空のnode_modulesフォルダがローカルに作成されることがわかります。これは、コンテナ内のボリュームマウントポイントがローカルファイルシステムのバインドマウント内にあるためです。これは予期された動作であり、問題ありません。

Docker Compose:

vscode-remote-try-nodeはDocker Composeを使用しませんが、手順は似ており、ボリュームマウント構成は別のファイルに配置されます。

  1. Docker Composeファイル(または拡張されたファイル)で、適切なサービスにnode_modulesサブフォルダへの名前付きローカルボリュームマウントを追加します。例:

    version: '3'
    services:
      your-service-name-here:
        volumes:
          # Or wherever you've mounted your source code
          - .:/workspace:cached
          - try-node-node_modules:/workspace/node_modules
        # ...
    
    volumes:
      try-node-node_modules:
    
  2. 次に、devcontainer.jsonworkspaceFolderプロパティが、実際のソースコードがマウントされている場所と一致していることを確認してください。

    "workspaceFolder": "/workspace"
    
  3. コンテナをroot以外のユーザーで実行している場合は、rootとしてマウントされている可能性があるため、マウントするフォルダの所有者を更新するためにpostCreateCommandを追加します。user-name-goes-hereを適切なユーザーに置き換えてください。

    "remoteUser": "node",
    "workspaceFolder": "/workspace",
    "postCreateCommand": "sudo chown user-name-goes-here node_modules"
    

既にコンテナをビルドして接続している場合は、変更を適用するためにコマンドパレット (F1) から「Dev Containers: コンテナを再ビルド」を実行します。それ以外の場合は、コンテナに接続するために「Dev Containers: コンテナでフォルダを開く...」を実行します。

ビデオ: 開発コンテナでnpmインストールを高速化する

ソースツリー全体に名前付きボリュームを使用する

最後に、上記のオプションのいずれもニーズに合わない場合は、さらに一歩進んで、ローカルではなく名前付きボリューム内にソースツリー全体をクローンすることができます。既存のdevcontainer.json構成を取得し、次のように変更することで名前付きボリュームを設定できます(your-volume-name-hereをボリュームに付けたい名前に更新します)。

devcontainer.jsonで参照するものに応じて

  • Dockerfileまたはイメージ: ローカルの名前付きボリュームをコンテナにマウントするには、devcontainer.jsonで以下のプロパティを使用します。

    "workspaceMount": "source=your-volume-name-here,target=/workspace,type=volume"
    "workspaceFolder": "/workspace",
    
  • Docker Compose: docker-compose.ymlを、適切なサービスに対して以下で更新(または拡張)します。

    version: '3'
    services:
      your-service-name-here:
        volumes:
            - your-volume-name-here:/workspace
        # ...
    
    volumes:
      your-volume-name-here:
    

    また、devcontainer.jsonworkspaceFolderプロパティが、ボリュームがマウントされている場所(またはボリューム内のサブフォルダ)と一致していることを確認してください。

    "workspaceFolder": "/workspace"
    

既にコンテナをビルドして接続している場合は、変更を適用するためにコマンドパレット (F1) から「Dev Containers: コンテナを再ビルド」を実行します。それ以外の場合は、コンテナに接続するために「Dev Containers: コンテナでフォルダを開く...」を実行します。

次に、コマンドパレットから「Git: クローン」コマンドを使用するか、統合ターミナルを開始して(⌃⇧` (Windows, Linux Ctrl+Shift+`))、git cloneコマンドを使用してソースコードを/workspaceフォルダにクローンします。

最後に、「ファイル > 開く... / フォルダーを開く...」コマンドを使用して、クローンしたリポジトリをコンテナで開きます。