VS Code vs Atom - how to decide?

I think we can all agree that there’s one thing every programmer needs, and no, I’m not talking about the computer - it’s too obvious. I’m talking about software - the text editor. Whether it’s a GUI-based or terminal-based, IDE or not and etc. it’s always a necessity!

In my case, as I’m mostly doing web development, I don’t need anything special. In the JS ecosystem, all tools are just enough intuitive and easy to use, so that I don’t need any kind of special IDE or any other layer of abstraction over them. Now, when it comes to comfort, it’s a whole another story. Maybe I don’t need an IDE, but it didn’t stop me from trying more than 10 different text editors - simple ones, IDEs, VIM-like and more… - just to find the most comfortable one for me to use. And man! - it took me quite a while…

Long story short, I settled down upon VS Code, yet I still have the 3 others of my favorite code editors installed, these are WebStorm, Sublime Text, and Atom. As the first two are paid ones and provide a similar set of features to extendable editors like VS Code and Atom, most people will be deciding between these.

Some background

Because your reading this post I bet you already know at least something about Atom and VS Code. For those of you who don’t know - here’s a little info.

Both the VS Code and Atom are open-source code editors, originally created by Microsoft and GitHub respectively. Each of these editors is based on Electron - a framework for creating “native” desktop apps with web technologies - HTML, CSS, JS - with the addition of Node.js. By “native” I mean pre-bundled with Chromium - the more Chromiums the merrier, right? The editors are considered suitable for use with different programming languages, but it’s a no-brainer that they work best for web development, especially given the way they were built.

The editors also feature modern-looking UI, advanced syntax highlighting and well-developed extensions and theming system. Which we’ll talk about in a moment, to compare the two, but first…

A bit of History

From the historical standpoint, Atom came first. Released in 2014, Atom was the first piece of software built with Electron (which at that time was named Atom Shell) and also the one that Electron was originally created for. It was and is marketed as a “hackable editor for the 21-st century”. After a short amount of time, the editor took off in terms of popularity, and became fully open-source (at the beginning only some parts of the code were), together with Electron.

Open-sourcing Electron led to the creation of a lot of different apps, that are now used by many people every day. One of those apps was - you guessed it - VS Code. A code editor meant to “redefine” the overall development experience.

Even though the two editors are pretty similar at their cores, VS Code proved to be the superior one - especially when considering the performance. As time passed, more and more users were choosing VS Code over Atom. It’s becoming increasingly more popular and thus developed a greater community and user base.

From the more recent history, VS Code was considered the most popular development tool in all categories, in the recent Stack Overflow Developer Survey from 2018. With that said, Atom is still widely used. But, with the acquisition of GitHub by Microsoft, things aren’t looking good for the Atom editor. Although it’s an open-source project developed by its community, contributions from the creators from GitHub were definitely forming a significant chunk of the entire code-base. Even with Microsoft becoming lately a more open and FOSS-supporting company, it doesn’t make much sense to maintain two very similar tools, when one is better than another… or is it? Well, it remains to be seen. As for right now, Atom is still kicking and we’re going to have a brief comparison of both of these editors.

Design

Let’s start our comparison from the most “controversial” category - design. Now, I know that personal preferences may vary in this category, but I’ll try to provide at least my own perspective.

So, both Atom and VS Code look arguably nice out of the box. The use of HTML with CSS underneath makes it easy to pull it off. They both feature nice, dark or light, minimalistic design, together with vast theming options. Again, thanks to CSS, you can easily create your own custom themes for both editors or use ones provided within the extensions registry - there’s a ton!

In my opinion, the well-designed UI is the one that doesn’t distract you or make you think about it even for a moment. That’s why, whether I use Atom or VS Code I always use a similar-looking theme, based on Google’s Material Design. It’s not hard to find one, as the best options for both editors are ones that are the most popular, and have the highest download counts.

With all that said, I always have a feeling that Atom’s Atom Material UI looks nicer to me than VS Code’s Material Theme. Combined with Atom’s general UI layout, it just has this cleaner look to it, even when compared with still awesome VS Code. Also, while it rather applies to themes rather than code editors themselves, Atom Material UI developers have done a much better job with contrast, especially when considering the light version, which I use very often. Still, I remind you that it’s a matter of preference and you don’t have to agree with me at all. Anyway, here, the point goes to Atom.

Performance

Different people say different things about the performance of Electron-based apps. That they’re slow, that they consume a lot of memory and etc. And, while I can deny that there’s some truth to that statements, different apps don’t necessarily have the same performance issues as the other ones. Of course, if you only care about raw performance, my recommendation would be to go with the paid Sublime Text, which is one of the fastest code editors on the entire market right now, but, as we’re comparing only Atom and VS Code, you can take that as kind of a reference point. Generally, both of these fall between Sublime Text and WebStorm (a full-blown IDE) on the performance spectrum. But where exactly?

