What you describe, lowered until it is pixels.
The same descent, twice
// meo-canvas — a scene, not a component await Root({ width: 880, padding: 24, backgroundColor: '#0B0C0E', flexDirection: 'column', gap: 12, children: [ Text('Lowering', { fontSize: 32, color: '#E9E6E0' }), Text('one pass at a time', { fontSize: 13, color: '#8A8F98' }), Row({ gap: 8, children: [Box({ width: 64, height: 26 }), Box({ width: 64, height: 26 })], }), ], })
Two descents. @meonode/ui writes source that @meonode/compiler lowers, and it ends at a React element tree. meo-canvas solves its own scenes with Taffy and meo-skia-canvas paints them on Skia, server-side, with no React anywhere in it. Neither line covers all five depths, and switching between them shows where each one stops.
The stack, as owned
all repositories ↗@meonode/ui
Type-safe React components without JSX: function-based composition, CSS properties as props, context theming and opt-in per-node memoization, with full Server Components support.
@meonode/mui
A lightweight wrapper putting @mui/material components behind MeoNode factories, so an MUI tree composes the way the rest of a @meonode/ui page does.
@meonode/compiler
Experimental SWC plugin (Rust compiled to wasm32-wasip1) that rewrites @meonode/ui call sites at build time so the runtime can skip its own per-render work.
meo-canvas
Turns a declarative scene description into a rendered image, laying it out with CSS flexbox, grid and block rules and drawing it on Skia.
meo-skia-canvas
The HTML Canvas 2D API, off-screen and on-screen, on Skia. Output matches Chrome's <canvas> closely, while doing things the browser's canvas cannot.
Nothing here sits at 02 element and 03 layout. React owns the element tree, and the React line stops there. The image line passes through both (meo-canvas builds a tree and solves it with Taffy), but a package is placed by what it is, not by every step it performs.
Built on it
what the layers are forChu Tao
Multi-service Discord bot across four live-service games (Genshin Impact, Honkai: Star Rail, Zenless Zone Zero and Neverness to Everness): a bot on meocord (chutao-djs), a Rust REST API on axum and SeaORM (chutao-api), and a Next.js portal (chutao-web) for OAuth and account linking.
What comes out
server-rendered · cached hourlyThe image below was not screenshotted. meo-canvas drew it inside this server, and because it is a Neon addon it cannot run in your browser. The WebP is encoded from the same figures the panels above report.
Ledger
2016 —Senior Software Engineer
PT Media Info Grup Indonesia · Jakarta- Rewrote modules of a long-running Delphi system as TypeScript services, verifying each module against the original implementation's behaviour and enforcing a per-endpoint OpenAPI contract.
- Sole author of the shared Elasticsearch client library used across the company's services, published as an internal npm package.
- Migrated a production search backend off a legacy IDOL engine onto Elasticsearch.
- Hardened write paths: made multi-step writes atomic and correctly scoped, and reshaped validation errors so the front-end could localize them.
Frontend Programmer
PT Administrasi Medika · Jakarta- Built a bridge API using NestJS to integrate Indonesia's SatuSehat platform into existing TPA insurance systems, translating bidirectionally between FHIR and internal structures with OAuth2 authentication.
- Developed a Progressive Web App with Next.js for marketing promos and food-outlet sales, integrated with a Flutter application via access token passing.
- Built a provider management system for hospital medicine-order workflows, with real-time verification and Redux state management.
Open Source Framework Developer
Self-directed- The packages above, in two unrelated lines: a type-safe React composition layer without JSX, with its Rust SWC compiler, and a Taffy-and-Skia scene renderer over a Canvas 2D rasteriser. Plus a Discord bot framework for Node, which belongs to neither.
- Implemented CI/CD pipelines and automated testing for every published package.
Freelance Application Developer
Self-employed- Delivered full-stack web and mobile solutions with React Native, Next.js and Laravel.
- Managed deployment pipelines with Docker and GitLab CI/CD.