I built a 21KB TypeScript-only frontend framework — here’s a real-time multiplayer game demo: Splendor

I built a 21KB TypeScript-only frontend framework — here’s a real-time multiplayer game demo: Splendor

Before any theory or claims, here’s a real demo:

I rebuilt the classic board game Splendor as a real-time multiplayer web app (2–4 players): https://splendor.ezh.dev

Rules are explained inside the game. There’s also a link to the source repository hidden in the description.

What is this?

This demo is built with Ezh, a frontend framework I’ve been working on, focused on:

  • Very small runtime (21KB minified)
  • Extreme runtime performance
  • Minimal API surface
  • TypeScript-only development

The goal was to see how far you can push performance and simplicity if you drop Virtual DOM diffing and design everything around fine-grained updates instead.

Some concrete numbers

  • Core implementation: ~2,500 lines of TypeScript
  • Runtime bundle: 21KB (min.js)
  • Public APIs: 11 total
  • Learning curve: very short (the demo source is meant to be readable without docs)

The Splendor game UI is fairly complex, but the entire game page is implemented in ~800 lines of code.

Here’s also a tiny interactive example (~40 lines) for a quick “read-it-once” overview:

Article content
Article content

Design highlights

  • TypeScript only No JavaScript mode. Every element and component is fully typed. Attribute typos are caught at compile time.
  • TSX-first Syntax is TSX, intentionally close to what React users are familiar with.
  • O(1) DOM updates, no Virtual DOM Updates are driven by field-level dependencies. A single field change triggers only the minimal necessary DOM updates.
  • Optional delayed disposal Recently unmounted DOM subtrees can be retained briefly and reused, avoiding expensive rebuilds when users switch views quickly.
  • Batteries included, still small Routing, state management, and lifecycle control are built-in, all within the same small runtime.

Status

The npm package (ezh) is already usable. The demo source code is currently the best learning resource — about an hour is enough to get started:

https://github.com/foreverflying/ezh-demo

The core framework source will be open-sourced (planned, but not yet published).

Why I’m posting

I’m mainly looking for technical feedback:

  • Does the update model make sense?
  • Are there obvious edge cases I should test?
  • Is TS-only a reasonable constraint in practice?

Happy to answer any questions, and I’m very open to criticism.

To view or add a comment, sign in

More articles by Andy Deng

Others also viewed

Explore content categories