language-tools VSCode extension slowing down IntelliSense

Describe the bug

The VS Code IntelliSense is very slow when the Svelte extension is enabled.

Reproduction

Press Ctrl + Space.

Expected behaviour

The IntelliSense loads quickly.

System Info

OS: Linux
IDE: VSCode

Which package is the issue about?

Svelte for VS Code extension

Additional Information, eg. Screenshots

I disabled all extensions and enabled them individually until I found that Svelte was causing the slow IntelliSense.

Aug 13 '24 07:08 Carter121

Please check out some existing performance discussions https://github.com/sveltejs/language-tools/labels/perf. If these don't help, please provide a reproduction repository.

Aug 13 '24 07:08 jasonlyu123

It is very similar to #2329 and I did some more testing and found that the issue resolves when I disable the "Enable-TS-plugin" setting.

Aug 13 '24 07:08 Carter121

Does the performance problem happen in a SvelteKit route file?

Aug 13 '24 07:08 jasonlyu123

Disabling svelte.enable-ts-plugin also fixed the IntelliSense performance issue for me.

It only happens in the Windows environment, regardless[^1] of the file extension.

[^1]: +page.server.ts files are affected as well.

It does not occur in macOS with an identical setup and project.

The following issue also had a similar conclusion: no performance issue on M1 Pro Mac.

https://github.com/sveltejs/language-tools/issues/2329#issuecomment-1008864430

Svelte trace logs nothing special, it is just faster on my MacBook Pro 16.

System:
  OS: Windows 11 10.0.22631
  CPU: (22) x64 Intel(R) Core(TM) Ultra 9 185H
  Memory: 2.39 GB / 15.36 GB
Binaries:
  Node: 22.9.0 - ~\AppData\Local\fnm_multishells\20600_1726682053915\node.EXE
  Yarn: 1.22.22 - ~\AppData\Local\fnm_multishells\20600_1726682053915\yarn.CMD
  npm: 10.8.3 - ~\AppData\Local\fnm_multishells\20600_1726682053915\npm.CMD
  pnpm: 9.10.0 - ~\AppData\Local\fnm_multishells\20600_1726682053915\pnpm.CMD

System:
  OS: macOS 14.6.1
  CPU: (10) arm64 Apple M1 Pro
  Memory: 48.20 MB / 16.00 GB
  Shell: 5.9 - /bin/zsh
Binaries:
  Node: 22.9.0 - ~/.local/state/fnm_multishells/29278_1726675351095/bin/node
  Yarn: 1.22.22 - ~/.local/state/fnm_multishells/29278_1726675351095/bin/yarn
  npm: 10.8.3 - ~/.local/state/fnm_multishells/29278_1726675351095/bin/npm
  pnpm: 9.10.0 - ~/.local/state/fnm_multishells/29278_1726675351095/bin/pnpm

Sep 18 '24 17:09 hyunbinseo

Let me clarify a bit. What I want to ask is actually if the performance problem ONLY exists in SvelteKit route ts/js files. I have an idea of what might be the problem but it should only happen to SvelteKit route files. And it shouldn't have anything to do with OS. It probably isn't something to do with the performance difference between the machines either, they're both quite modern devices so there shouldn't be a night and day difference. I am wondering if the difference you see is actually non-routes ts/js files and svelte files vs routes ts/js files.

Sep 19 '24 13:09 jasonlyu123

This is the performance issue I am experiencing on my Windows laptop:

https://github.com/user-attachments/assets/3dc46e1d-c70f-410c-8120-ad5b52a2aced

Simply disabling the Svelte extension greatly improves the +page.server.ts IntelliSense perf.

This behavior is reproducible in an Windows on Arm device as well. (Surface Pro 9 5G)

Sep 19 '24 14:09 hyunbinseo

Can you provide the dependencies and devDependencies in your package.json and tsconfig.json? Weird that it also seems to happen in a svelte file as well. I am wondering if it has something to do with https://github.com/sveltejs/language-tools/issues/2244#issuecomment-1876202548 but because you only import the package in a svelte file.

