Vim with plugins is a popular IDE option. The reason most people stay away from Vim is the steep learning curve. Most of Vim’s power comes from all the key bindings you have to learn. Just saving and exiting a file can be a daunting task for someone who have never used the text editor before.
That being said, anyone who currently uses Vim as their text editor of choice will espouse the power of these keyboard commands. The biggest benefit of learning Vim is that you never need to take your hands off the keyboard. There is no need to do anything with a mouse. Different key combinations allow you to easily move around, copy, paste, delete, etc. Once you get past the steep learning curve, Vim becomes one of the most powerful and fastest to use text editors on the planet.
VS Code
Visual Studio Code (“VS Code”) is a modern IDE/text editor that has gained a huge following, especially among frontend web developers. It is often the editor of choice for JavaScript engineers. It is not limited to JavaScript and has great plugins for just about any language you can think of.
VS Code is a modern editor made for today’s web developer world. There is no learning curve and the editor even recommends which plugins you may want to install depending on what type of file you are working with.
One of the most impressive features of VS Code is the large amount of plugins. These plugins include language plugins which help developers work with specific languages, but also include plugins for how the editor itself functions and looks. This includes a Vim plugin which allows users to use Vim/Vi key bindings while working in VS Code.
Setting Up VS Code
These days I mostly code is JavaScript with a bit of Go and Python added in from time to time. Because VS Code has such a strong focus on web development, I thought it might help make me a more efficient developer. And I wanted to see what the hype was all about.
I installed VS Code and immediately added the most popular JavaScript, TypeScript and Go plugins. There were a few things I knew I would miss from my Vim setup, including little things like being able to view the color of a CSS color value in the IDE, so I found and installed plugins which provide that functionality. Of course I also added the Vim plugin which allows me to use all the Vim key strokes in VS Code.
It took a couple of hours to get everything installed, and I was ready to go.
Again, VS Code has a much smaller learning curve than Vim. It took me a lot longer to get my .vimrc file setup the way I wanted and all the Vim plugins working with one another. If you are brand new to web development and want a good IDE with little setup and a small learning curve, VS Code is a better option than Vim.
Working In VS Code
After the initial setup, I was ready to start developing. The very first thing I noticed was that I wanted to use my mouse a bunch. I think the layout of VS Code is made to have users instinctively point and click for certain actions. I had all my standard Vim commands available, but I soon saw myself wanting to use the custom Vim shortcuts I had installed for all my Vim plugins, which as file searching. After a bit of effort I got VS Code to replicate a lot of these shortcuts.
All in all, I have most of the Vim functionality working in VS Code, but there are some things (command history) that seem to be missing.
I also found that there are some neat features in VS Code that I never really thought about needing until I saw them in action. The most impressive of these is being able to peek at the definition of a function, even if that function lives in a different file. Maybe there is a Vim plugin that does this, but it’s not something my Vim was setup to do. I found this function to be especially helpful when working in repositories that I was less familiar with. Being able to quickly see the definition of a function, without having to leave the line I was currently working on improved my workflow.
The Lag
When working in a repository I am familiar with, I found that VS Code is too slow for me to use efficiently. Maybe there is an optimization that I need to perform, but I found that VS Code was slowing me down. The biggest reason was that Vim’s autocomplete is fast and I use it all the time. I end up hitting the tab key after two or three characters of a variable or function. VS Code’s autocomplete feature was much slower to popup and I found myself sometimes attempting to autocomplete before the popup showed up.
I also noticed that VS Code’s interpretation of Vim’s period (redo the last command) was noticeably slower.
Will I Switch To VS Code From Vim?
I like VS Code when working with repositories and code that I am less familiar with, but if I am looking for speed, Vim is superior. VS Code is a larger, slower program than Vim and it is noticeable when I am attempting to develop at full speed.
I’ll continue to use VS Code and will look into optimizations, but if it does not start working faster than it currently does, I am likely to stick with Vim. I am more likely to look for additional Vim plugins to replicate the VS Code functionality that I like while keeping the speed of Vim than I am to slow down my development by using VS Code.
