NANAWING GUIDES · HOW IT'S BUILT ▶ Fly now — it's free
Engineering

How Nanawing is built: a whole island in a browser tab

Nanawing is a free FPV wing simulator that loads like a web page, flies at 60 fps, and keeps working with the network cable pulled out. This is the engineering story — the terrain pipeline, the forest trick, the honest benchmark and the offline machinery — for curious players and fellow developers.

High aerial view of the Nanawing island showing the river, patchwork farmland, the lake and the coastline
THE ISLAND FROM ALTITUDE — every field, tree and building below is placed from one baked height field

Browser-native, on purpose

Nanawing is written in TypeScript and rendered with Babylon.js on WebGL2 — no plugins, no launcher, no download, no signup. That constraint is the whole design brief: if the sim only ran well after a 4 GB install, it wouldn't be the thing you can hand to a friend as a link. Everything below — the terrain bake, the impostor forests, the tiered graphics — exists to make a browser tab feel like a native flight sim. You can judge the result yourself at sim.narenana.com; the rest of this page explains how it's done.

The terrain pipeline: one source of truth

Valley with a river, patchwork fields and hot-air balloons over the Nanawing island
THE VALLEY — mesh, ground textures, tree placement and collision all read the same height field

The island isn't sculpted by hand and it isn't procedural noise. Its shape comes from real elevation data — the Copernicus satellite DEM — reshaped into a coastal island of rolling farmland roughly 3.8 km across (there's a full tour in the island guide). That happens offline: a bake tool crunches the raw elevation into one compact height field that ships with the game.

The important decision is what happens next: that single height field feeds everything.

Why one source of truth matters

Games that keep separate copies of the world — one for rendering, one for physics, one for object placement — accumulate tiny disagreements: floating trees, collisions a metre above the grass. With a single baked height field there is nothing to drift. If the mesh shows a slope, the wing collides with that slope, and the tree on it stands on it.

The forest trick: impostors

The most expensive thing on the island isn't water or shadows — it's trees. Thousands of them, each a proper 3D model up close. Drawing them all at full detail every frame would end 60 fps immediately, so Nanawing uses impostors: at load time, each tree species is photographed by the engine into a billboard — a flat picture of the tree. Nearby trees stay real 3D; distant ones are swapped for their billboard, which costs almost nothing to draw. Fly toward a forest and the billboards quietly hand over to geometry before you can catch them at it.

Because the photograph is taken at load from the actual in-game model, the billboard matches the real tree's silhouette and lighting — it isn't a pre-drawn sprite that almost matches. That trick, more than any other, is how a whole forested island fits in a frame budget.

Honest performance: measure, don't guess

Most games guess your hardware from a name string and hope. Nanawing doesn't guess — on first run it benchmarks your actual machine, measuring median frame time while rendering real work, and then picks a tier honestly: Ultra, High or Lite. A gaming desktop gets the full treatment; a modest laptop gets a build of the same island that holds its frame rate instead of stuttering through the pretty version. The measurement is of your browser on your GPU on the day you first load — not a lookup table of hardware released before the game was.

Offline-first: it flies in airplane mode

Nanawing is an installable PWA, and offline isn't a degraded mode — it's a hard rule of the project. A service worker caches the entire game on first load: code, terrain, aircraft, textures, sounds. After that, the sim loads and flies with no connection at all. When you are online, updates download quietly in the background and apply on the next visit — you never watch a patch bar.

Even the fonts are self-hosted rather than pulled from a CDN, so the typography works offline too. The only feature that genuinely needs the internet is the global leaderboard, and it says so politely in its own tab and retries — it never blocks loading or flying.

The flight model, and the bench that measures it

Under the visuals is a fixed-wing flight model with coordinated turns, real stall behaviour, and per-airframe thrust, roll response and battery — which is why the three aircraft feel like three different machines rather than three skins (the how-to-play guide covers what that means on the sticks).

The neat part is how the published specs are produced. The numbers on the aircraft page — top speed, stall speed, roll rate, climb rate — are not designer intentions typed into a table. An autopilot flight bench actually flies each wing on the real physics: it launches, accelerates, stalls and rolls the aircraft, and records what happened. If the physics change, the bench re-flies the fleet and the specs change with it. The spec sheet can't lie, because it's a lab report.

The leaderboard: small, global, no accounts

The Nanawing global leaderboard screen listing named pilots and their best lap times
THE RACE TAB — a tiny worker and one database table behind a global all-time board

The all-time race board runs on Cloudflare D1 — a small SQL database at the edge — fronted by a tiny worker. There are no accounts anywhere in the game: your pilot name is saved on your device, each pilot holds one row that only ever improves, and the board shows the top 20 plus your own standing even when you're outside it. The full etiquette of the arch, the medals and the times lives in the racing guide.

The asset ethic

Everything in the world is CC0 or CC-BY licensed — ground textures and HDRIs from Poly Haven and ambientCG, models from Quaternius and individual Sketchfab artists — with credits shown in-app, where the people who made the assets deserve them. Two of the three aircraft are CC-BY community models flown with attribution. It's a small thing, but a browser game that works offline, costs nothing and credits its artists properly is the kind of web software worth making.

The short version

ProblemAnswer
Run a sim without an installTypeScript + Babylon.js on WebGL2 — plain browser tech, no plugins
Believable terrainCopernicus satellite DEM, baked offline into one height field feeding mesh, splat, props and collision
Thousands of trees at 60 fpsImpostors — each species photographed into a billboard at load
Wildly different hardwareFirst-run benchmark measures median frame time, picks Ultra / High / Lite
Flaky connectionsOffline-first service worker; the whole game is cached and flies in airplane mode
Honest aircraft specsAn autopilot bench flies each wing on the real physics and records the numbers
A global board with no accountsCloudflare D1 plus a tiny worker; name stored on your device

The best way to evaluate any of it is the product itself: open the sim, let it cache, turn your Wi-Fi off, and go flying.

See the engineering fly.
Loads in seconds, flies offline, free forever. Space to launch.
START FLYING →