Microsoft brengt browserversie van Visual Studio Code uit

Microsoft heeft een versie van Visual Studio Code uitgebracht die in de browser werkt. VS Code for Web is een afgeslankte versie van het programma waarmee gebruikers lokale bestanden kunnen openen en bewerken in Chrome of Edge.

De webversie van Visual Studio is te gebruiken op vscode.dev. Met de webversie is het mogelijk bestanden te editen, en applicaties te schrijven en te debuggen met de tools van de browser. Microsoft zegt dat de onlineversie vooral interessant is voor gebruikers die code willen schrijven op machines waar ze geen software op kunnen installeren, zoals beheerde apparaten of apparaten zoals Chromebooks waar VS Code niet standaard op draait. Ook werkt de websiteversie op de iPad.

Microsoft waarschuwt voor de beperkingen van de tool. Zo heeft die geen eigen debugger en moet de syntaxkleuring volledig native in de browser gebeuren, wat mogelijk niet helemaal goed werkt. Hetzelfde geldt voor zaken als automatische aanvullingen. Microsoft zegt dat VS Code for Web syntaxkleuring heeft voor 'de meeste populaire programmeertalen', net als bracket pair-kleuring. Voor talen zoals HTML en CSS zegt Microsoft dat de ervaring 'bijna identiek' is als op VS voor de desktop. Voor dergelijke bestanden kunnen er ook previews worden getoond, maar voor andere talen niet.

Gebruikers kunnen verschillende themes en key maps instellen. Die kunnen ze ook synchroniseren via de instellingen. Node.js-extensions zijn niet beschikbaar, maar sommige andere extensies zoals afbeeldingenbewerkers wel. De webtool kan ook koppelingen maken met GitHub- en Azure-repo's.

De tool is te gebruiken in browsers die gebruikmaken van de File System Access-api. Die werkt alleen op Edge, Chrome en Opera. Wel kunnen gebruikers in bijvoorbeeld Firefox losse bestanden uploaden in de browser of hele repo's via een link.

Reacties (58)

Dan vind ik dit opensource project mooier: https://github.com/cdr/code-server

Hierbij draai je VSCode in de cloud en kun je er vanaf de browser bij. Heb je wel ondersteuning voor debugging, bash en alle plugins (inclusief NodeJS zolang je die maar bundelt met de docker). Mooie is dat je het via coder in een kubernetes cluster kan draaien, waardoor iedereen (indien je dat zo configureert) lekker veel cores heeft om te compilen.

[Reactie gewijzigd door XiniX88 op 21 oktober 2021 08:13]

Het is ook interessant om te kijken naar: https://github.com/gitpod-io/openvscode-server/ net iets sneller up2date dan code-server

Microsoft heeft voor Codespaces/vscode.dev de hele codebase opnieuw ingericht om te webbased VSCode te laten werken. Terwijl code-server nog hiervoor is opgezet, wat voor de tijd heel indrukwekkend is. Maar de OpenVSCode server van GitPod is direct op de codebase gebouwd van VSCode en gebruikt veel minder aanpassingen om een webversie te bouwen. Uiteindelijk zie je ook dat OpenVSCode sneller geupdate wordt dan code-server.

Ziet er ook gaaf uit, heeft denk ik wel een iets andere doelgroep aangezien er meer infrastructuur voor nodig lijkt te zijn. Als je als gebruiker geen zaken lokaal kan installeren betwijfel ik of je toegang hebt tot een (cloud)server waar je code-server op kan hosten.

Doelgroep zou toch developers zijn denk ik. Die zullen sowieso ergens containers moeten kunnen draaien. Maakt het dus alleen maar makkelijk.

Moeten ? Je zou je verbazen hoeveel mensen nog nooit van docker of kubernetes gehoord hebben of er nog nooit mee in aanraking gekomen zijn.

En daar is in veel gevallen helemaal niks mis mee.

Als die mensen geen developers zijn of de rest van hun leven bij dezelfde werkgever blijven die er geen gebruik van maakt, sure. Als je een beetje competitief wil meekomen, staan containers bij elk techbedrijf (helaas voor die mensen) wel op het menu.

