Why Visual Studio Code is the best code editor for web development

Yousif Al-Raheem
The Startup
5 min readMay 29, 2020

--

A code editor for web development that improves your efficiency.

Javascript has definitely created a shift in the ways we do software development that no other language did. It started as a scripting language for the web to be used in primitive ways, for example, validating fields and displaying error messages. Nowadays, Javascript is used to develop almost any kind of application you can think of. From web, mobile, and desktop applications to backend services and even games.
In other languages, you had to stick with a limited amount of IDEs, in some cases, there was only one. Although, having more code editors to pick from seems like an advantage, in some cases it’s not. It is an advantage in terms of creating a competitive environment for the developers of these code editors to keep improving. I’ve seen often times developers stick with an old code editor that doesn’t have the same capabilities as modern code editors which results in slower delivery time. The concept is similar to having a cross-platform game where you play on an iPad Pro thinking you have the advantage over those who play on phones, but then realize that your opponent is using a gaming phone that is equipped with a joystick and shoulder buttons. It doesn’t matter how capable and fast your iPad Pro is, having extra controls at your fingertips means faster responses. Given that you and your opponent are equal in skillset.

Timeline

If you’ve been coding for a long time, you probably used Vim which was released in 1991. At the time, it seemed like there’s nothing that can beat it until Sublime Text came in 2008. A code editor that was equipped with so many compelling features and more added every year. The ability to place multiple cursors and edit multiple lines at the same time was magical. A package control system that delivers extra features powered by the community. For years, I thought nothing can beat Sublime Text.

Sublime Text

In 2014, both Github and Adobe released a free code editor to compete with Sublime Text. Atom and Brackets respectively. They both had a decent amount of features and modern design. Atom came with robust integration with Github which was compelling for a lot of developers.

In 2015, Microsoft released Visual Studio Code (will be referred to as VSCode), a completely free code editor. It didn’t feel like something that Microsoft would do especially when they had Visual Studio as a paid software at the time. When I first installed the beta version, I thought this is just a way for Microsoft to show us a product before it puts a price tag on it by the time we get used to it. 5 years have passed as the day I’m writing this, and VSCode is still free at version 1.45.

Let’s compare

So how does it compare to the other code editors? In the past 4 years, I’ve switched between code editors to test them out trying to find the best of them. These are the code editors I’ve used:

  • Visual Studio Code
  • Sublime Text
  • Atom
  • Brackets
  • Vim
  • Webstorm

Let’s talk about performance first, I still couldn’t find any other code editor that beats Sublime Text in speed. Not even Vim. Sublime Text is written in C++ and speed is one of the selling points for the company. It’s important to notice that VSCode, Atom, and Brackets are built with Electron, which is the main reason why they’re lagging behind the rest. But don’t let speed trick you in here, just like the example I gave earlier, a phone cannot beat an iPad Pro in performance or launch time, but it can beat it in features. VSCode was built from scratch taking in mind all the other competing code editors and all the features that the community fell in love with. The developers behind VSCode didn’t just stop there, they were the fastest when it comes to delivering requested features by the community.

Once you start using VSCode and get familiar with its shortcuts and features, you’ll probably never go back. Let me give you a few examples here:

  • The refactoring power that is baked inside VSCode is unbelievable. I’ve experienced this feature with other code editors such, especially Webstorm. But nothing came close to VSCode. You move a file from one directory to another and you get a popup asking you if you want VSCode to refactoring the import URLs. Or, highlighting a variable and using the F2 key to rename it will take effect no only inside the same file, but everywhere across the project.
Renaming variables with VSCode
  • Built-in integration with Git without the need to install any package/extension, and it works better than anything else I’ve used in other code editors. It’s so powerful to the point where I stopped using CLI or GUI Git management solutions and just use VSCode. Does that make me less of a pro if I don’t use CLI? NO! it makes me faster. Instead of wasting your time to pull up a terminal and typing the command or Googling a command that you forgot, you can just hit cmd/ctrl+shift+p and type Git and you will find all the commands you need.
  • A powerful extension ecosystem is also built to VSCode. You will find an extension that you never thought you needed. You have a plethora of options for any kind of capability that you want to add.
  • A highly flexible window layout. You can almost customize the placement of any window inside VSCode. I recently switched the side menu from the left side to the right side. The rationale behind it is that I often hide and show the sidebar during my development. Having the code window jump when showing and hiding was a bit annoying.
  • And finally, a very powerful IntelliSense engine. This is something that I missed a lot when I was testing the other code editors. Yes, you shouldn’t be making a lot of mistakes as a highly experienced developer. But the reality is, you are going to make mistakes. That’s what we do. We’re humans. However, VSCode IntelliSense will show you the mistakes you’re making as you’re typing them. It will show you peek definitions faster than any other code editor.

Conclusion

Using a powerful code editor will give you the upper hand compared to using a less powerful one. You have every right to stick to another code editor because you fell in love with its features, or maybe you’re used to it. But if you haven’t tried VSCode, maybe now is the time to give it a chance.

If you’ve been using VSCode and you’re not sure it’s the best solution then I advise you to try alternatives and try to weigh in the pros and cons. Just keep in mind that the code editor that helps you do your job more efficiently is the one you should stick to. In my case, it was VSCode.

--

--

Yousif Al-Raheem
The Startup

A Frontend Tech lead with masters degree in Software engineering. A tech enthusiast, a code geek, with a very sociable attitude.