WebAssembly in my Browser Desktop Environment
Tags: webassembly, webdev, javascript, programming
Published: 2022-03-28 16:22:01

For over a year now I've been working on [daedalOS](https://github.com/DustinBrett/daedalOS), my desktop environment in the browser. At the start of 2022 I published the app as [my website](https://dustinbrett.com/) for everyone to play with.

Website: [dustinbrett.com](https://dustinbrett.com/)
Source Code: [daedalOS](https://github.com/DustinBrett/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](https://github.com/copy/v86)

I support dragging `.iso` & `.img` files into the app which can be ran on v86. It also comes loaded with [Kolibri](https://dustinbrett.com/?url=/Users/Public/Documents/Disk%20Images/kolibri.img) and [Linux](https://dustinbrett.com/?app=V86&url=/Users/Public/Documents/Disk%20Images/linux4.iso). 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](https://www.wasm.builders/remoteimages/uploads/articles/zuvx2f2t43fuqr6pba6j.png)

## DOS Emulation via [js-dos](https://github.com/caiiiycuk/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](https://dustinbrett.com/?url=/Users/Public/Documents/DOS%20Bundles/doom.jsdos) and [Duke Nukem 3D](https://dustinbrett.com/?url=/Users/Public/Documents/DOS%20Bundles/dn3d.jsdos). 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](https://www.wasm.builders/remoteimages/uploads/articles/t1x4tiuaofod9z6qm5n9.png)

## WINE (16/32-bit) via [Boxedwine](https://github.com/danoon2/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](http://www.boxedwine.org/search-apps/?_sft_feature=demo) page. As an example I downloaded the latest `32-bit x86 Portable (zip)` version of [Notepad++](https://notepad-plus-plus.org/downloads/), shown below.

![BoxedWine running Notepad++](https://www.wasm.builders/remoteimages/uploads/articles/foz48d6eku4fewi36gna.png)
 
## Flash Emulation via [Ruffle](https://github.com/ruffle-rs/ruffle)

This app supports `.swf` and `.spl` files. I have a few fun demos on my site such as the [Badger Badger Badger](https://dustinbrett.com/?url=/Users/Public/Documents/Flash%20Files/badger.swf) and [Windows RG (Really Good Edition)](https://dustinbrett.com/?url=/Users/Public/Documents/Flash%20Files/Windows%20RG%20Build%20207.swf).

![Ruffle running Badger](https://www.wasm.builders/remoteimages/uploads/articles/opl8h3ulhtfv6niw4lch.png)
 
## 7z/RAR/TAR Extraction via [Libarchivejs](https://github.com/nika-begiashvili/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](https://www.wasm.builders/remoteimages/uploads/articles/x82537apn7bkhx01qgfl.png)
 
## Audio/Video Conversion via [ffmpeg.wasm](https://github.com/ffmpegwasm/ffmpeg.wasm)

Currently only supporting single thread because of the [SharedArrayBuffer limitation](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/SharedArrayBuffer#security_requirements) 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](https://www.wasm.builders/remoteimages/uploads/articles/5xkk8cvi77pdnrvwtd5a.png)

## Image Conversion via [WASM-ImageMagick](https://github.com/KnicKnic/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](https://www.wasm.builders/remoteimages/uploads/articles/3kvmgcsy3zcmoz6oqj0w.png)

## Python via [Pyodide](https://github.com/pyodide/pyodide)

I've added support to run `.py` scripts in the terminal. It's also possible to open the [Terminal](https://dustinbrett.com/?app=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](https://www.wasm.builders/remoteimages/uploads/articles/4e3qi3pe1azvalzykc5l.png)

## WASI Modules via [Wasmer JS](https://github.com/wasmerio/wasmer-js)

I've added limited support to run [wapm.io](https://wapm.io/) directly from the [Terminal](https://dustinbrett.com/?app=Terminal). Examples of commands that work well are `wapm cowsay {Text}` and `wapm uuid`.

![Running wapm commands in Terminal](https://www.wasm.builders/remoteimages/uploads/articles/nqs09d4l7qhk372zyzzm.png)

## Space Cadet via [SpaceCadetPinball](https://github.com/k4zmu2a/SpaceCadetPinball)

Finally for a blast from the past I've added [3D Pinball Space Cadet](https://dustinbrett.com/?app=SpaceCadet) which has been ported to many platforms including to WebAssembly.

![Playing Space Cadet](https://www.wasm.builders/remoteimages/uploads/articles/n75f0uvah78q63lmc2qq.png)

## 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](https://www.youtube.com/c/DustinBrett/videos), please check out my [YouTube channel](https://www.youtube.com/c/DustinBrett). Here is my latest video where I discuss progress on this app:

{% youtube Jj18hV82FeI %}