Tech Stack
The stack behind Qris.
Static pages, plain modules, three public data feeds, and a register that decides what may be shown.
Tech Stack
Runtime.
Static pages and native ES modules, no framework.
Static output
The site is plain HTML, CSS and JavaScript modules. Packaging copies files and generates the About, Docs and Tech pages from one content module.
No trackers
No analytics, no cookies, no third-party scripts. Fonts come from Google Fonts; live numbers come from the three public endpoints listed under Data.
Module layout
register.js every outside fact, one record each
net.js fetch with timeout + retry (injectable clock)
lib.js pure parsers and formatters
app.js DOM, polling, console, motionNo blocks match.
Tech Stack
Data.
Endpoints, cadence and failure behaviour.
Cadence
RPC every 4 s, DefiLlama every 60 s, DexScreener every 30 s.
RPC timeout 6 s · 3 retries · backoff 400 ms doubling
DefiLlama timeout 8 s · 2 retries
DexScreener timeout 8 s · 2 retriesFail soft
Errors flip the status pill between online, retrying and offline. They never invent values.
Count-up
Figures count up on first load and on change, then flash once. With reduced motion enabled they are set instantly.
No blocks match.
Tech Stack
Register.
The single source for every outside fact.
States
Stated, absent or unconfirmed. Absent records must hold null.
Links
Only stated records with an https URL can produce a link. Handles are derived from the URL.
linkFor(record) // null unless stated + https
handleFromUrl(url) // '@name' from the first path segmentNo blocks match.
Tech Stack
Gates.
What is verified before shipping.
Rules
Register shape, link rule, address handling, retry and timeout on a fake clock, formatters, count-up easing, reduced-motion coverage, palette provenance, wording overlap, repo hygiene, tap targets and page structure.
Run
npm run build && npm run gatesNo blocks match.
Tech Stack
Palette.
Colours sampled from the brand files, with provenance.
One file
Every colour literal lives in tokens.css. Every other colour is derived from those tokens with color-mix.
Sampled, not picked
The palette comes from the logo and cover files: k-means clusters, each snapped to a real pixel. Every token records the file and pixel it came from, and the gates re-read that pixel.
Hero art and favicon
The hero grid is a crop of the cover file. The favicon is the logo’s own pixel grid, shrunk with premultiplied alpha because the transparent logo stores pure black in its fully transparent pixels.
No blocks match.