アフィリエイト広告を紹介しています
Working Class Hero:泥臭く、スマートに生き抜く。

汗と汚れの染み込む現場も、キーボードを叩く現場も、どちらも知っている。 元ライン工の僕が、ITの世界で見つけた「少しだけ楽に、自分らしく働くための知恵」を置いておきます。

僕が働き方を変えた理由

VSCodeが重い・遅いときの対処法7選!設定を変えて爆速にする方法

「VSCodeが最近やたら重い…」「入力してから文字が出るまでにラグがある」

そんな悩みを抱えていませんか?

VSCodeは拡張機能を入れすぎたり、設定を放置したりすると、どんどん動作が重くなっていきます。この記事では、VSCodeを軽量化する方法を7つ紹介します。

太郎
太郎

設定を少し変えるだけで体感速度が劇的に改善することが多いです。まず原因を特定しましょう!

この記事はこんな人にオススメ
  • VSCodeの動作が重くて困っている人
  • タイピング時にラグを感じる人
  • 軽量化の設定方法を知りたい人

VSCodeが重くなる主な原因

対処法を試す前に、まず「なぜ重いのか」を理解しましょう。

原因1:拡張機能の入れすぎ

これが最も多い原因です。拡張機能は便利ですが、入れすぎると起動時間や動作に影響します。特に使っていない拡張機能が裏で動いているケースが多いです。

原因2:ファイル監視の範囲が広すぎる

VSCodeはデフォルトで、プロジェクトフォルダ内のファイル変更を全て監視しています。node_modules のような大量のファイルが入ったフォルダがあると、これが重くなる原因になります。

原因3:エディター設定の問題

ミニマップ表示、単語ハイライト、自動保存など、便利な機能が積み重なって負荷になっている場合があります。

原因4:TypeScript/JavaScriptサーバーの負荷

大きなプロジェクトや複雑なコードを扱うと、TypeScriptの言語サーバーが重くなります。

原因5:Gitの追跡設定

大きなリポジトリでGitの変更追跡が常に動いていると、負荷になります。

まず確認すること
  • 1. どの操作をした時に重いか(起動時・入力時・保存時など)
  • 2. いつから重くなったか(拡張機能を入れた後なら拡張機能が原因の可能性大)
  • 3. 特定のプロジェクトだけ重いか(ファイル数・node_modulesが原因かも)
私

「なんとなく重い気がする」という状態から、「起動時だけ重い」「入力ラグがある」と絞り込むと対処しやすくなります。


VSCode軽量化7つの方法

方法1:使わない拡張機能を無効化する

最も効果が大きい対処法です。インストールしているが使っていない拡張機能を無効化しましょう。

操作手順:

1
拡張機能パネルを開く

`Ctrl+Shift+X`(Mac:`Cmd+Shift+X`)で拡張機能パネルを開きます。

2
インストール済みの一覧を確認

「インストール済み」タブで入っている拡張機能を確認します。

3
使わない拡張機能を無効化

拡張機能名をクリック→「無効にする」を選択。アンインストールではなく無効化でOKです。

無効化の候補になりやすい拡張機能:

見直しポイント
  • テーマ系拡張(使っているもの以外)
  • 特定の言語サポート(使っていない言語のもの)
  • 「試しに入れてみた」系の拡張機能

方法2:ファイル監視の除外設定

node_modules.git などの大きなフォルダをファイル監視から除外します。

settings.json に以下を追加:

{
  "files.watcherExclude": {
    "**/.git/objects/**": true,
    "**/.git/subtree-cache/**": true,
    "**/node_modules/**": true,
    "**/.hg/store/**": true,
    "**/dist/**": true,
    "**/.next/**": true,
    "**/build/**": true
  },
  "files.exclude": {
    "**/.git": true,
    "**/node_modules": true,
    "**/dist": true
  }
}
太郎
太郎

node_modulesを監視対象から外すだけで、プロジェクトによっては大幅に軽くなります!

方法3:エディターのレンダリング設定を最適化

視覚的な機能をいくつか無効化することで、レンダリング負荷を下げます。

{
  "editor.minimap.enabled": false,
  "editor.renderWhitespace": "none",
  "editor.occurrencesHighlight": "off",
  "editor.renderLineHighlight": "none",
  "editor.wordWrap": "off",
  "editor.smoothScrolling": false,
  "editor.cursorBlinking": "solid",
  "editor.cursorSmoothCaretAnimation": "off",
  "breadcrumbs.enabled": false
}

特に効果的なのが editor.minimap.enabled: false(ミニマップ非表示)です。 ミニマップは便利ですが、描画コストが高いので無効化するとかなり軽くなります。

方法4:TypeScript/JavaScriptサーバーの設定

