[SF Ruby, March 2024] Rails on Wasm

by Vladimir Dementyev

Slide 1

Slide 1 text

Welcome to the future? RAILS ON WASM Vladimir Dementyev Evil Martians SF Ruby Meetup March 2024

Slide 2

Slide 2 text

Ruby on Rails A web-app framework that includes everything needed to create database- backed web applications

Slide 3

Slide 3 text

Ruby on Rails A web-app framework that includes everything needed to create database- backed web applications WebAssembly (Wasm) A binary instruction format for a stack- based virtual machine

Slide 4

Slide 4 text

Ruby on Rails A web-app framework that includes everything needed to create database- backed web applications WebAssembly (Wasm) A binary instruction format for a stack- based virtual machine 🤔

Slide 5

Slide 5 text

Slide 6

Slide 6 text

3 WebAssembly, often shortened to Wasm, is a cutting-edge tech that lets you run code super fast in your web browser, almost as if it was running directly on your computer’s hardware. The cool part? It’s not just for one programming language. You can write your stuff in languages like C, C++, Rust, or even Python, then compile it into WASM, and boom, it runs in the web browser. Why it's a big deal: • Speed: It's blazing fast, making it perfect for heavy-duty tasks like games or complex simulations right in your browser. • Versatility: Supports multiple languages, so you're not stuck with JavaScript for web development. • Safety: Runs in a sandbox environment in your browser, keeping things secure. • Ef fi ciency: With its compact binary format, it's quick to load and execute. In short, Wasm is pushing the boundaries of what's possible on the web, making it a game-changer for developers and users alike.

Slide 7

Slide 7 text

Slide 8

Slide 8 text

Wasm • Performance • Portability • Safety Pushing the boundaries

Slide 9

Slide 9 text

Wasm in a nutshell .c .rs .js .rb .py x86 ARM machine code machine code Wasm runtime (VM)

Slide 10

Slide 10 text

Wasm runtimes

Slide 11

Slide 11 text

Wasm runtimes • WebAssembly (browser)

Slide 12

Slide 12 text

Wasm runtimes • WebAssembly (browser) • Wasmtime

Slide 13

Slide 13 text

Wasm runtimes • WebAssembly (browser) • Wasmtime • Wasmer

Slide 14

Slide 14 text

Wasm runtimes • WebAssembly (browser) • Wasmtime • Wasmer • Wasmedge

Slide 15

Slide 15 text

Wasm runtimes • WebAssembly (browser) • Wasmtime • Wasmer • Wasmedge • Wazero

Slide 16

Slide 16 text

Wasm runtimes • WebAssembly (browser) • Wasmtime • Wasmer • Wasmedge • Wazero

Slide 17

Slide 17 text

Wasm runtimes • WebAssembly (browser) • Wasmtime • Wasmer • Wasmedge • Wazero

Slide 18

Slide 18 text

Slide 19

Slide 19 text

Slide 20

Slide 20 text

RUBY ON WASM

Slide 21

Slide 21 text

Ruby on Wasm • Browser-based interactive playgrounds • Edge/serverless computing • Embedded scripting engine for platforms/applications • Portable Ruby libraries/applications (prism.wasm*) What's the point?

Slide 22

Slide 22 text

Playgrounds 🛝 • try.ruby-lang.org • RunRuby.dev • ruby-next.github.io • mame.github.io/emirb

Slide 23

Slide 23 text

No content

Slide 24

Slide 24 text

No content

Slide 25

Slide 25 text

Learn Ruby 🎓 • koans.idogawa.com — Ruby Koans • Ruby Warrior 🥷

Slide 26

Slide 26 text

No content

Slide 27

Slide 27 text

DEMO TIME

Slide 28

Slide 28 text

ruby.wasm demo • Let's bring Coltrane online! • Get our hands dirty with ruby.wasm and rbwasm build • Face the limitations of Ruby on Wasm github.com/pedrozath/coltrane 🎷

Slide 29

Slide 29 text

Slide 30

Slide 30 text

RAILS ON WASM

Slide 31

Slide 31 text

Rails on Wasm • (Many) Dependencies with C extensions (nokogiri 😈) Rails != Ruby

Slide 32

Slide 32 text

Rails on Wasm • (Many) Dependencies with C extensions (nokogiri 😈) • Databases (Active Record) Rails != Ruby

Slide 33

Slide 33 text

Rails on Wasm • (Many) Dependencies with C extensions (nokogiri 😈) • Databases (Active Record) • HTTP server Rails != Ruby

Slide 34

Slide 34 text

Rails on Wasm • Threads and outgoing HTTP Rails != Ruby

Slide 35

Slide 35 text

