Reference

Performance and quality

Every scenario holds 61–85 fps at 1280×720 on the high tier on an Apple M5. Four game tiers scale the libraries' own tiers and the game's budgets for shadows, vegetation and wildlife.

all eleven scenarios, high tier: 61–85 fps
smoke-test viewport: 1280×720
ANGLE Metal, headless Chromium: Apple M5
library builds in lib/: 1.1.0

#Measured

npm test at 1280×720, high tier, Apple M5 (ANGLE Metal), headless Chromium, libraries 1.1.0, 2 s settle and 2 s measurement per scenario. Two runs with no other GPU work on the machine.

Scenario	Run 1 (fps)	Run 2 (fps)
`village-day`	77	76
`jungle-path`	70	68
`beach`	81	80
`pier-day`	66	71
`pier-sunset`	63	72
`pier-night`	69	72
`boat`	67	65
`boat-chase`	80	82
`underwater`	85	81
`drone-island`	64	66
`drone-lagoon`	61	64

#Quality tiers

Pick a tier with ?quality=, the Settings panel (Tab) or game.setQuality(level). Defined in src/config/QualityLevels.js:

	Low	Medium	High (default)	Ultra
NatureGL Sky tier	low	low	medium	high
NatureGL Water tier	low	medium	high	ultra
NatureGL Grass tier	low	medium	medium	high
NatureGL Weather tier (rain)	medium	medium	medium	high
Pixel ratio	1	1	1	1.5
Shadow map	1024²	2048²	2048²	4096²
Shadow extent	±45 m	±55 m	±65 m	±80 m
Terrain segments	300	360	420	480
Tree density	0.55×	0.8×	1×	1.2×
Scatter density	0.5×	0.75×	1×	1.25×
Fish	140	260	420	600
Birds	16	24	32	40

Switching tier at run time (setQuality) changes the library tiers, the shadow map and the pixel ratio immediately. The terrain segments, tree and scatter densities and wildlife counts are set when the island is built, so for those use ?quality= on load.

#Where the frame time goes

The drone views see the whole island at once and are among the slowest scenarios (61–66 fps on high).
The sky post pass (setSkyPost(true)) costs frame time and is off by default for that reason.
The Performance panel in the HUD shows the frame time, draw calls, triangles, grass blades, palms and trees, the sky and water tiers, and the significant wave height live.

What 1.1.0 did to stay inside the budget: tree cores are 20-triangle shells with radial normals, trunks have a far LOD, sea-grass and coral geometry is budgeted, and the reef and scatter layers are chunked coarsely to keep draw calls down.

#Making it faster

Use ?quality=medium or low. low halves the scatter density and drops the shadow map to 1024².
Turn off Grass, Trees & palms or Wildlife in the Settings panel to see what each one costs.
Keep the browser window small on integrated GPUs. The demo renders at a pixel ratio of 1 (except Ultra picked in the panel), so the window size is the render size.