Ik denk dat jij je wellicht teveel op een specifieke type developer aan het richten bent.

Embedded development? Niet alleen zijn er developers die zonder containers werken, sommigen kunnen zelfs zonder OS werken.

Aan de andere kant van het specrum heb je AWS lambda - serverless computing. Dan heb je ook geen Docker of kubernetes nodig. Ja, je kunt Docker gebruiken met AWS lambda, maar dat is nergens voor nodig - het is vooral support voor legacy Docker omgevingen.

Doelgroep zou toch developers zijn denk ik.

Het tweakers artikel hier noemt meer expliciet power users die een krachtige editor kunnen gebruiken. Daarnaast is de groep developers nogal divers. Afhankelijk van welke techstack je in werkt claimt Microsoft dat het al een volledige ervaring kan bieden.

Since VS Code for the Web is running completely within the browser, some experiences will naturally be more constrained, when compared to what you can do in the desktop app. For example, the terminal and debugger are not available, which makes sense since you can't compile, run, and debug a Rust or Go application within the browser sandbox (although emerging technologies like Pyodide and web containers may someday change this).

A bit more nuanced are the code editing, navigation, and browsing experiences, which, on the desktop, are generally powered by language services and compilers that expect a file system, runtime, and compute environment. In the browser, these experiences are powered by language services running fully in the browser (no file system, no runtimes) that provide source code tokenization and syntax colorization, completions, and many single-file operations.

As a result, when in the browser, experiences generally fall into the following categories:

Good: For most programming languages, vscode.dev gives you code syntax colorization, text-based completions, and bracket pair colorization. Using a Tree-sitter syntax tree, we're able to provide additional experiences such as Outline/Go to Symbol and Symbol Search for popular languages such as C/C++, C#, Java, PHP, Rust, and Go.

Better: The TypeScript, JavaScript, and Python experiences are all powered by language services that run natively in the browser. With these programming languages, you'll get the "Good" experience plus rich single file completions, semantic highlighting, syntax errors, and more.

Best: For many "webby" languages, such as JSON, HTML, CSS, and LESS, the coding experience in vscode.dev is nearly identical to the desktop (including Markdown preview!)

Sommige oplossingen draaien gewoon serverless op cloud platformen (AWS Lambda, Azure Functions of Cloud Functions). Dus ook zonder containers. Dus er zijn ook developers die helemaal geen containers moeten draaien.

Ja want je dev rechtstreeks in een container

Uiteraard

De doelgroep van VSCode in het algemeen is iedereen die wel eens bestanden met code moet aanpassen of lezen. Developers zijn daar een strikte deelverzameling van.

Op zich leuk, want "gratis", maar er is al een license voor Azure voor een paar euries (3,46) per maand met een Windows of Linux machine, daar kan je best vs code op installeren zonder speciale extra code en je hebt de real deal..

Leuke aanvulling, ik vraag me af in hoeverre dit een gevolg is van vscode die je tegenwoordig bij github kan gebruiken via de browser. Als je namelijk op een github repository op . klikt krijg je ook vscode voorgeschoteld met daarin de code van de repository.

Leuke aanvulling, ik vraag me af in hoeverre dit een gevolg is van vscode die je tegenwoordig bij github kan gebruiken via de browser.

Het is er geen "gevolg" van.

Het is een gevolg van Visual Studio Codespaces, net als GitHub Codespaces dat is.

Voor anderen die dat niet wisten en op zoek waren naar een knop op de site: de punt op je toetsenbord.

Ik gebruik al maanden, zoniet jaren, deze container voor on-the-fly coding.

https://github.com/cdr/code-server

Iemand die dit dus zelf kan hosten heeft daar eenzelfde oplossing in. En deze ondersteund wel de verschillende extensies, dus een beetje gek dat Microsoft dat zelf niet voor elkaar heeft gekregen.

