29.04.20224 min

Kingkor Roy TirthoRandom Stack Developer

Uczyń VSCode lżejszym

Sprawdź, jak są przyczyny dużego zużycia zasobów oraz jak odciążyć VSCode.

Uczyń VSCode lżejszym

Visual Studio Code to naprawdę świetny edytor kodu, można nawet powiedzieć, że prawie jak IDE, a nawet lepiej. W większych projektach kosztuje to jednak bardzo dużo pamięci RAM i procesora. To wszystko nie jest związane z VSCode, ale z większością jego rozszerzeń.

Rozszerzenia VSCode są dobre i bez wątpienia najlepsze, ale napisane dla środowiska Node.js w JS, dlatego rzecz jasna, zajmują dużo zasobów. Mimo wszystko są wydajne. A ludzie nieświadomie oskarżają o to vscode.

W większości przypadków nie stanowi to większego problemu, jednak w większych projektach ten drobny problem staje się poważniejszy, ponieważ większość ludzi nie posiada procesora AMD Thread Ripper, dysku Samsung NVMe SSD z 16 GB RAM-u, czy też karty RTX3090.

Dowiedzmy się, jakie są przyczyny tak dużego zużycia zasobów i spróbujmy coś z tym zrobić.


Unikanie monitorowania plików

Funkcja autouzupełniania lub IntelliSense w Visual Studio Code wykorzystuje pakiet Universal LSP (Language Server Protocol), który jest zbiorem obserwatorów plików.

Pakiet ten używa innych pakietów specyficznych dla danego języka do monitorowania poszczególnych plików pod kątem dopasowania typów lub intellisense. Cóż, jest to całkowicie w porządku, gdy projekt jest mały, ale kiedy ma się do czynienia z takim projektem, jak ten…

O rany, teraz pewnie nienawidzisz VSCode, ale daj mu jeszcze szansę. To nie jego wina. VSCode musi monitorować te pliki, w przeciwnym razie nie będzie mógł zapewnić Ci komfortu kodowania. Choć stara się on zapewnić lepsze doświadczenia, to czasami trochę przesadza. Prowadzi to do ogromnego zużycia pamięci RAM i procesora. Naprawmy to:

Przejdź do ustawień. Kliknij ikonę edycji pliku znajdującą się w prawym górnym rogu okna w pasku kart.

Teraz należy wkleić następujący kod, aby wykluczyć nieistotne i dosłownie nigdy nieużywane pliki i foldery z obserwatorów plików...

//Add following lines of code to exclude the files & folders which aren't important for watchers to look for changes...
{
  //exludes fies & folders in search indexing
"search.exclude": {
    "**/node_modules": true,
    "**/bower_components": true,
    "**/env": true,
    "**/venv": true
  },
  //exludes fies & folders for watcher service
"files.watcherExclude": {
    "**/.git/objects/**": true,
    "**/.git/subtree-cache/**": true,
    "**/node_modules/**": true,
    "**/env/**": true,
    "**/venv/**": true,
    "env-*": true
  },
}


Można to zrobić także na poziomie obszaru roboczego. Wystarczy utworzyć plik settings.json w folderze .vscode w katalogu głównym projektu.

Można także tymczasowo dodać więcej plików lub folderów, jeśli projekt się rozrósł, ponieważ nie wszystkie zagnieżdżone pliki i foldery muszą być potrzebne. Reasumując dodaje te foldery projektów, których użytkownik nawet nie używa, aby móc wygodnie pracować nad pozostałymi częściami projektu...

Możliwe jest również wyłączenie niektórych rozszerzeń, w tym programów do monitorowania plików. Istnieje lista rozszerzeń, które wydają się używać obserwatorów plików (tutaj nie jestem do końca pewien):

  • ESLint
  • TSLint
  • Apollo GraphQL
  • Todo Tree
  • Bookmarks
  • Code Spell Checker (Nie mam pewności)
  • Template String Converter (JavaScript/Typescript/JSX/TSX)
  • Live Server
  • Live Sass Compiler
  • Bohater kompilator
  • Bóg TypeScript
  • Git-lens
  • Dart
  • Flutter


Wymieniłem kilka, z którymi zetknąłem się podczas korzystania z programu. Większość z nich jest związana z JavaScriptem/Typescriptem/Dartem, ponieważ pochodzę z tego właśnie światka. Ale inne rozszerzenia, takie jak: Rust, rust-analyzer itp. są również podobne do wymienionych w powyższej liście.


Wyłączanie niechcianych rozszerzeń dla obszaru roboczego

Mam zainstalowanych ponad 35 rozszerzeń. Najczęściej jednak nie potrzebuję ich wszystkich w jednym projekcie, ponieważ pracuję też w wielu innych. Rozszerzenia można włączać i wyłączać dla określonych obszarów roboczych.

Przykładowo, nie potrzebujesz flutter/dart, gdy tworzysz React lub Nodejs Server i na odwrót. Można więc wyłączyć tę funkcję tylko dla obszaru roboczego. Nie zapomnij jednak zapisać obszaru roboczego vs-code.

Wyłączenie rozszerzeń @builtin, które nie są ważne dla stosu projektu, może również sprawić, że VSCode będzie nieco lżejszy. W większości przypadków nie są one nawet uruchamiane przez rozszerzenie hosta VSCode, ponieważ VSCode nie uruchamia rozszerzeń, jeśli nie są one potrzebne.


Wciąż jednak istnieją pewne rozszerzenia, które można wyłączyć dla swojego obszaru roboczego:

  • Wszystkie podstawowe języki z wyjątkiem tych z Twojego stosu
  • Grunt, Gulp i Jake wspierają VSCode (trzy oddzielne rozszerzenia)
  • Debugowanie węzła (Lagecy)


Można to zrobić, wyszukując w zakładce rozszerzeń VSCode tag @builtin. Zostaną wtedy wyświetlone wszystkie wbudowane rozszerzenia.


Wyłącz automatyczny typeAcquisition

w projektach opartych wyłącznie na języku Typescript

Jeśli w projekcie używasz tylko języka Typescript, wyłącz type Acquisition przez VSCode. Ułatwia to pisanie w języku JavaScript, zapewniając autouzupełnianie poprzez pobieranie @types/<package-name> definicji typów dla node_module.

Jednak typescript wymaga definicji typów, więc przez większość czasu będziesz instalował typy dla swojego modułu node_module przez npm. Funkcja ta staje się więc nieaktualna.

Aby wyłączyć typeAcquisition, przejdź do ustawień vscode, wyszukaj to, czego potrzebujesz, a następnie odznacz właściwość typeAcquisition.


Oryginał tekstu w języku angielskim przeczytasz tutaj.

<p>Loading...</p>