The Operator's Workshop

Cutting-edge made tangible.

Every API, every primitive, every browser feature powering lucaslib.com — running live. No demos hidden behind a slide deck. Open DevTools and inspect.

9 LIVE DEMOS · ZERO FRAMEWORKS · 0KB JS BUNDLE BEYOND THIS PAGE
DEMO 01 / WEBGL

Volumetric golden orb

three.js · r128 · ~150 LOC

Real-time WebGL bloom emulation via three additive sphere shells. Same engine powering /aether's hero. Resizes to viewport, capped 60fps.

DEMO 02 / CSS

Scroll-driven animations

animation-timeline: scroll() · view()

Native CSS scroll progress. No JS scroll listeners, no IntersectionObserver. The gold bar fills as you scroll the inner panel; items fade in as they enter view.

// scroll-driven progress bar above
// each item: animation-timeline: view()
// fades in via animation-range: entry 0% cover 30%
// zero JavaScript
// 60fps on integrated GPU
// works offline
// scroll up, then down — no flicker
// item 8 — keep going
// item 9
// item 10 — last one
Detecting…
DEMO 03 / NAVIGATION

View Transitions API

document.startViewTransition()

Native browser-level page transitions. Click any internal link from this page — Chrome cross-fades the whole document like a single-page app. Zero framework router.

Detecting…
DEMO 04 / CSS

:has() parent selector

.row:has(input:checked)

A row styles itself based on whether its child checkbox is checked. Used to be impossible without JS. Now: single CSS line.

Detecting…
DEMO 05 / TYPOGRAPHY

text-wrap: balance

text-wrap: balance vs nowrap

Browser auto-balances headline line lengths. No more orphan words on the last line. Same as Apple's marketing site — but native CSS.

// WITH text-wrap: balance
Manifestation. Engineered. A daily ritual that rewires.
// WITHOUT
Manifestation. Engineered. A daily ritual that rewires.
DEMO 06 / VOICE

Web Speech API

speechSynthesis.speak()

The browser reads an Aether affirmation aloud. Native voice — no API keys, no costs, no servers. Works offline. Same primitive backing the /aether voice mode.

"I am the calm at the center. The vision is already real."
Detecting…
DEMO 07 / AUDIO

Web Audio + analyser

AudioContext · 528Hz Solfeggio

Generates the Aether 528Hz "love frequency" hum in-browser, runs it through an analyser node, and visualizes the spectrum live. Zero audio assets shipped.

DEMO 08 / EFFECTS

Typewriter stream

requestAnimationFrame · ~40 LOC

Variable-speed character stream with a blinking caret. The same effect AI products use to feel "alive." No library — pure rAF loop.

DEMO 09 / DEVICE

Web Share + Vibration

navigator.share · navigator.vibrate

Native OS share sheet on mobile. Haptic feedback on Android. Same primitives /aether and /journal use to push to social without third-party widgets.

Share lucaslib.com from your phone's native sheet.
Detecting…

The full stack, on this page.

Everything below is shipping in production right now. No build step. No bundler. No framework. Just modern web platform features cached on edge.

WebGLthree.js r128
AudioWeb Audio + Tone.js
VoiceSpeechSynthesis
Scroll FXanimation-timeline
TransitionsView Transitions API
Pre-renderSpeculation Rules
Selectors:has() parent
Layouttext-wrap: balance/pretty
Entrance@starting-style
OfflineService Worker v10
Native shareWeb Share + Vibration
EdgeCloudflare Pages
SEOJSON Feed + RSS + JSON-LD
DiscoverySitemap + AI bot allowlist
TypeCormorant + JetBrains Mono
Bundle0kb framework