Ik denk niet dat het een kwestie is van niet kunnen betreffende de extensies. Code-server richt zich er op een complete ervaring te bieden voor een enkele gebruiker. Dit zie je ook terug in de minimale requirements:

• 1 GB of RAM
• 2 CPU cores

Dit product van microsoft lijkt zich meer te richten op lichter gebruik voor een bredere groep personen waarbij het meeste niet op de hosted machine gebeurt maar in de browser.

De blog post noemt het ook expliciet

Extensions that run Node.js code that use OS-specific modules, or shell out to local executables, still show in search results, but are clearly marked as unavailable.

Dus hoewel de producten heel veel op elkaar lijken geven ze beiden op een andere manier invulling aan de implementatie met zo te zien ook iets andere doeleinden.

Neemt niet weg dat code-server er best gaaf uit ziet en ik er straks even mee ga spelen

[Reactie gewijzigd door Creesch op 21 oktober 2021 08:35]

Als ik mij niet vergist is code-server gebaseerd op de opensource versie, wat betekent dat niet iedere extensie werkt en features als Marketplace/SSH/sync niets doen helaas. Dat is voor mij weer een reden geweest om toch VSCode te gebruiken en niet de opensource variant. Dat is wel iets om rekening mee te houden als je daar gebruik van maakt en waarom deze dan weer interessant is.

[Reactie gewijzigd door foxgamer2019 op 21 oktober 2021 16:47]

Tevens moet je MS vertrouwen dat hun webversie geen data logt.

Tuurlijk doen ze dat wel, dat zal niet anders zijn dan de normale visual studio code.

Begrijp ik het nou goed dat je geen code kunt runnen in de webeditor? In de Run and Debug-tab lees ik dat ik op het web geen code kan draaien. Verder is het me nog niet helemaal duidelijk of ik npm-packages kan installeren. In Stackblitz kan beide wel, overigens (heerlijke tool).

Een veelgehoorde stelling: VS Code is een editor, geen IDE.

Die is in deze context dan waar. Code editors worden ook voor veel meer gebruikt dan alleen applicatie-ontwikkeling.

Zelf gebruik ik VS Code voor het configureren van infrastructuur en configuratie-management. Infra-as-code en configuratie ook allemaal
onder versiebeheer met git.

Een veelgehoorde stelling: VS Code is een editor, geen IDE.

Mijn stelling: VS Code bevestigd dat vrijwel iedere grens vroeg of laat arbitrair is.

VS Code is geen IDE zoals VS dat is, met alle functionaliteit beschikbaar vanuit dezelfde binaire klont, monolitisch geïnstalleerd en zo weinig mogelijk mogelijkheden om dezelfde functionaliteit buiten de IDE om te gebruiken. Maar dichter bij een IDE volgens de Unix-gedachte kom je niet, alle functionaliteit kan toegevoegd worden middels extensies en externe programma's, maar die functionaliteit is ook buiten VS Code om beschikbaar (denk aan Git, diffs, compiler, language server etc).

VS is ook volledig uitbreidbaar net zoals VS code als je het vinkje (VS Extensions) daarvoor aanzet tijdens de installatie.
VS heeft alleen al zoveel zaken aan boord dat er weinig extra's voor nodig is, en voor de meeste (niet professionele?) mensen is de community editie voldoende om te hobbyen.

[Reactie gewijzigd door Alfa1970 op 21 oktober 2021 10:53]

VS heeft alleen al zoveel zaken aan boord dat er weinig extra's voor nodig is,

En andersom; als je TFVC wilt (of meer realistisch: moet) gebruiken heb je weinig keus anders dan Visual Studio gebruiken. Het is een heel monolithisch en gesloten ontwerp. VSCode is een veel dynamischer (moudlairer?) en open ontwerp.