Rails on Wasm • Threads and outgoing HTTP • Assets and uploads (Active Storage) Rails != Ruby

Slide 36

Slide 36 text

Rails on Wasm • Threads and outgoing HTTP • Assets and uploads (Active Storage) • Background jobs Rails != Ruby

Slide 37

Slide 37 text

Rails on Wasm • Threads and outgoing HTTP • Assets and uploads (Active Storage) • Background jobs • Real-time (Action Cable) Rails != Ruby

Slide 38

Slide 38 text

DEMO TIME

Slide 39

Slide 39 text

Rails on Wasm: Databases

Slide 40

Slide 40 text

Rails on Wasm: Databases • SQLite3 and PostgreSQL (pglite) available in Wasm

Slide 41

Slide 41 text

Rails on Wasm: Databases • SQLite3 and PostgreSQL (pglite) available in Wasm • Persistence via OPFS (future) or Indexeddb (legacy)

Slide 42

Slide 42 text

Rails on Wasm: Databases • SQLite3 and PostgreSQL (pglite) available in Wasm • Persistence via OPFS (future) or Indexeddb (legacy) • Not targeting browsers? Kein Problem!

Slide 43

Slide 43 text

Rails on Wasm: HTTP Server • ServiceWorker for browsers

Slide 44

Slide 44 text

Rails on Wasm: HTTP Server • ServiceWorker for browsers • Simple HTTP proxy for other runtimes

Slide 45

Slide 45 text

Rails on Wasm: HTTP Server • ServiceWorker for browsers • Simple HTTP proxy for other runtimes • wasi:http/proxy for plug-n-play DX in the future

Slide 46

Slide 46 text

Rails on Wasm: Background Jobs • We can run Postgres on Wasm—Good Job!

Slide 47

Slide 47 text

Rails on Wasm: Background Jobs • We can run Postgres on Wasm—Good Job! • Separate Worker(-s) + BroadcastChannel

Slide 48

Slide 48 text

Rails on Wasm: HTTP • HTTP via fetch (see Faraday::JS in RubRuby.dev)

Slide 49

Slide 49 text

Rails on Wasm: HTTP • HTTP via fetch (see Faraday::JS in RubRuby.dev) • wasi/http (preview 3) in the future

Slide 50

Slide 50 text

Rails on Wasm: Cables • Long-polling or BroadcastChannel transport

Slide 51

Slide 51 text

Rails on Wasm: Cables • Long-polling or BroadcastChannel transport • AnyCable (multi-player, embedded into Wails)

Slide 52

Slide 52 text

Rails on Wasm What's the case?

Slide 53

Slide 53 text

Rails on Wasm • TLR = Try-Learn-Reproduce What's the case?

Slide 54

Slide 54 text

Slide 55

Slide 55 text

Rails on Wasm • TLR = Try-Learn-Reproduce • Personal/private applications (own your data) What's the case?

Slide 56

Slide 56 text

Rails on Wasm • TLR = Try-Learn-Reproduce • Personal/private applications (own your data) • Local- fi rst desktop apps (e.g., music libraries, notes, Trello-like boards) What's the case?

Slide 57

Slide 57 text

Rails on Wasm • Multi-env apps: same code for web, CLI, etc. What's the case?

Slide 58

Slide 58 text

Rails on Wasm • Multi-env apps: same code for web, CLI, etc. • Offline- fi rst 2.0: fully offline execution, data snapshots and replication What's the case?

Slide 59

Slide 59 text

Rails on What? • JS runtimes (browsers, Node.js, Bun, Deno) • Serverless • Desktop (Tauri, Wails) • CLI (via Wazero/Wasmedge/etc)

Slide 60

Slide 60 text

Rails on Wasm • WASI Components • WASI Preview 2 (HTTP) • More compatible extensions (nokogiri.wasm) What's the future?

Slide 61

Slide 61 text

Rails on Wasm 2013 2017 2019 2022 2024 ??? ??? ??? ??? WebAssembly asm.js SQLite3 WASM Ruby 3.2 WASI support RubRuby.dev Rails on Wasm (SF Ruby Meetup) WASI pglite

Slide 62

Slide 62 text

Rails on Wasm 2013 2017 2019 2022 2024 ??? ??? ??? ??? WebAssembly asm.js SQLite3 WASM Ruby 3.2 WASI support RubRuby.dev Rails on Wasm (SF Ruby Meetup) WASI We are here pglite

Slide 63

Slide 63 text

Rails on Wasm 2013 2017 2019 2022 2024 ??? ??? ??? ??? WebAssembly asm.js SQLite3 WASM Ruby 3.2 WASI support RubRuby.dev Rails on Wasm (SF Ruby Meetup) WASI ruby.wasm WASI Components We are here pglite