Perf issue after latest VS Code update

[verdverm]

What version of VS Code are you using?

For example: v1.89.0

What version of Tailwind CSS IntelliSense are you using?

For example: v0.10.5

Describe your issue

Since getting the latest update to VS Code, this plugin has been running at around 150% CPU on an M2. I don't have any css or tailwind files open and this is still the case

[thecrypticace]

What version of the extension are you using? Is it actually v0.10.5 or are you by chance running a pre-release build? If it's v0.10.5 then this sounds like a regression in VSCode?

[verdverm]

Not the pre-release, I would assume this is a regression from a VS Code update, as this version had been running fine since I installed it, until said (recent) VS Code update.

[thecrypticace]

Weird — thanks. I'll look into it

[verdverm]

cool, let me know if there is any debugging or logs available on my end that could be helpful

[thecrypticace]

@verdverm Sorry for getting back to this so late. I'm testing in 1.89.1 and am not seeing anything out of the ordinary. No runaway CPU usage or anything.

Could you possibly provide a reproduction if you're still seeing this in 1.89.1?

[verdverm]

Still seeing the issue, try opening https://github.com/hofstadter-io/hof in VS Code

[giliamverheide]

I have yet to find the root cause, but I noticed the same thing. Running M2 pro. With a single VS Code window, there are 6 helper processes running for bradlc.vscode-tailwindcss-0.10.5/dist/tailwindServer.js – Each one at 100% CPU. Weirdly enough, even after quitting VS Code the (helper) processes kept running, until I ended each process manually.

Additionally, each time I run the Developer: Reload Window command from within VS Code, it sometimes adds another helper process for the plugin (running at 100%). Other Code Helper (Plugin) processes seem to run at less than 1% each.

Tailwind CSS IntelliSense:
Version: 0.10.5

VS Code:
Version: 1.89.1 (Universal)
Electron: 28.2.8
ElectronBuildId: 27744544
Chromium: 120.0.6099.291
Node.js: 18.18.2
V8: 12.0.267.19-electron.0
OS: Darwin arm64 23.2.0

Also tested with the VS Code silicon build, same issue. Hovering over classes often doesn't work and is stuck at "Loading...". but I wonder if that has to do with my regex (using tailwind-variants), even though this has worked fine in the past. .vscode/settings.json:

{
  "tailwindCSS.experimental.classRegex": [
    ["tv\\((([^()]*|\\([^()]*\\))*)\\)", "[\"'`]([^\"'`]*).*?[\"'`]"]
  ],
  "tailwindCSS.classAttributes": [
    "class",
    "className",
    ".*className.*",
    ".*Styles*"
  ]
}

Note: removing these settings does not change the CPU usage and also keeps the process running after I quit VS Code.

[thecrypticace]

Hovering over classes often doesn't work and is stuck at "Loading...". but I wonder if that has to do with my regex (using tailwind-variants), even though this has worked fine in the past.

This is definitely a problem with the regex. Removing the settings should fix it but you'll need to make sure that you quite VSCode and kill any errant processes.

That regex has nested *s which is, in general, a recipe for problems.

That said I'm working on offloading regex stuff to a separate worker thread so we can at least prevent intellisense from breaking.

[thecrypticace]

Can you try the regex from this? https://github.com/tailwindlabs/tailwindcss-intellisense/issues/893#issuecomment-2115507693

Another user was using tailwind variants and replaced the regex with something that's less likely to run into backtracking problems.

I'm prototyping a change that would offload regex matching to a separate worker thread to allow us to detect this situation. I think it'll pan out but it may be a while before that ships.

[jdoss]

I am not sure I am hitting the same issue here but with this extension enabled I have an rg process that is chewing up 1000% CPU on a project that has no tailwindCSS inside of it.

$ ps aux |grep tailwind
jdoss    1101634 1188  0.0  98484 11532 ?        Sl   13:14  33:08 /usr/share/code/resources/app/node_modules.asar.unpacked/@vscode/ripgrep/bin/rg --files --hidden --case-sensitive --no-require-git -g **/{tailwind,tailwind.config,tailwind.*.config,tailwind.config.*}.{js,cjs,ts,mjs} -g !**/.git -g !**/.svn -g !**/.hg -g !**/CVS -g !**/.DS_Store -g !**/Thumbs.db -g !/{**/.git,**/.svn,**/.hg,**/CVS,**/.DS_Store,**/Thumbs.db,**/.git/**,**/node_modules/**,**/.hg/**,**/.svn/**} --no-ignore --follow --no-config --no-ignore-global

Disabling the tailwindcss-intellisense extension causes the process to go away. This happens on the release and pre-release versions.

[thecrypticace]

@jdoss This seems like a separate issue (and maybe one with either vscode or related to your filesystem). We don't use ripgrep but we do register globs to be watched and I'm guessing VSCode is using that — and for whatever reason — it's being slow.

Can you provide?:

1. The CWD of the ripgrep process: lsof -p <pid_of_rg> | grep cwd
2. Details about the filesystem it's mounted on and storage device (e.g. is it a network mount, is it a local SSD, etc.)
3. If you're using WSL, is the working directory under /mnt/{drive_letter}/?
4. And generally any other details you think might be relevant

Also — would you mind putting that into a separate issue?

[jdoss]

Done. https://github.com/tailwindlabs/tailwindcss-intellisense/issues/986

Sorry for the noise in this issue.

[thecrypticace]

No worries — thanks for opening!