Also, can you the svelte file again with the svelte.language-server.debug config and turn off svelte.trace.server?

Sep 19 '24 14:09 jasonlyu123

Am I supposed to re-record the +page.svelte file with this option?

"svelte.language-server.debug": true

Requested files:

// package.json
{
  "dependencies": {
    "@hyunbinseo/tools": "^0.3.2",
    "better-sqlite3": "^11.2.1",
    "drizzle-kit": "^0.24.2",
    "drizzle-orm": "^0.33.0",
    "ulid": "^2.3.0",
    "valibot": "^0.41.0"
  },
  "devDependencies": {
    "@sveltejs/adapter-auto": "^3.2.4",
    "@sveltejs/kit": "^2.5.26",
    "@sveltejs/vite-plugin-svelte": "4.0.0-next.6",
    "@tailwindcss/forms": "^0.5.8",
    "@types/better-sqlite3": "^7.6.11",
    "@types/eslint": "^9.6.1",
    "@types/node": "^22.5.4",
    "autoprefixer": "^10.4.20",
    "eslint": "^9.9.1",
    "eslint-config-prettier": "^9.1.0",
    "eslint-plugin-svelte": "^2.43.0",
    "globals": "^15.9.0",
    "jose": "^5.9.2",
    "new-request": "^0.0.17",
    "postcss": "^8.4.45",
    "prettier": "^3.3.3",
    "prettier-plugin-svelte": "^3.2.6",
    "prettier-plugin-tailwindcss": "^0.6.6",
    "svelte": "5.0.0-next.243",
    "svelte-check": "^4.0.1",
    "svelte-form-enhanced": "^0.1.0",
    "tailwindcss": "^3.4.10",
    "typescript": "^5.5.4",
    "typescript-eslint": "^8.4.0",
    "vite": "^5.4.3"
  },
  "engines": {
    "node": ">=22"
  },
  "type": "module",
  "packageManager": "[email protected]+sha512.73a29afa36a0d092ece5271de5177ecbf8318d454ecd701343131b8ebc0c1a91c487da46ab77c8e596d6acf1461e3594ced4becedf8921b074fbd8653ed7051c"
}

// tsconfig.json
{
  "extends": "./.svelte-kit/tsconfig.json",
  "compilerOptions": {
    "allowJs": true,
    "checkJs": true,
    "esModuleInterop": true,
    "forceConsistentCasingInFileNames": true,
    "resolveJsonModule": true,
    "skipLibCheck": true,
    "sourceMap": true,
    "strict": true,
    "module": "NodeNext",
    "moduleResolution": "NodeNext",
    "allowImportingTsExtensions": true,
    // Node.js 22 supports all ES2023 APIs.
    // Reference https://node.green/#ES2023
    "lib": ["ES2023", "DOM", "DOM.Iterable"]
  },
  "include": [
    "./.svelte-kit/ambient.d.ts",
    "./.svelte-kit/non-ambient.d.ts",
    "./.svelte-kit/types/**/$types.d.ts",
    "./vite.config.js",
    "./vite.config.ts",
    "./src/**/*.js",
    "./src/**/*.ts",
    "./src/**/*.svelte",
    "./tests/**/*.js",
    "./tests/**/*.ts",
    "./tests/**/*.svelte",
    // Added
    "./database/**/*.js",
    "./database/**/*.ts"
  ]
}

Sep 19 '24 14:09 hyunbinseo

Am I supposed to re-record the +page.svelte file with this option?

You can also copy the log. There should be some with the [ts] prefix.

Sep 19 '24 14:09 jasonlyu123

This is the debug log from typing new TextEncoder().encode() in a +page.svelte file:

