Derfor laster ikke demoen før du trykker på den

PLASSHOLDERTEKST. Bytt ut alt under denne linja.

Demoen i «Prøv selv» er en egen 3D-applikasjon på 233 KB. Da adressa lå rett i src på ruta, begynte den å laste 141 millisekunder etter at sida åpnet, altså fem millisekunder etter sidas egen bunt. Resultatet var to Three.js-applikasjoner som kjempet om båndbredde og grafikkort mens huset i toppen av sida skulle bygges.

Det som ikke virket

Det opplagte forsøket var loading="lazy" på ruta. Det hjalp ikke. Chrome har en avstandsterskel for når noe regnes som «langt nok unna», og demoruta ligger innenfor den. Nettleseren hentet den uansett.

Det som virket

Adressa ligger nå i data-src, ikke src, og flyttes over først når noen trykker Start. Da er det brukeren som har bestemt at demoen skal kjøre, og ingen andre betaler for det valget.

Full forhåndslasting ble vurdert og forkastet: et satt src starter demoens egen renderloop og WebGL-kontekst, altså akkurat det problemet vi ryddet vekk.

Nedlastingen tyvstarter riktignok på hensikt. Beveger du musa over knappen, eller legger fingeren på den, begynner den å hente før klikket rekker fram. Det gir mellom 100 og 300 millisekunder forsprang og koster ingenting for alle som aldri trykker.