TypeScript Performance

[Ghirigoro]

I've got a relatively small project and am trying to keep the number of design tokens to a minimum but TypeScript performance is still pretty poor (i.e. auto-completion breaks, IDE CPU usage spikes, etc.). This is might be impossible to fix since VE has no choice but to produce massive union types, and those can be expensive, but I was wondering if other folks had found any workarounds for this. I assume that anyone who uses VE on a medium to large project has to have figured out something if I'm experiencing this at the scale I'm working at.

[roginfarrer]

Would be helpful to specify the TypeScript version used. Even better would be steps to reproduce with a sample project. Is this happening just with @vanilla-extract/css? Or with @vanilla-extract/sprinkles too?

I've found that TS IDE performance has a high degree of variability depending on the machine and the editor.

[Ghirigoro]

Sorry I should have mentioned that. I am using:

• @vanilla-extract/sprinkles
• M1 Max MacBook Pro (64gb of RAM)
• TS 5.0.4 (although I've experienced issues with it previous versions)
• Primarily WebStorm (2023.1.1 previous versions as well) with 16gb of memory assigned

I use WebStorm and occasionally check in on VSCode to see if it's a general TS issue or WebStorm specific and up until recently both editors had the issue. I just checked with VSCode and autocomplete is working perfectly fine and things are pretty snappy in general.

My understanding is that both VSCode and WebStorm use TSServer so I'm not sure why they'd have such variation in performance but that's a question to ask JetBrains...

I guess if anyone else is running into this issue, the workaround is to use VSCode ;)

[roginfarrer]

The editor is what I was wondering about. TypeScript does not actually abide by the Language Server protocol, so editors like WebStorm and typescript-language-server have to work around that with a different implementation. I have no proof of this, but I've always observed that VSCode has much better TypeScript support and performance. Thanks Microsoft 🥲.

Doesn't change the fact though that Sprinkles types are complex. It's magic when it works, but I'm not sure what can be done to simplify them without compromising accuracy.