Even if Atom was the first, everyone who has used both of these editors, at least to some small extent, must agree - VS Code is just faster. Everything connected with it is fast, smooth and performant. So, how is Electron faster than… Electron?! Well, the answer comes in the form of optimizations… and extensions. Both editors feature an impressive amount of 3rd-party extensions, themes, and tools available, to help you customize them to your own needs. But, as these extensions are generally very heavily used, they definitely have some impact on the overall performance of the app. The best example of this is a little label in the Atom’s extensions center, indicating the amount of time added to the load time, by the given extension. People behind the VS Code has just done a much better job with making all these extensions (or rather the architecture behind them), less performance-hungry.

Of course, Atom’s developers recognize the problem and are constantly improving their product. Most recently they were working on the Atom’s file explorer with some impressive results! They drastically improved the search speed (especially seen in large projects) with the help of Rust-based regex library (and most likely some WASM). So, I only hope that these performance improvements will continue, eventually match VS Code’s offering…

Ecosystem

Now, as both the VS Code and Atom have extensions and theming systems of their own, let’s make a brief overview of those too! If raw stats are what you care about, then I think you’d be happy to hear that both of these editors have around 11K - 12K published extensions and themes, with VS Code having only a tiny little more.

Both extensions registries are available through the editor or on websites - for Atom and VS Code respectively. You can easily install an extension with a simple click of a button and no reload at all (only recently added to VS Code) in both the editors. The same goes for the removal process.

As you can see, the extensions system is as simple as possible from the user stand-point. What about the extensions developers tho? Both official docs (Atom, VS Code) feature detailed and in-depth guides and API references. When comparing the two, I think Atom’s one is a bit more beginner-friendly than VS Code’s. Maybe it’s because of VS Code’s more complicated architecture when it comes to extensions. But, all in all, if you want to create your first extension, maybe first go with Atom, to get a glimpse of what it’s all about, before heading to VS Code…

Configuration

With tons of extensions and customization comes a lot of configuration. And, whether you agree with me or not, it represents an important part of the overall user experience of the editor.

Configuration of VS Code involved only a simple JSON file… up until recently. Now, whenever it’s possible, a GUI interface is available. It’s fairly simple, but it does its job, and it does it well. It’s just a small abstraction over what we had already available with JSON and TS-based autocompletion.

On the Atom’s side, things look only a bit different. Instead of having a singular JSON file to edit, you have GUI everywhere! The editor settings themselves are completely separated from the extensions, as each of those has its own, dedicated page. I consider this a pretty good approach. Sadly, some users report lags and other performance issues, during the configuration process. Maybe it’s because of them having just too many extensions installed? Personally, I haven’t experienced similar issues, maybe because of my fairly small number of installed extensions, but who knows?

Experience

Now, let’s analyze what has been said once again, with some additions, to determine what the general experience of using the given code editor is.

While Atom looks gorgeous with its minimalistic UI (for me at least), the performance of VS Code is something that cannot be shaded by good design. Besides, VS Code still looks cool! Both editors have a vast collection of extensions to choose from and fairly simple way of configuring them.

Something that I haven’t yet talked about is the overall “development comfort”. What I mean by that is just how pleasant it is to write code in the given editor. As I cannot talk for languages other than JavaScript, here’s my web-development-tailored opinion - VS Code nailed it! I think it isn’t a surprise to anyone. As one and the same company - Microsoft - created both the amazing code editor and productivity-enhancing JavaScript subset - TypeScript - these products are destined to work well together! And work well together they do, with TS providing autocompletion and all so-called “intellisense” features you can only dream of without TS. Atom still has its own extensions to do the job, but they still have a long way to achieve the same results as VS Code is currently offering.

But, Atom also has a few tricks in its sleeve. What I consider the biggest one is its GitHub integration. Because of Atom’s previous affiliations with GitHub as a company, this feature is kind of… predictable. Up until this point, VS Code has a fair number of GitHub-related extensions, but none of them were able to replicate what Atom has to offer. Yet, because of the latest Microsoft’s acquisition, things might start to change…

Decision-making process

So, these were just my both subjective and objective opinions about these two editors. Now, it’s your time to choose! Especially for beginners, it might be a very time-consuming process, so I recommend you to just try out a little of both, to finally pick the one. And even then, remember that your choice doesn’t have to remain unchanged. If you’ve already made up your mind - good for you! Consider letting me know in the comments, what’s your editor-of-choice?

I hope this post provided you with at least some interesting and useful information. If it indeed did so, think about showing your support by following me on Twitter, on my Facebook page, or through my weekly newsletter. Again, I hope you liked the reading, and wish you a nice day!