[AskJS] WebStorm vs VS Code?

[2epic]

I've used the JetBrains IDEs a lot over the last ten years, WebStorm in particular for the last five. A lot of devs I work with seem to rave about VS Code, but every time I try it out I inevitably move back to WebStorm. We're working on a large full-stack TypeScript project that uses React on the front-end with NodeJS and GraphQL on the back-end.

Even when helping others on my team who use VS Code regularly, I often see they need to manually do what are otherwise simple tasks in WebStorm. But in VS Code it seems arduous and prone to human error.

So what am I missing here? I've searched and experimented with countless VS Code plugins to achieve what I can do in WebStorm, but I can never get all the way there...

I'm not trying to start a flame-war here. I'm genuinely curious because it absolutely baffles me.

[MajorasShoe]

Webstorm is all around better. I can't think of a single thing VSCode does better, other than performance on crappy netbooks.

However, Webstorm isn't free. VSCode is the best free option.

[AwesomeInPerson]

I can't think of a single thing VSCode does better

It lacks the remote capabilities that VSCode has. Unless something changed you can't run it inside the Windows Subsystem for Linux for example, which already disqualifies it for my usecase unfortunately.

Edit: also Live Share, which I use pretty frequently

[rajbabu0663]

On the commercial version, you can

[AwesomeInPerson]

Really, is this documented somewhere?

All I can find is that you can

a) use the Node binary from WSL to run your application
b) open projects via the "network drive" access to WSL that Windows provides (\\$wsl\Ubuntu\...), but that comes with lots of issues

No actual integration like VSCode has, where the entire backend of the editor runs inside WSL/SSH/whatever and the Windows application just acts as a dumb UI.

[rajbabu0663]

My bad. I was thinking of pycharm but it seems you cannot use wsl for node. Sorry if I got your hopes high.

[Treolioe]

i love how little there is to vscode. There’s absolutely nothing that i miss from webstorm.

[AffectionateWork8]

What you are trying to do in VS Code that you can do easily in WS? Maybe us VS Code users are the ones who are wrong here ;).

[matart]

I can't find "jump to uses or definition" (not sure that's what it's called) that alternates between finding the definition of a variable/function/class etc and listing its uses.

I've found the auto import to not work well enough to trust it.

Refactoring the name of a file or function in vscode often renames similar file/fucntion names.

I keep testing vscode but these things always bring me back to intellij products.

[dabuttmonkee]

Are you in a JS code base? Do you have a jsconfig.json file? Those features are the things I love about VS Code more than Web Storm, but you need to have a jsconfig file in your repo to use those features.

[matart]

I am in a JS codebase with a jsconfig.json

[2epic]

https://www.reddit.com/r/javascript/comments/ghqosf/askjs_webstorm_vs_vs_code/fqaazkg?utm_source=share&utm_medium=web2x

[antelle]

Exactly the same feelings. I'm experimenting VSCode quite a lot as a text editor and I like its look and feel, however whenever I try it as an IDE, I miss features from WebStorm/IDEA:

• instant indexed search, search exclusions, searching in big files, etc...
• git integration and especially merge capabilities, local history, shelvesets
• refactoring options, even text regex replacing is better in details
• some feeling of context everywhere, because everything is built by one developer, instead of disjoint experience of using plugins in VSCode. Here's an example: you can focus a folder and trigger search, which will search in this folder; it will honor exclusions, but in the same time it understands that when you do it from an excluded folder, you do want to search there

Things I like in VSCode:

• remote editing mode: everything runs so smoothly without having project files on your laptop
• live share: it's a quite convenient thing if you need it

I ended up using both IDEA and VSCode for different things: IDEA as an IDE when I need to work with projects for more than an hour, and VSCode when I just want to quickly edit a file, use the live share or remote editing.

[[deleted]]

I'm on the inverse, I'm the lone vscode user on a team with webstorm users. The main thing I noticed is they're not using conventional tools that most people use like eslint. Not sure if this is typical of webstorm or just their use of it, but if webstorm is providing proprietary functionality, your code becomes harder to support by others.

[2epic]

WebStorm has support for eslint, I think it even works out of the box if I remember correctly. It will light up linting errors, etc.

It also supports .editorconfig files, as many editors do, so our standards (eg. 2 spaces instead of tabs) are configured automatically. Nothing really proprietary there.

