Menu

You Can Finally Run Visual Studio Code On Your Browser

You Can Finally Run Visual Studio Code On Your Browser

If you are on the go and not around your main coding laptop, or maybe you're on a machine that doesn't have Visual Studio Code installed (or can't get it installed), you can now access a lightweight version of the popular coding text editor by going to https://vscode.dev/.

This isn't the first attempt at getting the popular lightweight IDE onto the web, but so far it seems to be the most robust and feature rich version that I've personally seen. And it just works without any kind of messy installations.

Let's get into what you can and can't do with Visual Studio Code for the Web.

Features

When you first visit the URL, you will be greeted with the all too familiar VS Code landing page.

Pretty much all of the familiar features from the desktop version will appear on screen with near identical look and feel. You have the same (ish) vertical menu panel on the far left, with the typical file explorer, search, source control, run, extensions and remote explorer icons.

The same search and syntax functionality found in the desktop version works just as expected. And you also have Visual Studio Code's autocomplete and intellisense suggestions as well as you type.

Surprisingly, the autocomplete dropdown on the browser is just as fast as it is on desktop and after a few minutes of writing code, you really do forget that you aren't using a desktop app at all. The usual 'tab' to insert shortcut is present as well.

You also get the same multiple tab support that you would get on desktop and split view is fully functional as well.

From my tests, the code loaded incredibly fast even with large files. And that was a pleasant surprise as many fully online coding editors tend to suffer when it comes to performance in loading content heavy files. They either take forever to load, or they suffer through lag as you type. I did not find either of those to be an issue here.

Extensions are also supported in the browser version, which is very nice to see, though there are certain ones that aren't capable of running in the browser.

Certain extensions which involve a live server or the client hardware are not fully supported by the browser. Those are marked with a warning sign in the extension explorer.

If you are using either the Edge or Chrome browser, than VS Code for the Web can use the File System Access API to access local machine files. That means that you can essentially point a local directory, and the web IDE will load the entire project. Any changes made to these files are saved automatically in the local system.

If you are in a non-supported browser however (Firefox), you are limited in how you can load files to the editor. While you won't be able to access the local file system directly, you will be able to upload your files to the editor. (Note that changes to these files are not carried over to the actual file itelf).

You can also load projects directly from either a GitHub repository or Azure Repos by specifying the correct project path.

So overall, VS Code for Web offers a very close experience to actually developing on the beloved desktop IDE. It's fast, it's responsive and best of all it's incredibly familiar if you've been using the desktop version already.

Desktop vs Web

Visual Studio Code for the Web has its limitations when it comes to running on a browser however. The main one being that it can not run, build or debug your projects directly from the browser.

And that's huge, because it means that you can't fully develop and test certain types of projects from it. You will still require an actual version of VS Code for desktop or an account with GitHub Codespaces in order to do so.

If you are working directly from a Github repo however, then it is possible to edit the code and to test it, if you have a continuously deployed server using that repo.

And as mentioned above, not all extensions are fully supported on the web version as well. So if there is one particular tool that you often use and that you just have to use in your projects, check if there is support for it before fully committing to development on the web.

Shortcuts are also limited in VS Code for Web. And that's mainly due to the browser limitations, as the browser has its own shortcuts that it must abide by. The usual ctrl+s, ctrl-v and ctrl+c still work just as expected however.

Aside from those main issues, Microsoft has done a fantastic job at getting most desktop features ported over.

Browser Support

Most of the editor features will run just fine in the latest and greatest browsers. By that I mean the features of the code editor, the search panel and even the extension library will run just fine.

For local file access however, you will need a browser with support for the File System Access API. And currently, those include just Edge and Chrome.

File uploading works just fine however on every browser that I tested. You just won't be able to modify any local files directly, which can limit the overall usefulness.

Last Words

Visual Studio Code for the Web is not intended to replace Visual Studio Code in any way. It's just a convenient way to edit files when working in an environment that does not support VS Code for Desktop.

As such, there are features that are missing and that not every browser fully supports. If you are looking to develop a full-stack frontend web application, then you might find that the limitations of VS Code for Web just won't cut it for you. In which case, you can either download VS Code (standard) or use GitHub Codespaces as mentioned above.

On a last note though, VS Code for Web is impressive on many levels. It's speed is very noticeable and it almost doesn't feel like you are working on the browser at all, and that's very hard to do.

The long held dream of being able to write code on the go on a tablet or a phone is no longer as farfetched as it once seemed. It's very much possible right now with the technology that we have and VS Code for Web is a good start.

Walter G. author of blog post
Walter Guevara is a Computer Scientist, software engineer, startup founder and previous mentor for a coding bootcamp. He has been creating software for the past 20 years.

Get the latest programming news directly in your inbox!

Have a question on this article?

You can leave me a question on this particular article (or any other really).

Ask a question

Community Comments

No comments posted yet
Ad Unit

Current Poll

Total Votes:
Q:
Submit

Add a comment