Ik snap je persistence niet over het monolitische ontwerp van VS. VS is wel degelijk modulair van opzet.
Bij VS worden veel modules alleen by default geinstalleerd als je niks aan de setup verandert.
Heb je al eens gekeken naar de tientallen opties die je kunt aan en uitzetten tijdens de installatie?
Zet je dingen daarvan uit dan wordt het niet gedownload en wordt het ook niet geinstalleerd.
Hoe had je dat gedacht in een monolitische opzet?
Ja, VS is uitgebreider dan VSCode (het dient ook een andere doelgroep) maar het is daarom niet minder modulair van opzet.

Microsoft heeft alles dat nodig is om software te ontwikkelen in hetzelfde pakket gestopt. Tijdens installatie kun je heel veel aan en uitzetten, maar dat verandert het product toch niet? Slechts de installatie.

Git is bijvoorbeeld geen onderdeel van VSCode, maar VS gebruikt wel zijn eigen implementatie. VScode ondersteund het gebruik ervan zonder het zelf mee te leveren.

Niets in VS houdt je tegen om andere modules te installeren dan degene die Microsoft heeft gemaakt, hoe is dat verschillend van VSCode dan?
Je kan in VS ook prima je eigen Git module installeren als je die van Microsoft niet wilt hebben ("git.enabled" = false en installeer je eigen module).

Dat Microsoft je een bepaalde standaard ervaring wil geven en veel modules standaard meegeeft is in mijn ogen alleen maar een plus.

En nee, dat verandert het product niet, net zoals het wel of niet installeren van modules in VSCode het product niet verandert.

Maar het is niet zo dat VS monolitisch is omdat er veel modules standaard worden mee geleverd.
Het is slechts een ander product met een ander doel, maar niet meer of minder modulair dan het kleine broertje.

Dat Microsoft je een bepaalde standaard ervaring wil geven en veel modules standaard meegeeft is in mijn ogen alleen maar een plus.

Nu begrijp ik je reactie.

Je houdt van Microsoft en alle producten die ze maken en bent bang dat alles dat iemand zegt alleen maar bedoeld is om Microsoft te bashen. Het spijt me dat ik de indruk heb gewekt een waardeoordeel uit te spreken over de strategieen van VS en VS Code, ik zeg alleen dat ze totaal verschillend zijn.

Microsoft mag blij zijn met zo'n loyale fan klant!

Dat klopt, ik heb het net even geprobeerd, op een lokaal testprojectje en krijg de melding:
"Run and Debug are not available in the web editor. To run and debug, you wil need to continue in an environment that can run code, like codespace or local VS Code."
.
Ik heb vervolgens ingelogd met mn GitHub account, maar dan nog de zelfde melding.
Weet iemand hoe je 'codespace' aan de praat krijgt?
.
Ik zie ook niet zo de toegevoegde waarde van VS Code in de browser,
want juist dit programma werkt perfect op elke laptop en op elk serieus OS.
Of mis ik wat?

Heel tof. Ik wilde eerste enthousiast melden dat ik nu ook op mijn iPad kan ontwikkelen, maar Webkit is niet ondersteund. Jammer, maar begrijpelijk.

Je kan code-server draaien als Docker container en dan met je iPad ontwikkelen in de browser.

Leuke toevoeging, vooral ook handig om on-the-go of op een iPad een snelle edit te kunnen doen.

Ik ben geen coder, maar dit is geweldig voor mensen die hun 3d printer willen voorzien van een nieuwere versie van Marlin firmware. Nu hoeven ze niet meer een programma te installeren, voor een vaak maar eenmalige keer update van firmware.

Lijkt mij logisch. Als er al een photo-editor in de browser bestaat, met functionaliteiten als The Gimp en Photoshop, dan kan een code-editor toch ook volledig in de browseR.

VS code heeft als losse app ook al problemen met syntaxkleuring. Dat is zo traag soms bij het openen van een nieuw bestand. Terwijl sublimetext dit gewoon instant doet.

Heb ik geen last van... Zelfs met bestanden met 3000+ loc.

Wellicht dat de FileSystem API nu wat aandacht gaat krijgen voor hopelijk een officieele spec. De huidige variant is... niet geweldig aangezien je voor lezen en schrijven individueel toestemming moet geven als gebruiker. Hoogst irritant.