16,7 millisekunder.
Ungefär så lång tid finns mellan två bildrutor på en skärm som arbetar i 60 Hz. För ett webbläsarspel är det tillräckligt för att flytta symboler, rita om en animation och sedan göra samma sak igen. Många moderna casinospel använder samma teknik som andra spel i webbläsaren för att få rörelserna att följa skärmens uppdatering.
60 bilder per sekund är därför ett vanligt riktmärke.
Men det är inte en fast gräns för webben.
Webbläsaren väntar på nästa bildruta
I JavaScript finns en funktion med det ganska talande namnet “requestAnimationFrame”.
En utvecklare kan använda den för att be webbläsaren köra kod inför nästa gång bilden ska ritas om. På en vanlig 60 Hz-skärm sker det normalt omkring 60 gånger i sekunden. Byter man till en skärm på 120 eller 144 Hz kan anropen komma oftare.
Det är en viktig detalj.
Ett casinospel behöver alltså inte ha en klocka som blint räknar till 60 och börjar om varje sekund. Webbläsaren kan i stället synkronisera animationen med skärmen som faktiskt används.
Det är ungefär som ett digitalt blädderblock. Skillnaden är att varje nytt blad räknas fram medan användaren tittar.
Hjulet har flyttat sig lite. Ett kort har vänt sig några grader. En symbol är på väg från en position till en annan.
Sedan ritas nästa bild.
En sekund innehåller ganska mycket arbete
Vid 60 bilder per sekund har varje bildruta ungefär 16,7 millisekunder på sig.
Under den tiden kan spelet behöva uppdatera animationer, behandla vad användaren gjort och förbereda grafiken som ska visas härnäst. Om arbetet tar för lång tid blir nästa bild sen.
Det är då rörelsen kan börja hacka.
Själva spelresultatet behöver inte påverkas för att animationen gör det. Grafiken och den bakomliggande spellogiken är olika delar av systemet. Ett snurrande hjul kan exempelvis visas genom en animation även om resultatet hanteras separat.
Den skillnaden är lätt att glömma när allt visas på samma skärm.
För användaren är det bara ett casinospel som rör sig.
För webbläsaren är det kod, grafik och en rad nya bildrutor.
Mobilen gör samma jobb med mindre marginaler
Det blir mer intressant när samma spel ska fungera på en telefon.
En modern mobilskärm kan ha hög upplösning och hög uppdateringsfrekvens, men telefonen arbetar samtidigt med batteri, värme och betydligt mindre fysisk plats än en stationär dator. Spelet måste dessutom fungera tillsammans med resten av webbläsaren.
För mycket arbete i varje bildruta märks snabbt.
Det är en anledning till att utvecklare inte bara kan fylla skärmen med fler effekter tills något går långsamt. Grafik behöver skalas, resurser laddas och animationer anpassas efter enheten.
Även sådant som minne, bakgrundsappar och telefonens övriga prestanda påverkar hur mycket utrymme webbläsaren har att arbeta med.
Ett enkelt casinospel kan därför kännas helt jämnt på en mobil medan ett tyngre spel tappar bildrutor på samma enhet.
Skärmen kanske fortfarande klarar 60 Hz.
Det betyder inte att spelet alltid lyckas leverera 60 nya bilder.
60 fps och 60 Hz är inte riktigt samma sak
Begreppen ligger nära varandra men beskriver två olika saker.
Hertz anger hur ofta skärmen kan uppdatera bilden. FPS beskriver hur många bildrutor innehållet faktiskt producerar.
En 60 Hz-skärm kan visa upp till 60 separata uppdateringar per sekund. Om spelet bara hinner rita 40 nya bildrutor får skärmen inte plötsligt fram de tjugo som saknas.
Omvänt kan en 120 Hz-skärm ge webbläsaren möjlighet att uppdatera oftare än 60 gånger per sekund.
Det är därför rubriken behöver läsas som ett vanligt tekniskt scenario, inte som en regel för alla datorer och telefoner. 60 Hz är fortfarande en mycket vanlig uppdateringsfrekvens, men 75, 120 och 144 Hz förekommer också i stor omfattning.
Webben har fått anpassa sig efter det.
Kod som kopplar rörelse direkt till antalet bildrutor kan annars börja bete sig märkligt på snabbare skärmar. Därför används tidsskillnaden mellan bildrutorna ofta när rörelser räknas fram. En animation ska ta ungefär lika lång tid oavsett om skärmen visar 60 eller 120 bilder under sekunden.
När fliken försvinner händer något annat
Det finns ännu en detalj som säger mycket om hur tekniken fungerar.
Byter användaren till en annan flik brukar webbläsaren minska eller stoppa anropen från “requestAnimationFrame”.Det finns ingen större poäng med att fortsätta rita en avancerad animation 60 gånger i sekunden när ingen ser den.
Det sparar processorkraft och batteri.
När fliken kommer tillbaka kan animationen fortsätta utifrån den tid som faktiskt har gått i stället för att desperat försöka rita alla missade bildrutor.
Det är en liten funktion, men ganska typisk för moderna webbläsare.
Ett casinospel behöver inte känna till exakt vilken skärm det hamnar på när sidan öppnas. Webbläsaren fungerar som mellanhand och berättar när nästa bild ska förberedas.
På en 60 Hz-skärm kan det bli ungefär var 16,7 millisekund.
Så snabbt går det att glömma att varje rörelse på skärmen egentligen består av en lång rad stillbilder.