TypeScriptプロジェクトを扱っている場合は、以下の設定を追加します。

{
  "typescript.disableAutomaticTypeAcquisition": true,
  "typescript.suggestionActions.enabled": false,
  "javascript.suggestionActions.enabled": false,
  "typescript.validate.enable": false
}

また、TypeScriptサーバーへのメモリ割り当てを増やすことも効果的です:

{
  "typescript.tsserver.maxTsServerMemory": 4096
}
注意
  • `typescript.validate.enable: false` を設定すると、TypeScriptの型チェックが無効になります。型エラーを見逃す可能性があるので、動作確認後に必要に応じて戻してください。

方法5:Gitの設定を最適化

大きなリポジトリでは、Gitの設定を調整します。

{
  "git.enabled": false,
  "git.autorefresh": false,
  "git.decorations.enabled": false,
  "scm.diffDecorations": "none"
}

git.enabled: false にするとGit機能が完全に無効になります。Gitをコマンドラインで操作する人はこれで十分です。GUI操作が必要な場合は git.autorefresh: false だけでも効果があります。

私

Gitの自動リフレッシュをオフにするだけでも、特に大きなリポジトリでは体感速度が上がります。

方法6:ワークスペースを分割する

大きなプロジェクトをVSCodeで開いている場合は、必要なフォルダだけを含むワークスペースを作成しましょう。

ファイルワークスペースに名前を付けて保存 → 必要なフォルダのみ追加

フォルダ全体ではなく、作業に必要な部分だけを開くことで負荷が減ります。

方法7:ハードウェアアクセラレーションの設定

グラフィック関連の問題で重くなっている場合は、ハードウェアアクセラレーションを変更します。

設定方法:

  1. Ctrl+Shift+P(Mac:Cmd+Shift+P)でコマンドパレットを開く
  2. 「Preferences: Configure Runtime Arguments」を入力して選択
  3. argv.json が開く
  4. 以下を追加:
{
  "disable-hardware-acceleration": true
}
  1. VSCodeを再起動
注意
  • この設定はグラフィック問題がある場合の対処法です。通常はハードウェアアクセラレーションが有効の方がパフォーマンスは高いです。改善しない場合は削除してください。
太郎
太郎

方法1〜3を試すだけで大半のケースは改善します。全部試さなくても大丈夫です!


settings.jsonのまとめ設定

上記の設定を1つにまとめました。必要なものだけコピーして使ってください。

settings.json を開く方法:Ctrl+Shift+P → 「Open User Settings (JSON)」

{
  // ファイル監視の除外
  "files.watcherExclude": {
    "**/.git/objects/**": true,
    "**/.git/subtree-cache/**": true,
    "**/node_modules/**": true,
    "**/dist/**": true,
    "**/.next/**": true,
    "**/build/**": true
  },
  "files.exclude": {
    "**/.git": true,
    "**/node_modules": true
  },

  // エディター表示の軽量化
  "editor.minimap.enabled": false,
  "editor.renderWhitespace": "none",
  "editor.occurrencesHighlight": "off",
  "editor.renderLineHighlight": "none",
  "editor.smoothScrolling": false,
  "editor.cursorBlinking": "solid",
  "editor.cursorSmoothCaretAnimation": "off",
  "breadcrumbs.enabled": false,

  // TypeScript設定
  "typescript.disableAutomaticTypeAcquisition": true,
  "typescript.suggestionActions.enabled": false,
  "javascript.suggestionActions.enabled": false,
  "typescript.tsserver.maxTsServerMemory": 4096,

  // Git設定
  "git.autorefresh": false,
  "git.decorations.enabled": false
}
設定変更後の確認ポイント
  • 設定変更後はVSCodeを再起動する
  • 特定の拡張機能を無効化した後、必要な機能が動いているか確認
  • 改善しない場合は `Developer: Show Running Extensions` で重い拡張機能を特定

まとめ

ポイントまとめ
  • VSCodeが重い最大の原因は「拡張機能の入れすぎ」。まず整理しよう
  • `node_modules` など大きなフォルダをファイル監視から除外すると効果大
  • ミニマップ無効化(`editor.minimap.enabled: false`)は手軽で効果あり
  • TypeScriptサーバーのメモリを増やすと大規模プロジェクトで改善
  • Gitの自動リフレッシュをオフにするだけで体感速度が上がることも

設定変更は1つずつ試して、効果を確認しながら進めると安全です。一気に全部変えると、どの設定が効いたかわからなくなります。

まずは拡張機能の整理と node_modules の監視除外から始めてみてください。

プログラミングスキルをもっと伸ばしたいなら

独学で限界を感じていませんか?プロのカリキュラムなら最短でスキルが身につきます。

※無料体験・無料カウンセリングあり

コメント