Kaip veikia MousePlayer
Paprastas mūsų sekimo architektūros, įvairių įrenginių ekranų raiškų apdorojimo ir sistemos ribų vadovas.
1. Kodėl neįrašome vaizdo
Dažnai klaidingai manoma, kad vaizdinės analitikos įrankiai įrašo įprastus lankytojo ekrano vaizdo failus, pavyzdžiui, MP4 ar WebM. Tam reikėtų didelio duomenų pralaidumo, svetainė smarkiai sulėtėtų, o tekstas būtų neryškus ir neįskaitomas.
Vietoje to MousePlayer naudoja lengvą technologiją, vadinamą DOM būsenos kopijų telemetrija. Štai pagrindiniai jos veikimo principai:
Struktūros būsenos kopija
Lankytojui atidarius puslapį, mūsų scenarijus sukuria tekstinį HTML ir stilių struktūros „brėžinį“. Užfiksuoja elementų vietas nekopijuodamas puslapio vaizdų ar vaizdo failų; atkuriant leistuvė įkelia vaizdus iš jų pradinių adresų. Išimtis yra canvas elementai, kurių turinys perduodamas kaip vaizdas (žr. toliau).
Koordinačių telemetrija
Naudotojui sąveikaujant įrašome įvykių srautą: pelės padėtis, slinkimo gylį, paspaudimų taikinius ir naršyklės dydžio pakeitimus, taip pat paties puslapio pakeitimus ir, priklausomai nuo nustatymų, konsolės pranešimus, nepavykusias ar lėtas užklausas ir įkėlimo trukmės matavimus (Web Vitals). Judesių ir paspaudimų duomenys nedideli, o puslapio būsenos kopijos ir pakeitimai gali būti gerokai didesni, priklausomai nuo puslapio; jie perduodami suspausti.
Atkūrimas teatro režimu
Kai suvestinėje žiūrite seansą, mūsų leistuvė atkuria puslapį pagal įrašytą struktūrą ir realiuoju laiku judina virtualų žymeklį, išlaikydama visiškai ryškų tekstą.
Sukurta nedidelei apkrovai: scenarijus įkeliamas asinchroniškai ir vietoje vaizdo perduoda mažus skaitinius duomenis, todėl jo apkrova nedidelė. Poveikis Core Web Vitals priklauso nuo jūsų puslapių, prieglobos ir lankytojo tinklo, todėl matuokite savo svetainėje, o ne pasikliaukite mūsų skaičiumi. Konkreti įkėlimo sparta negarantuojama – žr. 20 skyrių dokumente „Naudojimo sąlygos“.
2. Ekranų raiškos & mobilieji įrenginiai
Šiandien naudotojai naršo viskuo: nuo mažų išmaniųjų telefonų iki itin plačių 4K monitorių. Svetainės automatiškai perstumia, sulanksto ir pertvarko išdėstymą pagal ekrano plotį; tai vadinama prisitaikančiu žiniatinklio dizainu.
Kaip atkartojame tikslią lankytojo matymo sritį
Kad atkūrimas nebūtų iškraipytas, MousePlayer įrašo tikslius lankytojo matymo srities matmenis (pvz., 390x844 išmaniajame telefone arba 1920x1080 kompiuterio monitoriuje). Atidarius teatro režimo leistuvę, mūsų variklis sukuria sumažintą izoliuotą aplinką, tiksliai atkartojančią pradinį lankytojo ekrano kraštinių santykį.
Stalinių & nešiojamųjų kompiuterių ekranai
Įprastuose kompiuteriuose fiksuojame nuolatinį pelės judėjimą ir naršymą keliose to paties naršyklės seanso kortelėse. Užvedus pelę atsidarantys meniu atkūrime matomi tada, kai dėl to puslapis pakeičia dokumentą; vien CSS užvedimo efektas dokumente nematomas ir atkūrime neatkartojamas.
Išmanieji telefonai & planšetės
Jutikliniai ekranai neturi virš jų judančio pelės žymeklio. MousePlayer automatiškai prisitaiko ir įrašo bakstelėjimus, slinkimą perbraukiant bei padėties pokyčius (stačią ar gulsčią).
Lango dydžio keitimo seanso metu iššūkis
Jei lankytojas seanso metu pasuka planšetę arba pakeičia naršyklės lango dydį kompiuteryje, svetainės išdėstymas dinamiškai keičiasi. MousePlayer užfiksuoja šiuos lango dydžio keitimo įvykius ir iš karto sklandžiai pritaiko atkūrimo sritį, išsaugodamas sąveikos kontekstą.
3. Sistemos ribos & techniniai apribojimai
Siekdamas gerbti naudotojų privatumą, išlaikyti naršyklės saugumą ir sparčiai apdoroti duomenis, MousePlayer veikia apibrėžtose techninėse ribose:
| Sistemos riba | Kaip ją apdoroja MousePlayer |
|---|---|
| iFrames | Tos pačios kilmės kaip jūsų puslapis iframe įrašomi kartu su turiniu ir sąveikomis viduje. Kitos kilmės įterpto turinio (pvz., YouTube leistuvių ar Stripe mokėjimo formų) vidaus įrašyti negalima dėl naršyklės saugumo taisyklių (Same-Origin Policy); atkūrime rodoma rezervuota vieta, o turinys ten neįkeliamas. |
| Jautrūs įvesties laukai (asmens identifikavimo duomenys) | Slaptažodžių ir mokėjimo laukai maskuojami lankytojo įrenginyje visais maskavimo lygiais, o visas visų formų įvesties maskavimas yra numatytasis kiekvienam objektui. Matote, kad buvo rašoma, bet ne tai, kas parašyta. Taikomos dvi ribos: du silpnesni maskavimo lygiai įjungiami tik gavus mūsų raštišką leidimą, o maskavimas niekada neapima to, ką pats jūsų puslapis išveda į dokumentą – patvirtinimo puslapis su adresu yra būsenos kopijos dalis. Abi ribos aprašytos dokumente „Duomenų tvarkymo sutartis“. |
| Canvas & WebGL elementai | Canvas turinys įrašomas kaip vaizdas: vieną kartą su puslapio būsenos kopija ir vėliau jam pasikeitus, ne dažniau kaip maždaug kartą per sekundę ir taikant dydžio ribą. Todėl sklandžios animacijos rodomos kaip kadrų seka. Maskuojamose srityse ar canvas elementuose su kitos kilmės vaizdais vaizdas neperduodamas; WebGL turinys gali likti tuščias. |
| Žiniatinklio komponentai (Shadow DOM) | Atviros šešėlinės šaknys įrašomos kartu su turiniu. Uždaros šešėlinės šaknys scenarijams nepasiekiamos; jų turinio atkūrime nėra. |
| Perdavimas & naršyklės saugykla | Duomenys siunčiami šifruotu WebSocket ryšiu (HTTPS/WSS). Jei jo užmegzti nepavyksta, pavyzdžiui, dėl tarpinio serverio, scenarijus pereina prie šifruoto HTTP kelio; labai didelės puslapių būsenos kopijos įkeliamos atskirai per HTTPS. MousePlayer nenustato slapukų; naudoja jūsų svetainės naršyklės vietinę ir seanso saugyklas. |
| Neaktyvūs AFK laikotarpiai | Jei lankytojas palieka atidarytą kortelę ir nueina 20 minučių, mūsų variklis automatiškai aptinka neveiklumą ir atkūrimo metu sutrumpina neveiklumo spragą, kad negaištumėte žiūrėdami į nejudantį ekraną. |