Sådan fungerer det: Teknologi, opløsninger og grænser

1. Hvorfor vi ikke bruger videooptagelse

En udbredt misforståelse er, at visuelle analyseværktøjer optager almindelige videofiler (som MP4 eller WebM) af den besøgendes skærm. Det ville bruge enorme mængder båndbredde, gøre dit websted markant langsommere og give sløret, ulæselig tekst.

I stedet bruger MousePlayer en let teknologi kaldet DOM-øjebliksbilledtelemetri. Sådan fungerer den grundlæggende:

Øjebliksbilledet som plantegning

Når en besøgende åbner din side, tager vores script en tekstbaseret »plantegning« af HTML- og typografistrukturen. Det registrerer elementernes placering uden at kopiere sidens billed- eller videofiler; afspilleren indlæser billeder fra deres oprindelige adresse under afspilningen. Undtagelsen er canvas-elementer, hvis indhold overføres som et billede (se nedenfor).

Koordinattelemetri

Mens brugeren interagerer, optager vi en strøm af hændelser: musepositioner, rulledybde, klikmål og ændringer i browserstørrelsen samt ændringer af selve siden og, afhængigt af indstillingerne, konsolmeddelelser, mislykkede eller langsomme forespørgsler og målinger af indlæsningstid (Web Vitals). Bevægelser og klik fylder lidt; sideøjebliksbilleder og sideændringer kan være betydeligt større afhængigt af siden og overføres komprimeret.

Afspilning i teatertilstand

Når du ser en session i dit dashboard, genskaber afspilleren siden ud fra den optagne plantegning og bevæger en virtuel markør over den i realtid, mens teksten forbliver knivskarp.

Udviklet til at være let: scriptet indlæses asynkront og overfører små numeriske datapunkter i stedet for video, så dets eget ressourceforbrug holdes lavt. Betydningen for dine Core Web Vitals afhænger af siderne, din hosting og den besøgendes netværk, så mål det på dit eget websted i stedet for at bruge et tal fra os. Ingen bestemt indlæsningshastighed garanteres – se punkt 20 i tjenestevilkårene.

2. Håndtering af skærmopløsninger & mobilenheder

Nutidens brugere bruger alt fra kompakte smartphones til ultrabrede 4K-computerskærme. Websteder flytter, folder og omarrangerer automatisk deres layout efter skærmbredden – et princip kendt som responsivt webdesign.

Sådan matcher vi den besøgendes præcise visningsområde

For at undgå forvrænget afspilning registrerer MousePlayer den besøgendes præcise visningsmål (f.eks. 390x844 på en smartphone eller 1920x1080 på en computerskærm). Når du åbner teaterafspilleren, opretter vores motor en skaleret sandkasse, der præcist gengiver det oprindelige skærmforhold.

Stationære & bærbare computere

På almindelige computere optager vi løbende musebevægelser og navigation på tværs af faner i samme browsersession. Menuer, der åbnes, når markøren holdes over dem, vises i afspilningen, hvis siden samtidig ændrer sit dokument; en ren CSS-hovereffekt er ikke synlig i dokumentet og gengives ikke i afspilningen.

Smartphones & tablets

Touchskærme har ingen svævende musemarkør. MousePlayer tilpasser sig automatisk ved at optage trykbevægelser, rulning med strøg og ændringer i skærmretningen (stående eller liggende).

Udfordringen ved størrelsesændringer under en session

Hvis en besøgende drejer sin tablet eller ændrer browservinduets størrelse midt i en session, ændres webstedets layout dynamisk. MousePlayer optager disse størrelsesændringer og tilpasser løbende afspilningsfladen, så interaktionens sammenhæng bevares.

3. Systemgrænser & tekniske begrænsninger

For at respektere privatlivet, bevare browsersikkerheden og holde databehandlingen hurtig arbejder MousePlayer inden for faste tekniske grænser:

Systemgrænse	Sådan håndterer MousePlayer det
iFrames	iframes med samme oprindelse som din side optages med deres indhold og interaktionen i dem. Indlejret indhold fra en anden oprindelse (f.eks. YouTube-afspillere og Stripe-betalingsformularer) kan ikke optages internt på grund af browserens sikkerhedsregler (Same-Origin Policy); det vises som en pladsholder i afspilningen og indlæses ikke der.
Følsomme inputfelter (personoplysninger)	Adgangskode- og betalingsfelter maskeres på den besøgendes enhed på alle maskeringsniveauer, og fuld maskering af alle formularinput er standard for hvert websted. Du ser, at der blev skrevet, men ikke hvad. To begrænsninger gælder: de to svagere niveauer aktiveres kun efter vores skriftlige godkendelse, og maskering omfatter aldrig det, din egen side skriver i dokumentet – en bekræftelsesside, der viser en adresse, indgår i øjebliksbilledet. Begge dele fremgår af databehandleraftalen.
Canvas- & WebGL-elementer	Indholdet af et canvas optages som et billede: én gang med sideøjebliksbilledet og igen, når det ændrer sig, højst cirka én gang i sekundet og med en størrelsesgrænse. Flydende animationer vises derfor som en række billeder. Intet billede overføres i maskerede områder eller for canvas-elementer med billeder fra en anden oprindelse; WebGL-indhold kan forblive tomt.
Web Components (Shadow DOM)	Åbne shadow roots optages sammen med deres indhold. Lukkede shadow roots er utilgængelige for scripts; deres indhold mangler i afspilningen.
Transport & browserlagring	Data sendes over en krypteret WebSocket-forbindelse (HTTPS/WSS). Hvis den ikke kan etableres, f.eks. på grund af en proxy, falder scriptet tilbage på en krypteret HTTP-rute; meget store sideøjebliksbilleder uploades separat via HTTPS. MousePlayer sætter ingen cookies; det bruger browserens lokale lagring og sessionslagring på dit websted.
Inaktive AFK-perioder	Hvis en besøgende lader fanen stå åben og går væk i 20 minutter, registrerer vores motor automatisk inaktiviteten og forkorter pausen under afspilningen, så du ikke spilder tid på stillestående skærme.

Hvordan kan vi hjælpe?