DEV Community

Cover image for WebAssembly in my Browser Desktop Environment
Dustin Brett
Dustin Brett

Posted on • Originally published at wasm.builders

WebAssembly in my Browser Desktop Environment

For over a year now I've been working on daedalOS, my desktop environment in the browser. At the start of 2022 I published the app as my website for everyone to play with.

Website: dustinbrett.com
Source Code: daedalOS

For the WebAssembly audience I wanted to discuss the many features I've integrated into my desktop environment which use WebAssembly. Here is a list in no particular order:

x86 Emulation via v86

I support dragging .iso & .img files into the app which can be ran on v86. It also comes loaded with Kolibri and Linux. When an app is closed a snapshot of the current state is saved to /Users/Public/Snapshots which is automatically loaded the next time the same image is opened.

V86 running Kolibri

DOS Emulation via js-dos

For this app you can open any .zip or .jsdos file in it. If you don't provide a jsdos config file it will boot to the command prompt. I have some preloaded DOS shareware games such as Doom and Duke Nukem 3D. Like v86 it will save snapshots on close and reload them on reopen, but instead of loading the emulator state it just loads the directory contents such as save games.

JS-DOS running Duke Nukem 3D

WINE (16/32-bit) via Boxedwine

This also supports .zip files and will try and run .exe too. It can run various apps as BoxedWine shows on their Apps and Games page. As an example I downloaded the latest 32-bit x86 Portable (zip) version of Notepad++, shown below.

BoxedWine running Notepad++

Flash Emulation via Ruffle

This app supports .swf and .spl files. I have a few fun demos on my site such as the Badger Badger Badger and Windows RG (Really Good Edition).

Ruffle running Badger

7z/RAR/TAR Extraction via Libarchivejs

I support .zip & .iso mounting through non-WebAssembly methods, so to handle .7z, .rar, .tar & .tar.gz I've added Libarchive.js. Extracting is done from the right click context menu on each file.

Files extracted via Libarchive.js

Audio/Video Conversion via ffmpeg.wasm

Currently only supporting single thread because of the SharedArrayBuffer limitation and my desire to not deal with CORS issues. For video you can convert .avi, .flv, .m4v, .mov, .mp4, .mpeg, .ogv, .webm & .wmv. For audio it supports converting .aac, .aiff, .ape, .flac, .m4a, .mp3, .oga, .ogg .wav & .wma. These conversion options can be access via the context menu on each file.

File converted from MP4 to MKV

Image Conversion via WASM-ImageMagick

Similar to audio/video, I support various formats of images that can be converted. They are .bmp, .gif, .ico, .jpg, .png, .psd, .tiff & .xcf.

File converted from JPG to PNG

Python via Pyodide

I've added support to run .py scripts in the terminal. It's also possible to open the Terminal directly and run a command such as py import sys; sys.version to see the same result as this example script.

Running a Python script

WASI Modules via Wasmer JS

I've added limited support to run wapm.io directly from the Terminal. Examples of commands that work well are wapm cowsay {Text} and wapm uuid.

Running wapm commands in Terminal

Space Cadet via SpaceCadetPinball

Finally for a blast from the past I've added 3D Pinball Space Cadet which has been ported to many platforms including to WebAssembly.

Playing Space Cadet

The Future...

Thanks for checking out my post/app!!! If you'd like to follow my progress as I continue to play with all things web/dev, please check out my YouTube channel. Here is my latest video where I discuss progress on this app:

Top comments (1)

Collapse
 
dustinbrett profile image
Dustin Brett

Did a video demo of everything on this list tonight, for anyone interested. :-)