Using Svelte v5.0.0-next.243 from C:\Users\hyunb\Development\sdtvx\node_modules\.pnpm\[email protected]\node_modules\svelte\compiler
Using Svelte v5.0.0-next.243 from C:\Users\hyunb\Development\sdtvx\node_modules\.pnpm\[email protected]\node_modules\svelte\compiler
Executing next invocation of "getSemanticTokens" with low priority
Using Prettier v3.3.3 from C:\Users\hyunb\Development\sdtvx\node_modules\.pnpm\[email protected]\node_modules\prettier
[ts] getCompletionData: Get current token: 0.010999999940395355
[ts] getCompletionData: Is inside comment: 0.0276999999769032
[ts] getCompletionData: Get previous token: 0.021200000075623393
[ts] getCompletionsAtPosition: isCompletionListBlocker: 0.3329999998677522
[ts] AutoImportProviderProject: found 397 root files in 4 dependencies in 64.3723000001628 ms
[ts] getExportInfoMap: cache miss or empty; calculating new results
[ts] forEachExternalModuleToImportFrom autoImportProvider: 28.235099999932572
[ts] getExportInfoMap: done in 2651.4216000000015 ms
[ts] collectAutoImports: resolved 39 module specifiers, plus 122 ambient and 311 from cache
[ts] collectAutoImports: response is complete
[ts] collectAutoImports: 264.14669999992475
[ts] getCompletionData: Semantic work: 2925.1110999998637
[ts] getCompletionsAtPosition: getCompletionEntriesFromSymbols: 23.10439999983646
Using Svelte v5.0.0-next.243 from C:\Users\hyunb\Development\sdtvx\node_modules\.pnpm\[email protected]\node_modules\svelte\compiler
Using Svelte v5.0.0-next.243 from C:\Users\hyunb\Development\sdtvx\node_modules\.pnpm\[email protected]\node_modules\svelte\compiler
Using Prettier v3.3.3 from C:\Users\hyunb\Development\sdtvx\node_modules\.pnpm\[email protected]\node_modules\prettier
[ts] getCompletionData: Get current token: 0.006399999838322401
[ts] getCompletionData: Is inside comment: 0.01280000014230609
[ts] getCompletionData: Get previous token: 0.01860000006854534
[ts] getCompletionsAtPosition: isCompletionListBlocker: 0.013299999991431832
[ts] getExportInfoMap: cache hit
[ts] collectAutoImports: resolved 94 module specifiers, plus 102 ambient and 461 from cache
[ts] collectAutoImports: response is complete
[ts] collectAutoImports: 586.0183999999426
[ts] getCompletionData: Semantic work: 589.2409000000916
[ts] getCompletionsAtPosition: getCompletionEntriesFromSymbols: 14.66469999984838
Using Prettier v3.3.3 from C:\Users\hyunb\Development\sdtvx\node_modules\.pnpm\[email protected]\node_modules\prettier
Using Svelte v5.0.0-next.243 from C:\Users\hyunb\Development\sdtvx\node_modules\.pnpm\[email protected]\node_modules\svelte\compiler
Using Svelte v5.0.0-next.243 from C:\Users\hyunb\Development\sdtvx\node_modules\.pnpm\[email protected]\node_modules\svelte\compiler
Using Prettier v3.3.3 from C:\Users\hyunb\Development\sdtvx\node_modules\.pnpm\[email protected]\node_modules\prettier
[ts] getCompletionData: Get current token: 0.013700000010430813
[ts] getCompletionData: Is inside comment: 0.024499999824911356
[ts] getCompletionData: Get previous token: 0.0205999999307096
[ts] getCompletionsAtPosition: isCompletionListBlocker: 0.010000000009313226
[ts] getCompletionData: Semantic work: 2.0726999999023974
Using Prettier v3.3.3 from C:\Users\hyunb\Development\sdtvx\node_modules\.pnpm\[email protected]\node_modules\prettier
[ts] getCompletionData: Get current token: 0.13040000014007092
[ts] getCompletionData: Is inside comment: 0.013999999966472387
[ts] getCompletionData: Get previous token: 0.10990000003948808
[ts] getCompletionsAtPosition: isCompletionListBlocker: 0.019099999917671084
[ts] getCompletionData: Semantic work: 3.827999999979511
Using Prettier v3.3.3 from C:\Users\hyunb\Development\sdtvx\node_modules\.pnpm\[email protected]\node_modules\prettier
[ts] getCompletionData: Get current token: 0.02279999991878867
[ts] getCompletionData: Is inside comment: 0.012000000104308128
[ts] getCompletionData: Get previous token: 0.09599999990314245
[ts] getCompletionsAtPosition: isCompletionListBlocker: 0.020500000100582838
[ts] getCompletionData: Semantic work: 3.1777999999467283
Using Prettier v3.3.3 from C:\Users\hyunb\Development\sdtvx\node_modules\.pnpm\[email protected]\node_modules\prettier
Using Prettier v3.3.3 from C:\Users\hyunb\Development\sdtvx\node_modules\.pnpm\[email protected]\node_modules\prettier
[ts] getCompletionData: Get current token: 0.010400000028312206
[ts] getCompletionData: Is inside comment: 0.04689999995753169
[ts] getCompletionData: Get previous token: 0.026099999900907278
[ts] getCompletionsAtPosition: isCompletionListBlocker: 0.00430000014603138
[ts] getCompletionData: Semantic work: 2.035300000105053
[ts] getCompletionsAtPosition: getCompletionEntriesFromSymbols: 0.3595000000204891
Using Prettier v3.3.3 from C:\Users\hyunb\Development\sdtvx\node_modules\.pnpm\[email protected]\node_modules\prettier
[ts] getCompletionData: Get current token: 0.020800000056624413
[ts] getCompletionData: Is inside comment: 0.12140000006183982
[ts] getCompletionData: Get previous token: 0.021900000050663948
[ts] getCompletionsAtPosition: isCompletionListBlocker: 0.004799999995157123
[ts] getCompletionData: Semantic work: 0.4514000001363456
Using Prettier v3.3.3 from C:\Users\hyunb\Development\sdtvx\node_modules\.pnpm\[email protected]\node_modules\prettier
Using Svelte v5.0.0-next.243 from C:\Users\hyunb\Development\sdtvx\node_modules\.pnpm\[email protected]\node_modules\svelte\compiler
Using Svelte v5.0.0-next.243 from C:\Users\hyunb\Development\sdtvx\node_modules\.pnpm\[email protected]\node_modules\svelte\compiler
Using Prettier v3.3.3 from C:\Users\hyunb\Development\sdtvx\node_modules\.pnpm\[email protected]\node_modules\prettier
Using Prettier v3.3.3 from C:\Users\hyunb\Development\sdtvx\node_modules\.pnpm\[email protected]\node_modules\prettier
Using Svelte v5.0.0-next.243 from C:\Users\hyunb\Development\sdtvx\node_modules\.pnpm\[email protected]\node_modules\svelte\compiler
Using Svelte v5.0.0-next.243 from C:\Users\hyunb\Development\sdtvx\node_modules\.pnpm\[email protected]\node_modules\svelte\compiler
Using Svelte v5.0.0-next.243 from C:\Users\hyunb\Development\sdtvx\node_modules\.pnpm\[email protected]\node_modules\svelte\compiler
Using Svelte v5.0.0-next.243 from C:\Users\hyunb\Development\sdtvx\node_modules\.pnpm\[email protected]\node_modules\svelte\compiler

Sep 19 '24 15:09 hyunbinseo

Thanks. It's indeed something to auto-import. I'll take a deeper look later.

Sep 19 '24 15:09 jasonlyu123

The problem in svelte files only appears the first time completion is triggered. TS Server doesn't have it because some auto-import is calculated and cached a bit earlier. And it only affects auto-import that has never been imported before so I'll probably not change this part.

The problem in SvelteKit routes files should be what I think it is. Feel free to comment and provide more info if the problem doesn't improve after we release a fix for this.

Sep 23 '24 09:09 jasonlyu123

language-tools language-tools copied to clipboard

VSCode extension slowing down IntelliSense

Describe the bug

Reproduction

Expected behaviour

System Info

Which package is the issue about?

Additional Information, eg. Screenshots

language-tools
language-tools copied to clipboard