Vue 2.6.x slow/unresponsive intellisense?

[ludwig801]

Issue

Working on a large JS/TS hybrid project using Vue 2.6.14 version.
Intellisense becomes slow/unresponsive on SFC (.vue) and JS/TS files alike (more pronounced in .vue files).

This seems to be hugely alleviated by setting the "allowJs" option to false in tsconfig.json.
However, since the project is a hybrid at the moment, setting the option to false is unconceivable, as it would hinder development.

The difference can be such that, with allowJs set to false, intellisense is almost immediate when typing. When allowJs is set to true, it can take up to 10 seconds or more to offer any sugestion, if it offers at all (sometimes it does not).

Context

I'm working on a web project which started out with the usage of global JS via regular <script> usage and as since been slowly transported to Vue, with SFC pages/components. As such, the project has a large number of mixed .vue, .js, .ts and .d.ts files.

Note: some of the SFC and JS files in the workspace are over 800 lines in content.

Environment

• Editor: VSCode v1.74.1
• Typescript: v4.9.4
• Extensions
  • Prettier: v9.10.3
  • Vue Language Features (Volar): v1.0.13
• Packages (vue-related)
  • vue: 2.6.14
  • vue-tsc: 1.0.13
  • @vue/runtime-dom: 3.2.45
  • @vue/compiler-dom: 3.2.45

---

I cannot supply the repo because it belongs to the company I work for, and there's non-disclosable info.

I would like to know if there's any way I can provide some kind of log/diagnostic from VSCode / Volar to help diagnose the slow response speeds.

[johnsoncodehk]

If the intelligence is slow, you might try performance tracking for vue / vue-tsc: https://github.com/microsoft/TypeScript/wiki/Performance#performance-tracing

Or maybe your project just has a few very large JS files that are causing this problem. You can check this by running Volar (Debug): Server Stats in VSCode and jumping to the VSCode output panel -> Vue Semantic Server -> largest 10 files.

Similar issue: #2210

---

You can also try to provide me with the VSCode debug flame graph: #413
But flame graphs usually don't help if the problem comes from TS rather than Volar

[ludwig801]

If the intelligence is slow, you might try performance tracking for vue / vue-tsc: https://github.com/microsoft/TypeScript/wiki/Performance#performance-tracing

Or maybe your project just has a few very large JS files that are causing this problem. You can check this by running Volar (Debug): Server Stats in VSCode and jumping to the VSCode output panel -> Vue Semantic Server -> largest 10 files.

Similar issue: #2210

You can also try to provide me with the VSCode debug flame graph: #413 But flame graphs usually don't help if the problem comes from TS rather than Volar

@johnsoncodehk Thanks for the reply!

Indeed there are some performance hotspots in our codebase.
I don't know whether they would be enough to cause this kind of delay, but they are certainly worth taking care of.

Regarding the Volar (Debug): Server Stats bit, it actually showed that the biggest files are all from node_modules (csstype, jquery, @types/lodash and @vue/runtime-core, for example). Is it possible to prevent these files from being always transpiled/analyzed (as I assume they are being), since they do not change, or that is already automatically handled?

[johnsoncodehk]

Yes, type evaluation performance is tied to intellisense performance. (If you've found some performance hotspots don't mind the file size.)

[johnsoncodehk]

Closed Since this problem is not related to Volar, if you still have problems, you can discuss in this thread:
https://discord.com/channels/793943652350427136/1025627001102544957/threads/1058554813626982440