Colophon
Mehtab means moonlight. I came back to Lahore to build companies, and this site joins the two.
It is a static site, written by hand: Astro with strict TypeScript, and hand authored CSS in cascade layers, with every colour, size and duration drawn from one file of tokens. There is no CSS framework and no client side framework. The few scripts there are (the theme toggle, the menu, the Lahore clock and the contact form) are small modules that run after the page is already readable.
Type is set in Schibsted Grotesk and Newsreader, both under the SIL Open Font License, subset and self hosted, with fallback faces adjusted to the same metrics so nothing shifts when the real fonts arrive.
The moon phase in the readout is computed in your browser from the current time, using the low precision method in Jean Meeus's Astronomical Algorithms, and tested against NASA's published phase times.
It is served from Cloudflare Workers, with a strict Content Security Policy.
The scene and its data
The city behind the home page is the Walled City of Lahore, 1.6 by 1.9 km with Badshahi Mosque, Lahore Fort and Wazir Khan Mosque inside it, and Minar-e-Pakistan in the park to the north. A Python pipeline builds it from open data: 10,066 building footprints from Google Open Buildings, with heights from its 2.5D Temporal dataset, and 117.2 km of streets, with the green spaces and the outlines of the landmarks, from OpenStreetMap.
Satellite heights cannot see anything as thin as a minaret, so the domes and minarets of the three landmarks are generated from their outlines, published dimensions and the height data. From all of it the pipeline samples 224,298 points for the scene.
The scene data is published under the Open Database License 1.0. Its manifest lists every file with its sources, their licences, its size and its checksum.
The scene is drawn by a small WebGL2 renderer written for this site, with no 3D library: 19.9 KB of JavaScript, shaders included, loaded only once the page is idle. The points stream in by distance from the centre and are drawn as they arrive, so the sweep that reveals the city is its real loading progress. A camera on a spline follows your scroll through a damped spring, a few cars move along the major roads, and the quality steps down on a slow device until, if it must, the map takes over.
The light is computed in your browser for this moment in Lahore: the sun's position from the US Naval Observatory's approximate solar coordinates, and the moon's from Meeus, both tested against JPL Horizons. By night the city is lit by the moon, if it is up, and by its streetlights; by day by the sun, with shadows drawn from where it stands; and dawn and dusk between. The readout at the foot of every page shows the moon's phase the scene is using, and the theme follows the same sunrise and sunset unless you choose one.
Budgets
Every build is checked against these limits, compressed with brotli as served (fonts are counted as they are, since WOFF2 is already compressed). These are the real numbers for the build you are reading, across 12 pages.
Build 54d5dcc, committed 2026-11-12.
| Per page | Limit | Largest page | Home |
|---|---|---|---|
| HTML | 30 KB | 13.2 KB | 13.2 KB |
| CSS | 20 KB | 5.4 KB | 5.4 KB |
| JavaScript before the scene | 15 KB | 6.7 KB | 6.7 KB |
| Fonts | 120 KB | 72.6 KB | 72.6 KB |
This page's own row is measured a moment before its numbers are written into it, so it is a few bytes light.
Credits
Schibsted Grotesk, designed by Henrik Kongsvoll of Bakken & Baeck for Schibsted. Newsreader, designed by Hugues Gentile for Production Type. Both under the SIL Open Font License 1.1.
- OpenStreetMap, for the streets, green space, water, and the outlines, halls, walls and minarets of the landmarks. © OpenStreetMap contributors.
- Google Open Buildings v3, for the building footprints. Buildings from Google Open Buildings.
- Google Open Buildings 2.5D Temporal, for the building heights. Contains modified Copernicus Sentinel data 2023.