This project is an experimental fork of Vim editor by @rhysd to compile it into WebAssembly using emscripten and binaryen.
- Please access from a desktop browser (Chrome/Firefox/Safari/Edge). Safari seems the best on macOS.
- Please avoid slow networks. Your browser will fetch total of around 1MB files.
- vim.wasm takes key inputs from DOM
keydownevent. Please disable your browser extensions which affect key inputs (incognito mode would be the best).
- This project is very early phase of experiment. Currently only tiny features are supported. More features will be implemented (please see TODO section). And you may notice soon on trying it... it's buggy :)
- If inputting something does not change anything, please try to click somewhere in the page. Vim may have lost the focus.
- You can try vimtutor by
The goal of this project is running Vim editor on browser by compiling Vim C sources into WebAssembly.
How It Works
WebAssembly frontend for Vim is implemented as a new GUI frontend. C sources are compiled to each LLVM bitcode files and then they are linked to one bitcode file
emccfinally compiles the
The difference I faced at first was the lack of terminal library such as ncurses. I modified
configurescript to ignore the terminal library check. It's OK since GUI frontend for Wasm is always used instead of CUI frontend. I needed many workarounds to pass
emscripten provides Unix-like environment. So
os_unix.ccan support Wasm. However, some features are not supported by emscripten. I added many
#ifdef FEAT_GUI_WASMguards to disable features which cannot be supported by Wasm (i.e.
fork (2)support, PTY support, signal handlers are stubbed, ...etc).
gui_w32.c. Event loop (
gui_mch_wait_for_chars()) is simply implemented with
C sources are compiled (with many optimizations) into LLVM bitcode with Clang which is integrated to emscripten. Then all bitcode files (
.o) are linked to one bitcode file
llvm-linklinker (also integrated to emscripten).
wasm/runtime.tsusing emscripten API. It draws Vim screen to
<canvas/>element with rendering events such as 'draw text', 'scroll screen', 'set foreground color', 'clear rect', ...etc.
emcc(emscripten's C compiler) compiles the
vim.htmlwith preloaded Vim runtime files (i.e. colorscheme) using binaryen. Runtime files are put on a virtual file system provided by emscripten on a browser.
vim.htmlwith a web server and accessing to it with browser opens Vim. It works.
User interaction is very simple. You input something with keyboard. Browser takes it as
<canvas/>element in the web page.
Finally you can see the rendered results in the page.