Armillary
The site's own emblem — a WebGL armillary sphere rendered as a lazy-loaded island. A small study in doing polish without taxing the page.
The instrument on the home page is an armillary sphere: the Renaissance model of the heavens, many rings expressing one system. It is also a working demonstration of the architecture this whole site is built on.
Polish as an opt-in
The sphere is a Vue component using vanilla Three.js. It is mounted with
client:idle, so the content of the page renders instantly as static HTML and
the WebGL only spins up once the browser is otherwise free. Essays and indexes
ship zero JavaScript; the moments that should feel cinematic pay for
themselves and nothing else does.
// HeroArmillary.vue — rings at varied inclinations, one shared group
const ringDefs = [
{ r: 2.6, tube: 0.012, rot: [0, 0, 0] },
{ r: 2.6, tube: 0.018, rot: [0.41, 0, 0] }, // the ecliptic
// …
];It respects prefers-reduced-motion, caps the device pixel ratio, and disposes
of its geometries on unmount. Polish, but disciplined.