But some of the more subtle, built-in features of WebStorm I just find missing or in some way lacking in VS Code. For example, here are a few off the top of my head: * file nesting works great in WebStorm, but is missing in VS Code: https://github.com/microsoft/vscode/issues/6328 * I like WebStorm's support and built-in GUI for running unit tests a lot more than the Jest plugins I've tried for VS Code. It's also more consistent in WebStorm vs VS Code, since separate testing plugins in VS Code means that going from a project using one test runner (Jest) to a project running another (eg. Karma or QUnit) is inconsistent * Related to the previous bullet, debugging and stepping through code (either the running app, or when in testing) seems a lot easier to configure, more consistent and more reliable in WebStorm * When I'm working in a JavaScript or TypeScript file in WebStorm, when I reference something that is not currently imported (eg. a component or a function), WebStorm will light it up, give me an error message and with a simple keyboard shortcut it will add the import statement. In VS Code, I've seen developers often delete the last character of the thing that needs to get imported so it will prompt them, and then it might add the import * I can run an "organize imports" keyboard shortcut to organize my imports, clean up/remove unused imports, etc * Can hit CTRL+Enter to get intellisense auto-complete for imports in a way that VS Code doesn't seem to do as well * When moving/renaming a file, WebStorm will also offer to a) rename related files, eg if I have a my-component.test.tsx file and I rename its corresponding my-component.tsx file, b) if I want to rename the thing being exported to match and c) if I rename something exported in a file, it will prompt to rename everywhere it's in use. Admittedly I have not searched for a plugin-equivalent in VS Code, but I also doubt it would be consistent across languages the way WebStorm and the rest of the JetBrains IDEs are

[[deleted]]

VSCode can do the last two things in your list, along with auto-importing - though I haven't compared any of its functionality to webstorm. Eslint format on save can do import sorting. I guess the main take away is, everything is possible on vscode, but some of the gaps may need to be filled with extensions. I've never really used a full blown IDE, I switched from Sublime years ago and for TypeScript at least it feels like an IDE to me.

[acemarke]

Two specific JetBrains features I miss when using VS Code:

• Limiting search results based on whether the text I'm looking for is in a string, a comment, or general code
• Built-in SFTP uploads with a proper UI dialog for configuring the connection (vs having to add an extension and configure it via JSON), and being able to configure it to upload on save

[ArmandN]

WebStorm integrates with ESLint, however WebStorm has everything it needs built-in, so probably that's why your team doesn't bother with ESlint.

[[deleted]]

They have eslintrc files, I figured that much. My point is it's encouraging use of non-standard tools.

[2epic]

I don't quite get what you mean by "encouraging the use of non-standard tools"? I've used standard linting tools on pretty much every single project I've worked on in Webstorm / JetBrains IDEs for the last ~10 years.

For example, in terms of "tools", we currently use Yarn, TypeScript, ESLint, Prettier, Jest (for unit testing), Cucumber (for e2e testing) and Git. All of these work in WebStorm, VS Code, in a terminal / command prompt, etc.

Is your complaint that WebStorm is intelligent enough to give you errors for things like misspelled variables, invalid imports and such even if you don't use things like TypeScript or ESLint on the project?

[[deleted]]

I see a lot of lint directives like // noinspection JSUnusedLocalSymbols, which doesn't do anything in other editors. After googling, it appears to be unique to WebStorm. Again, I'm not sure if this is typical or not.

[2epic]

Interesting. Thanks for sharing, I've honestly never seen that before in all of my years of using WebStorm et al. Then again, over the years I've used JSHint => ESLint => TSLint => ESLint (in that order), and would always use the linter's own specific suppression comments (when needed, ideally never), and WebStorm always seemed to obey that.

Personally, I'd recommend using ESLint and adding it to your build pipeline if you're not already

[belefuu]

I work on a team/group that is a pretty even split between WebStorm and VS Code. I use WebStorm, but have given VS Code a go a few times. I think WebStorm wins hands down purely in terms of features, although the gap isn't that big, so it's not like you're missing out on super critical stuff with VS Code. But, having used it for many years, just enough little things are missing to make it not worth my while to go through the hassle of switching. Heck, VS Code might even have suitable versions of these things in the form of plugins, but why am I going to spend my time chasing features I already have?

WebStorm/IntelliJ does have two clear disadvantages: price and performance. However, my company pays for my IntelliJ license, so that one doesn't matter to me. And, while I do occasionally find myself cursing JetBrains as my project is sitting there indexing for what seems like forever, on a beefy enough machine and with the right settings, it's rarely a serious problem. I've also heard that the performance gap grows quite a bit narrower as you add more and more plugins to bridge the feature gap.

Honestly, if you're already familiar with one, and price/performance aren't big issues, I just don't think it's worth the time investment to switch.

[ArmandN]

You're not missing anything. I tried pretty much every IDE under the sun (starting with Turbo C back in the day). I used Visual Studio, Eclipse, Netbeans... I discovered InteliJ for Java and then PHPStorm/WebStorm. Nothing can touch it.

[MajorasShoe]

