Google har enligt ett inlägg på företagets officiella Chromium-blogg minskat andelen hackiga scrollningar, så kallad ”jank”, i Chrome för Android med 48 procent sedan 2023. Nyheten uppmärksammades först av Swedroid, och den ger en inblick i hur webbläsarens renderingsmotor har byggts om för att leverera bildrutor mer konsekvent, särskilt på mobila enheter med begränsade resurser.
Vad är hackig scrollning?
Ett ”hack” uppstår när Chrome inte hinner leverera en ny bildruta innan skärmen uppdateras. På en skärm med 60 Hz uppdateringsfrekvens har webbläsaren ungefär 16,7 millisekunder på sig per bildruta. Missas den deadline visas i stället en inaktuell scrollposition under en hel uppdateringscykel, vilket ögat upplever som ett ryck i rörelsen. Google beskriver det som att konsekvens, inte råhastighet, är den avgörande faktorn: varje scrolluppdatering måste ta lika lång tid för att kännas jämn.
Så mättes förbättringen
Enligt Chromium-bloggen har Google använt så kallade Perfetto-spårhändelser (trace events) för att instrumentera hela kedjan från inmatning till levererad bildruta, och byggt egna PerfettoSQL-frågor för att automatiskt hitta orsaken till enskilda hack i verklig användardata. Det är den analysen som ligger bakom 48-procentssiffran.
Sex tekniska grepp bakom minskningen
Chromium-bloggen radar upp ett antal specifika förändringar i renderingsarkitekturen:
- Input Vizard. Inmatningshändelser flyttas från webbläsarens huvudtråd till GPU-processens så kallade Viz-compositortråd, vilket gör att tunga uppgifter på huvudtråden inte längre stör scrollningen på samma sätt.
- Input Framer. Renderarprocessen kan vänta upp till en tredjedel av en uppdateringscykel på en sen inmatningshändelse i stället för att rendera en tom bildruta.
- Input Prediction. Kommer inte operativsystemets inmatningsdata i tid skapar Chrome en egen, syntetisk scrolluppdatering baserad på tidigare rörelsemönster.
- Direct2Thread. Antalet trådhopp i den interna kommunikationen mellan processer har minskats, från upp till tre hopp till ett enda på den kritiska vägen.
- Browser Controls in Viz. GPU-processen sköter nu synkroniseringen av webbläsarens egna kontroller, till exempel adressfält, mot webbinnehållet under scrollning, utan att huvudtråden behöver blandas in.
- Android Input Thread Priority. Ett samarbete med Android säkerställer att de systemtrådar som levererar inmatning från hårdvaran får tillräckligt hög prioritet.
Chromium-teamet sammanfattar principen bakom arbetet ungefär så här: Chrome har en strikt deadline för att leverera varje bildruta innan skärmen uppdateras. Missas den deadline tvingas skärmen visa en inaktuell scrollposition under en hel uppdateringscykel, cirka 16,7 millisekunder på en skärm med 60 Hz, vilket det mänskliga ögat uppfattar som ett ryckigt hack. Att undvika detta kräver att kedjan från inmatning till levererad bildruta är konsekvent, varje scrolluppdatering måste ta exakt lika lång tid för att presenteras.
Vad betyder det för webbutvecklare?
Chromium-bloggen riktar sig i första hand till Googles egna ingenjörer och beskriver interna arkitekturförändringar i webbläsaren, inte konkreta råd till webbutvecklare. Men resonemanget pekar ändå ut var ansvaret ligger även utanför webbläsaren: Google skriver uttryckligen att långvariga uppgifter på huvudtråden kan orsaka scrolljank. Det gäller webbläsarens egen kod, men samma huvudtråd delas med varje sidas JavaScript.
Praktiskt betyder det att tunga, synkrona skript som körs under en scrollning, till exempel stora beräkningar, layoutomflöden som tvingas fram av att läsa och skriva DOM-egenskaper om vartannat, eller bildavkodning av alltför stora bilder, konkurrerar om samma tidsbudget som Chrome nu har blivit bättre på att hushålla med. Etablerad praxis, som att använda passiva händelselyssnare för scroll- och touchhändelser, undvika layoutomflöden i scrollhanterare och ange bild- och elementdimensioner i förväg så att sidan inte tvingas räkna om sitt utseende mitt i en scrollning, blir därmed inte mindre relevant bara för att webbläsaren själv har förbättrats. Chromes nya arkitektur ger mer marginal, men den tar inte bort effekten av tung kod som blockerar huvudtråden på en mobil enhet med begränsad processorkraft.
Källa: Swedroid, med ursprung i Googles Chromium-blogg.