Ako to funguje: Technológia, rozlíšenia a limity

1. Prečo nepoužívame nahrávanie videa

Častou mylnou predstavou je, že nástroje vizuálnej analytiky nahrávajú štandardné videosúbory (napríklad MP4 alebo WebM) obrazovky návštevníka. To by spotrebovalo obrovský objem prenosu, výrazne spomalilo váš web a vytváralo rozmazaný, nečitateľný text.

MousePlayer namiesto toho používa nenáročnú technológiu nazývanú telemetriou snímok DOM. Na základnej úrovni funguje takto:

Snímka štruktúry stránky

Keď návštevník otvorí vašu stránku, náš skript vytvorí textový „plán“ vášho HTML a štruktúry štýlov. Zaznamená polohu prvkov bez kopírovania obrázkov či videosúborov stránky; prehrávač pri prehrávaní načítava obrázky z ich pôvodnej adresy. Výnimkou sú prvky canvas, ktorých obsah sa prenáša ako obrázok (pozri nižšie).

Telemetria súradníc

Počas interakcie používateľa zaznamenávame prúd udalostí: polohy myši, hĺbku posunu, ciele kliknutí a zmeny veľkosti prehliadača, ako aj zmeny samotnej stránky a podľa nastavení aj správy konzoly, neúspešné alebo pomalé požiadavky a merania času načítania (Web Vitals). Pohyby a kliknutia majú malý objem; snímky a zmeny stránky môžu byť podľa stránky podstatne väčšie a prenášajú sa komprimované.

Prehrávanie v režime kina

Keď sledujete reláciu vo svojom prehľade, náš prehrávač znovu vytvorí stránku zo zaznamenaného plánu a pohybuje po nej virtuálnym kurzorom v reálnom čase, pričom text zostáva dokonale ostrý.

Navrhnuté pre nízku záťaž: skript sa načítava asynchrónne a prenáša malé číselné dátové body namiesto videa, čím udržiava vlastnú záťaž na nízkej úrovni. Vplyv na vaše Core Web Vitals závisí od vašich stránok, hostingu a siete návštevníka, preto ho zmerajte na vlastnom webe namiesto preberania nášho údaja. Konkrétna rýchlosť načítania nie je zaručená – pozrite si oddiel 20 dokumentu Podmienky používania.

2. Rozlíšenia obrazovky & mobilné zariadenia

Dnešní používatelia prehliadajú web na všetkom od kompaktných smartfónov po ultraširoké počítačové monitory 4K. Weby automaticky presúvajú, skladajú a menia usporiadanie prvkov podľa šírky obrazovky — tento koncept sa nazýva responzívny webový dizajn.

Ako reprodukujeme presnú viditeľnú oblasť návštevníka

Aby prehrávanie nebolo skreslené, MousePlayer zaznamenáva presné rozmery viditeľnej oblasti návštevníka (napr. 390x844 pre smartfón alebo 1920x1080 pre počítačový monitor). Keď otvoríte prehrávač v režime kina, náš mechanizmus vytvorí izolované prostredie so zmenenou mierkou, ktoré presne odráža pôvodný pomer strán obrazovky návštevníka.

Stolové počítače & notebooky

Na bežných počítačoch zachytávame plynulý pohyb myši a navigáciu medzi kartami v rámci rovnakej relácie prehliadača. Ponuky otvárané podržaním ukazovateľa sa zobrazia v zázname vtedy, keď stránka pritom zmení svoj dokument; čisto CSS efekt pri podržaní ukazovateľa nie je v dokumente viditeľný a pri prehrávaní sa nereprodukuje.

Smartfóny & tablety

Dotykové obrazovky nemajú kurzor myši, ktorý sa vznáša nad prvkami. MousePlayer sa automaticky prispôsobí a zaznamenáva gestá ťuknutia, posúvanie potiahnutím a zmeny orientácie (na výšku alebo na šírku).

Zmena veľkosti počas relácie

Ak návštevník počas relácie otočí tablet alebo zmení veľkosť okna prehliadača na počítači, rozloženie webu sa dynamicky zmení. MousePlayer zachytí tieto udalosti a plynulo priebežne prispôsobuje prehrávaciu plochu, aby sa zachoval kontext interakcie.

3. Limity systému & technické hranice

Aby MousePlayer rešpektoval súkromie používateľov, zachoval bezpečnosť prehliadača a rýchle spracovanie údajov, funguje v rámci stanovených technických hraníc:

Hranica systému	Ako ju MousePlayer rieši
Rámce iFrame	Rámce iframe s rovnakým pôvodom ako vaša stránka sa zaznamenávajú spolu s obsahom aj interakciami vnútri. Vložený obsah iného pôvodu (napríklad prehrávače YouTube či platobné formuláre Stripe) nemožno zvnútra zaznamenať pre bezpečnostné pravidlá prehliadača (Same-Origin Policy); v prehrávaní sa zobrazí ako zástupný prvok a nenačítava sa tam.
Citlivé vstupné polia (PII)	Polia na heslá a platby sa maskujú na zariadení návštevníka pri každej úrovni maskovania a úplné maskovanie všetkých vstupov formulárov je predvolené pre každý web. Vidíte, že sa písalo, no nie to, čo bolo napísané. Platia dve obmedzenia: dve slabšie úrovne maskovania sa povoľujú iba s naším písomným súhlasom a maskovanie nikdy nepokrýva to, čo vaša vlastná stránka vypisuje do dokumentu – potvrdzovacia stránka zobrazujúca adresu je súčasťou snímky. Obe sú uvedené v dokumente Zmluva o spracúvaní osobných údajov.
Prvky canvas & WebGL	Obsah prvku canvas sa zaznamenáva ako obrázok: raz so snímkou stránky a potom pri každej zmene, najviac približne raz za sekundu a s limitom veľkosti. Plynulé animácie sa preto zobrazujú ako sled snímok. V maskovaných oblastiach ani pri prvkoch canvas obsahujúcich obrázky iného pôvodu sa obrázok neprenáša; obsah WebGL môže zostať prázdny.
Webové komponenty (Shadow DOM)	Otvorené korene shadow sa zaznamenávajú spolu s obsahom. Uzavreté korene shadow sú pre skripty neprístupné; ich obsah v prehrávaní chýba.
Prenos & úložisko prehliadača	Údaje sa odosielajú cez šifrované pripojenie WebSocket (HTTPS/WSS). Ak sa ho nepodarí nadviazať, napríklad pre proxy, skript použije náhradnú šifrovanú cestu HTTP; veľmi veľké snímky stránok sa nahrávajú samostatne cez HTTPS. MousePlayer nenastavuje žiadne súbory cookie; na vašom webe používa lokálne úložisko a úložisko relácie prehliadača.
Obdobia nečinnosti AFK	Ak návštevník nechá kartu otvorenú a odíde na 20 minút, náš mechanizmus automaticky rozpozná nečinnosť a pri prehrávaní skráti túto medzeru, aby ste nestrácali čas sledovaním nehybnej obrazovky.

Ako vám môžeme pomôcť?