WebContainer API
webcontainers.io
webcontainers.io
What WebContainers doesn't do is provide container tech. WebAssembly is similar to a Docker container, so much so that Docker now supports WebAssembly. WebContainers also uses a subdomain and the browser's security model. In fact the browser is the main thing that limits what stuff inside the WebContainer can do in WebAssembly. WebContainer runs whatever JavaScript the WebAssembly code spits out. Like DotCloud one of the great things about WebAssembly is that it can run a wider variety of code performantly than a JavaScript engine can - not just code that can compile to JS but anything that can be compiled to its bytecode. This is what WebContainer takes advantage of - not the sandboxing of a WebContainer, which is also excellent but isn't the right fit for a code sandbox like jsbin/CodePen/CodeSandbox/etc, which needs to be able to run whatever can be run in a browser tab.
What WebContainers does is use some hacks to sort of run node apps in the browser, so instead of using something like the browser version of rollup, you can use something like vite. You can also see the console output that vite would provide.
When vite installs esbuild I think it probably specifies the non-WASM esbuild. So it's likely running patched vite and running WASM esbuild.
It uses a fake npm and yarn and shows npm and yarn in the output. This explained in this FAQ under "Do you support yarn or only npm?": https://github.com/stackblitz/webcontainer-core#faqs
It has an iframe sandbox with same-origin which means in order for it to be contained, you need a subdomain. This is something other major sandboxes do like jsbin and CodeSandbox. This is why IMO it doesn't provide container tech.
That's lucky, because custom container tech on the web winds up being like Google Caja which was a marvelous accomplishment but not nearly as robust as Docker, MicroVMs, WASM, or the browser security model (<iframe sandbox>, CSPs, and more): https://en.wikipedia.org/wiki/Caja_project https://devd.me/papers/LeastPrivileges.pdf
In what sense?
Maybe I'm thinking too much about the implementation, rather than the use cases, but to me, WebAssembly is a VM/execution environment (in the sense of the JVM, not VirtualBox), whereas Docker is a containerization solution (i.e. a way to isolate userspace environments, for both security and dependency management), and decidedly also not a VM at all.
I can see how they can be used for similar goals, in any case: "Run my binary efficiently on your generic computer without having to trust it".
I agree WASM is more similar to the JVM but I think the JVM is pretty similar to a Docker container in a way, if you get rid of all the higher level JVM features like garbage collection, and for docker container look at the whole system and not just docker. If you have a computer with only docker installed it's easy to think of it as docker when it's really docker or containerd running on the Linux distro. Or some MicroVM orchestration.
"WebContainers rely on hosted proxies and server-side acceleration to enable truly instant development environments. By obtaining a WebContainer API license, your business can gain access to higher API rate limits, uptime reliability, and a range of benefits designed to help you maximize the potential of the WebContainer API in your organization."
You could offer self hosting of those and no licensing for commercial products, but you then wouldn't have a financial strategy to develop the technology in the first place. Not quite as much at least.
A big draw is you don't have to give access to a 3rd party all of your code if the technology is client side. Since the server side is just managing/proxying 3rd party dependencies.
All that being said, I'd appreciate a more forthcoming statement of this, as it is confusing, bordering on misleading.
I love the technology though and I do have plans to use it.
Some of these operations can be cacheable which is ideal for scalability, but even the ones that cannot tend to be far cheaper than running VMs which incur by the minute CPU costs.
Our intention is to be fully transparent on the how & why, so I’m happy to answer further questions on all this! I also think it’d be good for us to include something more detailed like your explanation in our docs so that other folks don’t feel similarly confused when reading them- curious if there’s particular points that jump out to you that I can share with our team to include!
I will contact you...
"Licensing is required for production usage of the API in a for-profit setting (feel free to prototype as much as you like without a license). If you're using the API to meet the needs of your customers, prospective customers, and/or employees you need a license to ensure continued access to the API as you scale."
But if you do, then this attempts to solve that problem.
If you're asking what's the use case for running nodejs in the browser? I say use your imagination.
Is it a matter of significantly different system APIs and standard libraries, and this offers a bridge for applications expecting to run in Node, providing that environment in the JavaScript context of a browser? (Or does it actually run Node in WASM?)
The documentation doesn't seem to separate these two, and applying such name for the former would seem intentionally misleading to me, especially if it gets trademarked by commercial entity providing the service.
This is closer to what the Bytecode Alliance is looking to do with WASI, which we're playing a small (but crucial) part in: https://blog.stackblitz.com/posts/bytecode-alliance/
> Does "WebContainer API" mean "proprietary web service for accessing npm and git over http"?
Kinda, we have plans to allow self hosting and more reg open source- more to come!
I was a bit confused when writing my previous comment. I kind of meant client-side vs server-side part, but I see it may be (or should be) both. I'm impressed you answered in person, please let me elaborate.
webcontainers.io/api describes client-side ECMAScript interface (e.g. `WebContainer.boot().spawn('ls', ['src', '-l'])`). The "StackBlitz WebContainers client" is not the only existing in-browser implementation capable of providing such interface. For example, there is "WebVM" from Leaning Technologies, that "runs unmodified Debian binaries in the browser" using "x86-to-WebAssembly JIT compiler" and "Linux syscall emulator". It can run everything from WebContainers examples, like `ls src -l` or `npm run dev`. One could easily make adapter that uses WebVM to implement WebContainer API. This is what I thought "WebContainers API" should encompass.
But as I learned today, WebVM just like WebContainer also requires a web service (Tailscale) for proxying network traffic. Even JSLinux (bellard.org) uses proxy server. That's necessary because there is no "WebNetworking API" exposing local native networking trough the browser. Usage of such service is implementation detail, but including it in the "WebContainers API" standard is right now the only way to make provider-agnostic clients and I did not consider that before. It may become redundant one day if we get "WebNetworking API" for the browser but there's no such ongoing initiative.
Did I get that right now?
Is StackBlitz WebContainers web service going to proxy arbitrary network traffic, or is it about git, package management and other dev-specific protocols?
Is "WebContainers server API" going to also reflect client API methods to give optional support for thin clients and hybrids? (running all or selected commands in remote container rather than only proxying the network)
There are quite a few "static-site generator" templates that are easy to setup and customize and many of them are free to use! If I had to guess, I think they're using VitePress [1] here. Nextra [2] is also good for this kind of a website.
The materials themselves also drip with exaggeration and hand-waving, talking about things like "the legacy cloud VM" (emphasis mine), "unmatched security", "spinning up the entire dev environment in milliseconds"
All of this is aside from the actual technology, which could be cool, I have no idea yet. But it rubbed me the wrong way
The idea is to use the browser as the dev environment, all of it: emulate a file system, run non-JS tools compiled to WASM on top of it, and access networking via the browser, too. For Node-based development, this sounds rather doable.
"WebContainers rely on hosted proxies and server-side acceleration to enable truly instant development environments. By obtaining a WebContainer API license, your business can gain access to higher API rate limits, uptime reliability, and a range of benefits designed to help you maximize the potential of the WebContainer API in your organization.
Licensing is required for production usage of the API in a for-profit setting (feel free to prototype as much as you like without a license). If you're using the API to meet the needs of your customers, prospective customers, and/or employees you need a license to ensure continued access to the API as you scale.
"