4 ms·

Hi all- CEO of StackBlitz/author of this blog post here. Happy to answer any questions! (Also, thanks for posting this bpierre!)

simonw 5y ago
Is this all open source? I'm fascinated in learning more about how you run a web server with this - the article says "WebContainers include a virtualized TCP network stack that's mapped to your browser's ServiceWorker API" but I'd love to understand a bit more about how that works. Since this is all done with WebAssembly are you planning on targeting other stacks such as Python? The amount of time I lose helping other people getting their Python development environments to work remains horrifying.
- ericmsimons 5y ago
  We'll be open sourcing core parts of WebContainer as we move towards GA. We have some additional technical info in our core WG repo: https://github.com/stackblitz/webcontainer-core https://github.com/stackblitz/webcontainer-core We also did an hour long podcast a few months back that goes into pretty deep detail: https://www.youtube.com/watch?v=5F9qH-ea5Qk https://www.youtube.com/watch?v=5F9qH-ea5Qk
bpierre 5y ago
You’re welcome :) Any plan to work towards supporting Firefox & other browsers?
- ob1gman 5y ago
  Yes definitely! Firefox compatibility is close to done and will ship soon. Waiting on Safari to ship some additional features. They don’t share timelines so it’s unclear at this point.
  - bpierre 5y ago
    That’s great to hear! Looking forward to it.
waheoo 5y ago
That isn't a blog post. That's an ad. Can you link to the blog post where you actually discuss literally any of the technical stack in any depth further than one sentence of wow more pizzaz much fast.
skybrian 5y ago
Could you point us to an introduction to how operating system concepts get mapped to browser concepts? It sounds like each native binary gets compiled to a WebAssembly binary, but how do they communicate? How are the network and file system implemented? Are parts of the file system persistent? How does a system call work?
- ericmsimons 5y ago
  Great questions- we have some additional technical info in our core WG repo: https://github.com/stackblitz/webcontainer-core https://github.com/stackblitz/webcontainer-core We also did an hour long podcast a few months back that goes into pretty deep detail: https://www.youtube.com/watch?v=5F9qH-ea5Qk https://www.youtube.com/watch?v=5F9qH-ea5Qk
yuri91 5y ago
Is node/v8 compiled to Wasm entirely, or are you using the browser's JS engine with polyfills for node's APIs? Or something in between?
stephenbuilds 5y ago
First, congratulations! This is an astonishing advancement. I found this on the GH repo: "Is this open source? Today no, but the API will be open source to developers at GA." I'm confused by what "the API" is, exactly. Is WebContainers a technology you plan to make available for others to use node, in the browser, in their own apps?
- nailer 5y ago
  > "Is this open source? Today no, but the API will be open source to developers at GA." If they make it Open Source, Microsoft will add it to VScode and eat their lunch. If they don't, developers might be afraid of lock in. Best exit for them is to just grow users and not make a decision either way until they get acquired by Github (aka Microsoft) and folded into VScode.
  - crazypython 5y ago
    > If they make it Open Source, Microsoft will add it to VScode and eat their lunch. Put the code under the GPL so no one can use it to build proprietary software. Visual Studio Code contains proprietary components, so this would prevent that.
apignotti 5y ago
Hi, CTO of LeaningTech here. Congratulations for the highly polished demo. I think you might find interesting this one we did months ago: https://repl.leaningtech.com/?nodejs https://repl.leaningtech.com/?nodejs
bouh 5y ago
hey very nice work ! do you think that a docker.js running containers in the browser is something that could become a reality soon if we follow you line of work ?
drew-y 5y ago
Can you expand on the capabilities of the terminal? What sort of operations can be done from the terminal? It looks like the shell is JSH. Is this an in house shell? Is there any more information on it?
worik 5y ago
Why do this at all? With all the security and design problems of Node.js, when there are actually secure and reliable ways (harder ways, yes. Security and reliability are hard) to do all of this. Why?
miohtama 5y ago
How much of this is JavaScript specific and how much could be expanded to “any” programming language?
Galaco 5y ago
> Faster than your local environment. Builds complete up to 20% faster and package installs complete >= 5x faster than yarn/npm. Above is a quote from the post. I feel like this is a stupid question, but how can running yarn/npm in a browser on my machine be faster than running yarn/npm on my machine? Particularly when each page load runs a fresh npm/yarn install? Nonetheless, this is a incredible piece of software that i'll be following closely
- altano 5y ago
  I was wondering the same thing
- grassthehopper 5y ago
  I'm also curious about this
- giorgioz 5y ago
  I've also asked myself this question. I think the comparison is not with a local environment but rather with running node/yarn/npm on a remote virtual machine/ci. This is my hypothesis, I have no proof that's what they meant.
  - dspillett 5y ago
    I'm wondering if there is more happening in-memory, even if the project files and modules themselves are on-disk (accessed via FileSystemAPI) the vscode/node/other bits including temporary files may be held in RAM once initially loaded and never swapped out. If that is the reason, then if your machine becomes memory constrained, the performance will drop through the floor quicker than with full-local installs. It could be a mix of this and your suggestion (lower network latency related bottlenecks than experienced with non-local deployment).
supermatt 5y ago
You mention being able to use the debugger. How do I do this? The docs are very poor. I dont see any way to set breakpoints. When i use a debugger statement and open inspector it breaks on transpiled/packaged code (its different to the actual file). This is a deal breaker for me at present. Am I doing something wrong? (Using the http server template)
imvetri 5y ago
Hi, Can you share how it is working under the hood ?
Scottttttt 5y ago
This pretty cool stuff. I am wondering about another use case for this type of thing. We have a CLI tool built with node.js, could we build one of these containers with with the CLI tool setup and expose just a terminal with access to the local file system?

