Ben Owen

Full time nerd. Professional eater of cake.

Atom vs Visual Studio Code

Confession time.

For years, I have used good old Notepad for just about every text editing need. Configuration, batch files, HTML / CSS / JavaScript, even the odd short C# program - all in the most basic editor known to man. I don't really know why I did it, other than to avoid the glacial startup time of Visual Studio. I would occasionally install Notepad++ and then forget to use it. If Notepad couldn't cope with the file (e.g. Unix newlines, gigantic size), I'd just use Wordpad instead.

I must be a masochist.

When I came to writing this blog (templates in HTML, content in Markdown), I decided that I would use an editor more suited to the task. First, I tried Atom. Today I'm trying Visual Studio Code.

In many ways, these two editors are very similar:

  • Both sport a clean, dark theme out of the box - a lot more modern looking than Notepad++.
  • Both are based on Electron, so the menu items etc are very similar.
  • Both provide syntax highlighting for many languages and feature Git integration.

Download size

The Visual Studio Code download package was 32.8MB, whereas the Atom installer weighed in at a hefty 113MB.

Winner: Visual Studio Code

Startup time

As someone used to waiting for full-fat Visual Studio to load, both editors were lightning fast to load.

Visual Studio Code felt slightly quicker, but without timing them properly it was really too close to call.

Tie.

Git integration

Visual Studio Code makes it's Git integration very obvious - a large icon in the sidebar with an overlay indicating the number of changed files. Clicking on this shows a list of affected files, and provides a simple UI to enter a message and commit. A context menu provides push / pull / sync / undo etc. options.

Atom, on the other hand, does not seem to be as strong here (at least out of the box, I've not looked for plugins). There is a panel in the status bar which shows the current branch name and a comparison to the upstream repository. In the Packages menu, there are options for Git Diff and Open On GitHub - which includes tools such as history and blame. There doesn't seem to be an obvious way to commit / push from within the editor.

Winner: Visual Studio Code

Syntax highlighting

Neither editor managed to auto-detect the content of a .post file (Scatter blog post) as Markdown.

In Visual Studio Code, I opened the command palette and typed 'language'. This brought up an option for 'Change Language Mode', which included an option to 'Configure File Association for .post'. This allowed me to permanently set .post files as being written in Markdown. When opening a new .post file, VS Code correctly applied syntax highlighting.

In Atom, the command palette provided no hints for the keywords 'language', 'syntax' or 'highlighting'. 'Markdown' gave me the option to toggle a preview window, which was pretty neat, but not what I wanted (indidentally, VS Code also supports this feature). Eventually, I found the option to toggle highlighting under Edit -> Select Grammar, though this did not give me any option to associate the selected grammar as the default for a file extension.

Winner: Visual Studio Code - although it wasn't super obvious to set up.

Spell checker

This is one where Atom is the clear winner - because it spell checked my work out of the box, and VS Code did not.

Verdict

Both editors are lightweight, yet powerful. Compared with classic Notepad, both are amazing (isn't everything?).

I think I will be using VS Code from now on - it was the clear winner in terms of Git integration, and asssociating the file extensions used by Scatter with the Markdown syntax highlighting will save me effort going forward. A spell checker would be useful, but I'd expect more from Atom given the vast difference in download size.

This was a thoroughly unscientific comparison and may be entirely wrong / misleading. Mileage may vary according to personal circumstances. Other text editors are available which were not covered here. Try them both for yourself!