VSCode が重くてタイピングが思い通りにいかない!原因は拡張機能かも
はじめに
こんにちは kimizuy です。
弊社Gaji-Laboは受託開発の会社なので複数のプロジェクトに携われることが魅力の 1 つです。
私自身、色々な技術スタックのプロジェクトに関わった過程でいろいろな拡張機能をインストールしていたため、知らぬ間に VSCode のパフォーマンスが低下していました。
具体的には TypeScript のインテリセンスの表示が遅くなったり、カーソル移動やタイピングがカクついたりといった感じです。
そこで今回はどの拡張機能が VSCode のパフォーマンスに影響を与えているかを探る方法をご紹介します。
まずは「拡張機能」が原因かを特定する
VSCode のパフォーマンスの低下は拡張機能が原因とは限りません。
ひとまず拡張機能をすべてオフにすることでパフォーマンスが改善するかを確かめましょう。
コマンドパレットを開き(Cmd + Shift + P
)、「Extensions: Disable All Installed Extensions」というコマンドを実行します。
これで拡張機能がすべてオフにされるので、VSCode を再度開き直し起動やタイピングの速度が体感的に改善したかを確認してみましょう。
動作が改善したようなら何らかの拡張機能が悪影響を与えている可能性が高いです。
「Show Running Extensions」で VSCode の起動に影響を与えている拡張機能を特定する
次に、コマンドパレットから「Developer: Show Running Extensions」を実行します。
新しくウィンドウが開きます。拡張機能リストの隣に Activation: 1457ms
といった数値が示されています。これは VSCode の起動時から各拡張機能が有効化されるまでの時間を表します。
この有効化の時間が大きいほどパフォーマンス(特に起動時)に影響を与えている可能性が高いです。
ただ、ここで表示される拡張機能はプロジェクトに含まれるファイルの種類によって変わります。さらに有効化は遅くてもそれ以降は特にパフォーマンスに影響を与えない拡張機能である可能性もあることに注意してください。
「Startup Performance」で拡張機能の詳細な統計を得る
「Show Running Extensions」では有効化までの時間しか分かりませんでしたが、以下の方法ならさらに詳細な情報を得られます。
コマンドパレットから「Developer: Startup Performance」を実行します。
すると、新しい「Startup Performance」というウィンドウが開きます。以下のように「## Extension Activation Stats」という項目から詳細な拡張機能の統計について知ることができます。
私の場合はマークダウンファイルしかないプロジェクトでコマンドを実行したので、それに関する拡張機能がリストアップされています。
MDX Preview
や Live Server
がパフォーマンスに影響を与えていそうですね。こういった拡張機能を特定して不要そうならオフまたはアンインストールしていきましょう。
参考
さらに詳細なパフォーマンスの検証方法については以下の記事が詳しいです。
VS Code Performance – How to Optimize Visual Studio Code and Choose the “Best” Extensions
おわりに
今回は VSCode のパフォーマンス改善に関する記事をご紹介しました。
タイピングの反映が遅くなると本当にストレスが溜まってしまうので、VSCode ユーザーはこういったパフォーマンス改善方法を知っておいて損はないと思います!
以上、お読みいただきありがとうございました。
今すぐの転職でなくてもOKです!まずはお話しませんか?
現在弊社では一緒にお仕事をしてくださるエンジニアさんやデザイナーさんを積極募集しています。まずはカジュアルな面談で、お互いに大事にしていることをお話できたらうれしいです。詳しい応募要項は以下からチェックしてください。
- React, Next.js を得意とするフロントエンドエンジニア募集要項
- シニアクラスのフロントエンドエンジニア募集要項
- 抽象的な物事を具体的な機能にビジュアライズできるUIデザイナー募集要項
- UIデザイナーとして手ざわりのいいUIを作りたい業務委託パートナーさん募集(Wantedly)
パートナー契約へのお問い合わせもお仕事へのお問い合わせも、どちらもいつでも大歓迎です。まずはオンラインでの面談でお話しましょう。ぜひお気軽にお問い合わせください!
話をしてみたい!