simonw 5y ago

Is this all open source? I'm fascinated in learning more about how you run a web server with this - the article says "WebContainers include a virtualized TCP network stack that's mapped to your browser's ServiceWorker API" but I'd love to understand a bit more about how that works. Since this is all done with WebAssembly are you planning on targeting other stacks such as Python? The amount of time I lose helping other people getting their Python development environments to work remains horrifying.

ericmsimons 5y ago
We'll be open sourcing core parts of WebContainer as we move towards GA. We have some additional technical info in our core WG repo: https://github.com/stackblitz/webcontainer-core https://github.com/stackblitz/webcontainer-core We also did an hour long podcast a few months back that goes into pretty deep detail: https://www.youtube.com/watch?v=5F9qH-ea5Qk https://www.youtube.com/watch?v=5F9qH-ea5Qk

bpierre 5y ago

You’re welcome :) Any plan to work towards supporting Firefox & other browsers?

ob1gman 5y ago
Yes definitely! Firefox compatibility is close to done and will ship soon. Waiting on Safari to ship some additional features. They don’t share timelines so it’s unclear at this point.
- bpierre 5y ago
  That’s great to hear! Looking forward to it.

waheoo 5y ago

That isn't a blog post. That's an ad. Can you link to the blog post where you actually discuss literally any of the technical stack in any depth further than one sentence of wow more pizzaz much fast.

skybrian 5y ago

Could you point us to an introduction to how operating system concepts get mapped to browser concepts? It sounds like each native binary gets compiled to a WebAssembly binary, but how do they communicate? How are the network and file system implemented? Are parts of the file system persistent? How does a system call work?

ericmsimons 5y ago
Great questions- we have some additional technical info in our core WG repo: https://github.com/stackblitz/webcontainer-core https://github.com/stackblitz/webcontainer-core We also did an hour long podcast a few months back that goes into pretty deep detail: https://www.youtube.com/watch?v=5F9qH-ea5Qk https://www.youtube.com/watch?v=5F9qH-ea5Qk

yuri91 5y ago

Is node/v8 compiled to Wasm entirely, or are you using the browser's JS engine with polyfills for node's APIs? Or something in between?

stephenbuilds 5y ago

First, congratulations! This is an astonishing advancement. I found this on the GH repo: "Is this open source? Today no, but the API will be open source to developers at GA." I'm confused by what "the API" is, exactly. Is WebContainers a technology you plan to make available for others to use node, in the browser, in their own apps?

nailer 5y ago
> "Is this open source? Today no, but the API will be open source to developers at GA." If they make it Open Source, Microsoft will add it to VScode and eat their lunch. If they don't, developers might be afraid of lock in. Best exit for them is to just grow users and not make a decision either way until they get acquired by Github (aka Microsoft) and folded into VScode.
- crazypython 5y ago
  > If they make it Open Source, Microsoft will add it to VScode and eat their lunch. Put the code under the GPL so no one can use it to build proprietary software. Visual Studio Code contains proprietary components, so this would prevent that.

apignotti 5y ago

Hi, CTO of LeaningTech here. Congratulations for the highly polished demo. I think you might find interesting this one we did months ago: https://repl.leaningtech.com/?nodejs https://repl.leaningtech.com/?nodejs

bouh 5y ago

hey very nice work ! do you think that a docker.js running containers in the browser is something that could become a reality soon if we follow you line of work ?

drew-y 5y ago

Can you expand on the capabilities of the terminal? What sort of operations can be done from the terminal? It looks like the shell is JSH. Is this an in house shell? Is there any more information on it?

worik 5y ago

Why do this at all? With all the security and design problems of Node.js, when there are actually secure and reliable ways (harder ways, yes. Security and reliability are hard) to do all of this. Why?

miohtama 5y ago

How much of this is JavaScript specific and how much could be expanded to “any” programming language?

Galaco 5y ago

> Faster than your local environment. Builds complete up to 20% faster and package installs complete >= 5x faster than yarn/npm. Above is a quote from the post. I feel like this is a stupid question, but how can running yarn/npm in a browser on my machine be faster than running yarn/npm on my machine? Particularly when each page load runs a fresh npm/yarn install? Nonetheless, this is a incredible piece of software that i'll be following closely

altano 5y ago
I was wondering the same thing
grassthehopper 5y ago
I'm also curious about this
giorgioz 5y ago
I've also asked myself this question. I think the comparison is not with a local environment but rather with running node/yarn/npm on a remote virtual machine/ci. This is my hypothesis, I have no proof that's what they meant.
- dspillett 5y ago
  I'm wondering if there is more happening in-memory, even if the project files and modules themselves are on-disk (accessed via FileSystemAPI) the vscode/node/other bits including temporary files may be held in RAM once initially loaded and never swapped out. If that is the reason, then if your machine becomes memory constrained, the performance will drop through the floor quicker than with full-local installs. It could be a mix of this and your suggestion (lower network latency related bottlenecks than experienced with non-local deployment).

supermatt 5y ago

You mention being able to use the debugger. How do I do this? The docs are very poor. I dont see any way to set breakpoints. When i use a debugger statement and open inspector it breaks on transpiled/packaged code (its different to the actual file). This is a deal breaker for me at present. Am I doing something wrong? (Using the http server template)

imvetri 5y ago

Hi, Can you share how it is working under the hood ?

Scottttttt 5y ago

This pretty cool stuff. I am wondering about another use case for this type of thing. We have a CLI tool built with node.js, could we build one of these containers with with the CLI tool setup and expose just a terminal with access to the local file system?