VS Code vs WebStorm - can a code editor stand against an IDE?

Some time ago, I’ve written an article comparing VS Code with Atom. Even though a fair bit of time has passed since then it stood the test of time quite well.

So, today we’ll be doing something similar in the meaning that we’ll be comparing 2 very popular coding environments. This time it’ll be the most likely known to you VS Code and WebStorm - a web development IDE from JetBrain’s IDEs family. Let’s dive in!

Contenders

First off, let’s get to know more about our actual contenders.

VS Code

VS Code is arguably the most popular code editor in the world right now - and for sure among web developers. It’s developed by Microsoft, together with a large open-source community.

Under the hood, it uses Electron (framework for creating desktop apps with web technologies) and is heavily customizable and extendable.

WebStorm

WebStorm is one of the most well-known and profound JavaScript IDEs. It’s developed by JetBrains - a company with years of experience in creating powerful IDEs for a variety of programming languages.

Being a full-blown IDE it is, WebStorm provides you with an impressive set of features and web development tools, with decent performance thanks to its JVM backing.

Pricing

Out of the gate, I’d like to tackle the single reason why you might scrap the idea of using WebStorm all together, and that’s pricing.

While VS Code is mostly open-source and certainly 100% free, WebStorm is neither of those two. It costs $5.90/month or $59/year for individuals and a fair bit more for organizations. It’s important to note that the cost goes down with time, and so if you pay for WebStorm for 3 years in a row, you can from then on pay only $35/year for it.

Now, this might tick or even completely discourage many developers from even giving WebStorm a try. That’s the sad reality we’re living in - the perceived value of software is decreasing, customers aren’t willing to pay, and the subscription model is taking over. However, I think there’s nothing wrong with paying for a product that delivers the proper value - and that’s certainly the case with WebStorm. So, consider at least trying out WebStorm for its 30 day trial period, use it, and continue reading before you make a decision.

Design

With pricing out of the way, we can finally talk about the products themselves. Let’s start with the design.

The design (User Interface/UI) of VS Code is looking very modern, slick, and minimalistic. But beyond that, it’s very hard to talk about it. That’s because almost every aspect of VS Code UI can be changed and customized by the user. Tons of ready-to-use themes are available, and everyone can create their own, with just some time and some tweaking here and there. So you can’t say that something doesn’t look good if you can always make it look the way you want.

WebStorm, on the other hand, is a full-blown IDE, and can’t afford to be minimalistic. The sheer number of features packed into it can cause beginners to feel overwhelmed by the number of all the buttons, menus, and shortcuts, in which even more advanced users can get lost from time to time. Sure, there are options to hide some of the clutter and change the design a little bit, but it doesn’t come close to VS Code customization capabilities. But again, maybe this form-factor doesn’t even allow it to.

Performance

Now, comparing the performance and the snappiness of the 2 environments can be interesting as we’ve got 2 fundamentally different approaches with different infrastructures to back them up. How does that play out?

Highly customizable and extendable, yet still backed by resource-hungry Electron, VS Code is in an interesting position. Back in the day, when I compared it to Atom - Electron pioneer - VS Code delivered some promising results. The app itself was pretty fluid, running without any issues. Only after adding a few heavy extensions, I saw a decrease in performance. This is still mostly true up to this day.

With that said, WebStorm is packed with features. This causes it to feel slow and consume a lot of your device’s resources. But because it uses JVM under the hood, it’s certainly a bit faster and more optimized than any Electron app. It’s just all these additional features that cause the IDE to slow down.

Now, most of these WebStorm features can be turned off but, is this really what you want? No real-time auto-completion, no linting no Git management - at this point you’ll be better off going with a simple code editor, like VS Code. It is faster, but again - only when you limit the number of extensions you use. If you were to extend VS Code to the point of it matching WebStorm’s capabilities, I bet the performance would be comparable if not worse on the VS Code.

So, I’d say the performance category is a tie. It really depends on what you want to do and how you want to do it with your tool. Want simplicity and speed? - go with VS Code. Considering VS Code but only with tons of additional extensions? - WebStorm might be a better choice.

Features & extendability

So, we see performance depends heavily on feature-sets, but how do these compare between the tools?

In terms of the VS Code, we could argue its biggest feature is its extendability. Without any extension installed, all you get is a sleek UI, paired with basic autocompletion and syntax highlighting, bare-bones debugger, and some Git management tools. That’s pretty much everything you get “out-of-the-box”.

But I’d argue that the VS Code without extensions isn’t really VS Code. This extendability with a marketplace of 10K+ extensions and themes, with an easy way to create your own make VS Code what it truly is - amazing, extendable code editor.

WebStorm on the other hand has pretty much everything built-in. Pretty much all the popular JavaScript frameworks, tools, and libraries have their place in WebStorm. There is a slight level of customizability with different extensions for different features, but nothing near the size of the VS Code extension marketplace. Still, some might prefer this out-of-the-box experience that you get with WebStorm. Less customizability, without missing any features means that you can just install the software and start working.

Personal thoughts

So, with all this objective comparison in mind, I’d like to also give you some of my own thoughts on the matter. Personally, I’m a die-heart VS Code user. I love its clean look, all these vast customizability options, and especially all the extensions which I can install at any time. Any programming language, any use-case, any scenario - there’s an extension for that.

However, there are times were VS Code doesn’t hold up. Maybe it’s because of my machine or the giant config, but the ESLint extension for example often can’t be used reliably in “run on type” mode. Such cases pushed me to look for alternatives, and that’s how I run into WebStorm.

On this end of the spectrum, I truly enjoyed the “out-of-the-box” experience without having to install anything. Only on the initial startup did I install the Material Design theme (which looks great by the way), and that was it. Sure, some customizations to the font and UI display were needed, which required me to go through all the menus, but that wasn’t that bad.

The JS/TS autocompletion was on pair with VS Code intellisense, built-in Git management was excellent, and the local history feature (essentially background automatic Git repository) was live-saving at times. To be honest, ESLint with my bulky config was also running pretty smoothly, only with the fans spinning viciously.

Ultimately, I keep both VS Code and WebStorm installed. Although I use mainly VS Code because of the direct pricing part of WebStorm, I still appreciate all the functionality that IDE delivers.

Bottom line

To summarize, I call this match a draw. Unlike with Atom and VS Code, there are fewer similarities here, and thus fewer possibilities to say which tool is truly better. If you’re willing to spend some money on the top-level experience and have a device that can handle it, feel free to go with WebStorm. Otherwise, you can always take some time to customize the VS Code to fit your needs perfectly.

But that’s just my opinion. I highly encourage you to share yours in the comments below. Are you VS Code or WebStorm user? Maybe you use a completely different tool? What are the reasons you’re using it? For these and more questions - the comment section is officially opened!

For more up-to-date web development content, follow me on Twitter, Facebook, or through my newsletter. Thanks for reading and happy coding!