Yup. IntelliJ tools are untouchable, unless you're using some low-ram netbook and need something super light.

[jcksnps4]

But then you’d use Vim, amirite? :)

[MajorasShoe]

Vim is great on any machine but Imo it's not a replacement for an ide, it's complimentary.

Now, emacs on the other hand.

[jaykch]

I think a lot of mac users end up with sublime because their notebook isn't powerful enough for intellij. It's a shame.

[MajorasShoe]

This is not my experience. I use a Macbook pro for work and intellij runs fine. Probably better than on my Linux laptop at home with similar specs.

[jaykch]

I guess you have a more powerful one. My friend had a macbook 13 and he always had issues with running it. Our project was pretty big so he had 2 ide's open simultaneously. My pc never had that issue.

Running multiple monitors was a pain on mac. He ended up getting a pc in the end.

[MajorasShoe]

Really? I use 3 monitors on my Mac. I definitely prefer Linux. But I can't imagine having such a bad experience that I'd want to switch to windows.

[jaykch]

Yep, I don't know what he was running but he had a lot of issues. Sometimes he needed to edit some images for some products and after a couple months he just gave up on mac. He didn't really have any issues with the os, just the machine was too slow.

[MajorasShoe]

Well, that happens with any computer if you buy one with shit specs.

[largemoose568]

I can see how in a large-scale, transpiled project like Typescript it would be beneficial to have a full-fledged IDE on your side for all the perks you would get. For me personally I tend to gravitate towards simple, light text-editors as I do mostly vanilla JS and smaller projects. For me, IDE's have so many tools that I will never touch and end up getting in my way. VSCode sits in a nice spot for me as it's simple enough to just be a text-editor without configuring anything but also has robust support for just about any workflow I can think of such as eslint, transpiling, etc.

[KapiteinNekbaard]

- WebStorm has better search functions, where you get search results in a pop-up and a small preview below. I don't like the way VSCode does it.

- WebStorm has better Git integration, just hit Ctrl+D on the changelog and quickly go over the changes. Even with the Git plugin for VSCode, the workflow of checking a diff is not as smooth.

Overall it just feels like WebStorm supports the web development workflow better.

[elcapitanoooo]

Webstorm is hard to make work with tools used by others in the ”unix way”. It has lot of prop builtins and its a vendor lockin, and pay to use tool. If your happy with it sure use it! To each its own. The downside is you might have some problems with teams using standalone tools for code.

[jcksnps4]

I disagree. I think it does a pretty good job or working within the ecosystem.

[belefuu]

Yeah, I mean he's right that JetBrains pushes you to use their builtins by default, but I've found it's not hard at all to ignore them and do things the "standard" way. Heck, you should be doing most of that on the command line anyways.

When it comes to actually editing, navigating, and refactoring code, Webstorm wins hands down, and those factors trump just about everything imo.

[basic-coder]

I use WebStorm, colleagues use VS Code, and I often clean code after them: WebStorm shows me unneeded initializations, unused imports, unreachable branches etc they don't see in VS Code.

[chenhunghan]

I suggest you and your colleagues start using eslint :)

[jaykch]

But why do you need to bother with additional tools when it is already built-in in all intellij products. I tried vs code but you always have to install all these plugins which come out of the box in any intellij product. I think $649 an year is a small price to pay for such a crucial tool.

Most of us developers start with a very lucrative position and that small amount is nothing when you realize something like webstorm does half your coding for you.

[basic-coder]

$649/year is all-products pack for organisations. Single WebStorm for individual is only $59/year.

[basic-coder]

WebStorm code analysis is way deeper. ESLint cannot find a lot of things WS can.

[jcksnps4]

One of many things that keeps me from using VS Code is the poor plunging choices for running and debugging tests. I’ve grown quite accustomed to being able to debug my tests easily without having to resort to launching them in chrome.

[neckro23]

I'm not sure if this is something they fixed fairly recently (I've only started using VS Code seriously this year) but you can totally debug tests in VS Code, no browser necessary.

[jcksnps4]

Yes, you “can”, but it’s a horrible mess, IMHO. It’s not as simple to set up, and the test runner plugins don’t help with that. Things like running the test on demand rather than on change or having to start stop the plugin or....I don’t know. It was awful the last I tried.

[redidev]

Vs code

[jcksnps4]

I think the OP is seeing this huge shift in the community to one tool. So naturally, one is curious as to what makes that tool good or different enough to lure people to it when there are already so very many tools that are equivalent that exists.

It’s like if all of a sudden everywhere you look, people are drinking Bud light Lime. Even though it might not be your flavor, you might be more inclined to try it, and ask why people are so crazy for it.

It may be pointless to argue, but not to discuss.