I'm Switching From Visual Studio Code To JetBrains WebStorm

I utilised JetBrains WebStorm, an IDE (integrated development environment) for JavaScript development, when I launched my first JavaScript project in 2015. Because I had previously worked with Android Studio, which is based on IntelliJ IDEA, I was already familiar with JetBrains IDEs. In addition, my firm provided me with a WebStorm licence, allowing me to utilise it without restriction.

As Visual Studio Code grew in popularity, I began to use it for my subsequent web projects. It appealed to me since it was more faster, more adaptable, and free, allowing me to use it for my personal projects.

In my current job, I met a developer who was perplexed that I was developing huge commercial applications using an editor rather than an IDE. First, I didn't pay attention to his concerns, but I now see his point of view.

In this blog article, I'll explain why I now prefer WebStorm to VS Code for web development.

Preamble

This is a really hot topic, and I'm sure it will spark considerable debate. In the following essay, I discuss my experience using WebStorm in a big Angular application that was primarily written in Visual Studio Code.

Code Inspection

WebStorm provides a robust, fast, and flexible static code analysis. This analysis detects language and runtime errors, suggests corrections and improvements. It also indexes your whole project and can, for example, detect all unused methods, variables and more.

You can also detect unused methods in JavaScript methods with the no-unused-vars and no-unreachable rules in VS Code and ESLint. However, if you are working on a TypeScript project (such as Angular), VS Code will not discover unneeded public methods. Consider the following simple example:

Source Control / Git Integration

VS Code has per default a pretty basic git integration. You can either use extensions like GitLens or use additional tools like Sourcetree if you like to use a GUI for complex git work.

WebStorm provides all the functionality for complex git work out of the box. You can commit files, review changes, and resolve conflicts with a visual diff/merge tool right in the IDE.

Local History

Although VS Code does not save a local history of your modifications, you can utilise extensions such as Local History to do so.

WebStorm automatically tracks all modifications you make to your files, preventing you from losing them inadvertently. You can examine the history of files and folders as well as perform rollbacks. This can be beneficial if you, for example, accidentally performed a git push force and overwrote your files on the remote branch.

Debugging

On Chrome, VS Code can only debug web applications by using the Debugger For Chrome extension, which you must then configure for your application.

When you use WebStorm, you already have everything available by default, and for Angular, for example, you just need to choose "Debug Application" and you can set breakpoints in the editor and watch variables, among other things.

Speed

VS Code is built using Electron and powered by HTML and JavaScript.

WebStorm is written in Java, and it feels slower in general than VS Code. I wouldn't say it's noticeably slower, but the change is evident.

Although VS Code offers a faster startup time, if you are working on a project, your IDE or editor is always open, therefore starting time is unimportant.

Price

VS Code is open source and free to use.

You need to pay for a WebStorm license unless you choose one of the free licenses available for open source projects, students, teachers, classroom assistance or training courses, coding schools and boot camps.

Another option is to use the EAP (Early Access Program). These pre-release versions include features which will be added to the next release. These versions are temporarily available before a new version of the software will be released.

This is the official disclaimer for the EAP:

This is an early access version of the product. You expressly acknowledge that this version of the product may not be reliable, may not work as intended and may contain errors. Any use of the EAP product is at your own risk.

Conclusion

VS Code is more of an editor than an IDE like WebStorm is categorized as. WebStorm has in its standard installation more features than VS Code has in its default installation without any additionally installed extensions.

Microsoft has created an amazing product with VS Code which you can of course use for larger business applications. Generally, I would prefer and recommend using WebStorm due to these reasons:

• Better code analysis functionalities
• All-in-one IDE with good basic functionality without the need to install many additional plugins
• Much better code refactoring possibilities

If you prioritize speed, prefer using open source software or just want to quickly edit some configuration files then you should go for VS Code.

What are your experiences using VS Code and WebStorm? Let me know in the comments what you use to develop your application!