Tracker.ru На главную

Pixel diff-пен сайтты скриншот-мониторинг — Tracker.ru

Скриншот-мониторинг — автоматты бет суреттері және pixel diff арқылы попикселді салыстыру. HTTP-чек ұстамайтын инциденттер класын жабады: деплойдан кейін визуалды регрессия, дефейс, антибот-стуб, контентті алмастыру, құлаған JS-бандл. Tariffs Basic пен Pro-да қол жетімді.

Сайтты скриншот-мониторинг Tracker.ru-да — бұл автоматты бет суреттері және pixel diff арқылы попикселді салыстыру. Беттің сыртқы түрі белгіленген шектен қаттырақ өзгерсе, жаңа скриншотпен және белгіленген өзгерген аумақтармен бірге хабарлама келеді. Бұл әдеттегі HTTP-чек ұстамайтын инциденттер класын жабады: сервер 200 OK қайтарады, ал пайдаланушы ақ экранды, Cloudflare антибот-стубын, құлаған JS-бандлды, алмастырылған төлем формасын немесе дефейсті көреді.

Сіздің тапсырмаңыз сайтты скриншоттармен мониторингтеу, сайттың визуалды өзгерістерін мониторингтеу немесе релиздер арасындағы беттеу өзгерістерін мониторингтеу болса — бұл лендинг /features/screenshot-monitoring функциясы туралы. Алгоритмнің техникалық егжей-тегжейлеріне /docs/features/screenshots-те, тарифтер туралы — /pricing-та қараңыз.

Скриншот-мониторинг дегеніміз не және ол не үшін қажет?

Әдеттегі uptime-мониторинг HTTP-статусты тексереді: 200 OK келді — сайт жұмыс істейді деген сөз. Іс жүзінде бұл жеткіліксіз. Сервер дұрыс статуспен жауап беруі мүмкін, ал нақты пайдаланушы — мүлдем басқа бетті көреді: негізгі JS-бандл құлағаннан кейін бос экранды, «Төлем формасы уақытша қол жетімсіз» жазуын, Cloudflare CAPTCHA-стенасын немесе CDN-нен жоғалған шрифттерден шашыраңқы беттеуді.

Сайтты скриншот-мониторинг бұл соқыр аймақты шешеді. Скриншот-мониторинг — бұл беттің тұрақты суреттері және алдыңғы нұсқамен попикселді салыстыру. Сыртқы түрі белгіленген шектен қаттырақ өзгерсе — пайдаланушы екі суретпен бірге хабарлама алады: «болды» және «болды». Ағылшын әдебиетінде бұл тапсырмалар класы screenshot monitoring, visual regression monitoring немесе screenshot diff service деп аталады — бір функция әр түрлі формулировкалармен.

Tracker.ru-да скриншот-мониторинг әдеттегі uptime-қа кіріктірілген: үшінші тарап сервисті қосу, Playwright-ті орналастыру немесе pipeline-ды жинау керек емес. URL бетіндегі ауыстырғышпен қосылады, HTTP-тексерулермен қатар жұмыс істейді, Telegram, email және webhook-тардағы хабарламалардың сол бір балансын пайдаланады.

Pixel diff визуалды өзгерістерді қалай детектирлейді?

Tracker.ru-дағы сайт pixel diff классикалық және болжамды алгоритм бойынша жұмыс істейді, ML-эвристикасыз: әр пиксель арналар бойынша 10 бірлік допускпен төрт RGBA арнасы бойынша салыстырылады — бұл шрифттердің антиаласынгінің шуын және PNG-сығудың микро артефактілерін кесу үшін жеткілікті. Айырмашылықты пиксельдер байланыс бойынша топтасады, шағын топтар (100 пикселден аз) шу ретінде шығарылады — курсордың миршілдігі, бір пиксельге жылжытылған көлеңке, миршілдеген жарнамалық плейсхолдер. Қорытынды өзгеріс пайызы 0.01%-ке дейін дөңгелектеледі және нақты URL үшін белгіленген шегімен салыстырылады.

Егер pixel diff шектен асып кетсе, хабарламаға тек сан ғана емес, diff-сурет те қосылады: өзгерген аумақтардың қызыл бөлектемесімен бастапқы скриншот. Бұл pixel diff сервисінің негізгі тапсырмасын шешеді — жарты секундта нақты не өзгергенін көрсету, әзірлеушіні «болды/болды» қолмен салыстыруға мәжбүрлемей. Алгоритм қадамдарының, параметрлер мен шектердің егжей-тегжейлі қадамдық сипаттамасы — /docs/features/screenshots-те.

Скриншот-мониторинг қашан құтқарады: 6 нақты сценарий

Pixel diff мониторингі продакшнда жүйелі түрде кездесетін нақты инциденттерді жабады — олардың әрқайсысы пайдаланушылардың шағымдары арқылы білгенше сағаттар жұмыс істемей тұруы немесе конверсия жоғалуын қажет етеді.

1. Деплойдан кейінгі visual regression. Релиз жаңа сборка шығарды, css сынды — басты бетте отступтар жылжыды, тақырып viewport-тан тыс жылжыды, сатып алу батырмасы footer-дың астына жасырылды. Сервер 200 OK жауап береді, конверсия аналитикасы тек бірнеше сағаттан кейін ғана құлдырауды көрсетеді. Скриншот-мониторинг айырмашылықты келесі суреттен кейін бірден көреді: diff-суретпен хабарлама пайда болады, әзірлеуші релизді минут ішінде кері қайтарады.

2. Дефейс немесе контентті алмастыру. Бетте күтпеген баннер пайда болады, JS-редирект үшінші тарап доменіне, инжектирленген майнинг скрипті. HTTP-чек «біздің» басты бетті «біздің емес»-тен ажыратпайды — ол да 200 жауап береді. Pixel diff визуалды өзгеріс фактісін тіркейді және бетті өзгертілген деп белгілейді, бұл security-периметр үшін сын. Сайт дефейсінің pixel-diff бойынша мониторингі — лендингтерге, төлем формаларына және жеке кабинеттерге жиі қолданылатын жұмыс тәжірибесі.

3. Антибот-стуб / контент орнына CAPTCHA. Cloudflare немесе ішкі WAF қорғаныс режимін қосты. Нақты пайдаланушы «Checking your browser…» немесе CAPTCHA-ны көреді — бірақ HTTP-статус формальды түрде 200 күйінде қалады. Скриншот мұны бірден көрсетеді: әдеттегі басты бет орнына — тексерумен сұр бет.

4. Құлаған JS-бандл және бос root. JS-те қате, react бар CDN-ның құлауы, нұсқалар арасындағы конфликт — <div id="app"> бос болып қалды. HTML берілді, JS ілінді, сайт визуалды бос. «Жұмыс істейтін» сурет пен бос беттің арасындағы pixel diff — шамамен 100%, хабарлама бірден келеді.

5. 404 ассеттер және шашыраңқы беттеу. Деплой CSS-бандлды атауын өзгертті, ескі жол HTML-да қалды, шрифттер жоғалды. Сайт жұмыс істейді, бірақ 1998 жылдың сайты сияқты көрінеді. Бұл сайттың беттеу өзгерістерін тексеру үшін типтік жағдай — HTTP-чек ештеңе байқамайды, скриншот бірден байқайды.

6. Төлем формасын алмастыру. Stripe / CloudPayments / басқа провайдер «уақытша қол жетімсіз» режиміне ауысып, карта өрістері орнына стуб салды. Төлемге конверсия нөлге айналады, командадан ешкім неге екенін түсінбейді. Pixel diff форманың визуалды блогы өзгергенін көреді және аумақты бөлектейді.

Бұл жағдайлардың әрқайсысында ортақ үлгі бір: HTTP-тексеру 200 қайтарады, логтар бойынша диагностика ақпараттық емес, мәселені тек тірі пайдаланушы көреді. Скриншот-мониторинг дәл осы «сайт қазір қалай көрінеді» тексеруін автоматтандырады.

Tracker.ru Checkly, BrowserStack, Uptime Kuma + Playwright-тан немен ерекшеленеді?

Нарықта скриншоттармен жұмыс істей алатын бірнеше сервис бар, бірақ олардың мақсаттары мен бағалары әр түрлі.

Checkly. Күшті synthetic-мониторинг сервисі. Visual regression / screenshot diff — Team-планының функциясы, ол айына $64-тен басталады (Starter-те $24-те бұл функция қосылмаған; деректер 2026-05-те өзекті). Тек доллармен төлем, ресейлік төлем әдістерінсіз. Browser checks үшін Checkly-ді қазірден қолданып жатқан және скриншоттарға бөлек сервис қалағамайтын командалар үшін келеді.

BrowserStack. Әр түрлі браузерлердегі қолмен және автоматты QA-ға арналған. Бұл uptime-құрал емес: BrowserStack продта беттеу шашырап кетсе, дежурный мамаға түнде дабыл соқпайды. Pre-release тестілеу үшін жақсы, бірақ продакшнда үздіксіз тексеру үшін емес.

Uptime Kuma + Playwright. Self-hosted байланысы: лицензия бойынша тегін, бірақ pixel-diff қораптан жоқ — қолмен жинау керек (сценарийлер, скриншоттарды сақтау, салыстыру қозғалтқышы, хабарламалар, Chromium-мен инфрақұрылым, жаңартулар). Өз мониторинг құралына инженерлік сағаттарды салуға дайын командалар үшін келеді.

Tracker.ru. Скриншот-мониторинг әдеттегі uptime-қа кіріктірілген — бөлек сервис емес, бөлек жазылым емес. Рубльде төлем, нативті Telegram-бот, орыс және қазақ тіліндегі қолдау диалогы. Сайтты қалпына келтіру туралы хабарламаға автоматты түрде жаңа скриншот қосылады — дежурный беттеу қалпына келгеннен кейін қалай көрінетінін бірден көру үшін. Тіркелген рубль тарифтері мен өз pipeline құрусыз жылдам интеграция маңызды ресейлік командалар мен еуразиялық периметрдегі компанияларға бағытталған.

Тарифтерде қанша тұрады және қандай лимиттер?

Скриншот-мониторинг ақылы тарифтерде қол жетімді. Лимит екі саннан тұрады: бір уақытта қанша монитор скриншот ала алады және айына барлығы қанша скриншот жасалады.

Тариф Скриншоты бар мониторлар Айдағы скриншоттар Бағасы
Free 0 0 0 ₽
Basic 2 10 290 ₽/ай
Pro 10 50 790 ₽/ай

Free тарифінде скриншоттар кірмейді — ол базалық uptime-мониторингке келеді. Basic пен Pro-да қажетті URL-дер үшін скриншоттарды қосуға және жиілікті таңдауға болады: 1, 6, 12 немесе 24 сағат (бұл барлық қол жетімді мәндер, скриншоттар үшін жиірек интервалдар қарастырылмаған — pixel diff әр кадрға лезде реакция үшін емес, мерзімді бақылау үшін жасалған). Қосымша инциденттен кейін сайт қалпына келгенде хабарламаға автоматты түрде жаңа сурет қосылады — ол тарифтің жалпы квотасын жұмсайды.

Скриншот-мониторингті қосу

Тарифтер мен төлем туралы толығырақ — /pricing бетінде. Кастомды лимиттер қажет болса — қолдауға жазыңыз.

Көп қойылатын сұрақтар

Визуалды мониторинг әдеттегі uptime-мониторингтен немен ерекшеленеді?

HTTP-тексеру сервердің жауап кодын қарайды: 200 OK келді — формальды түрде бәрі жұмыс істейді. Скриншот-мониторинг беттің пайдаланушыға қалай көрінетінін қарайды. 200 OK плюс ақ экран, антибот-стуб немесе алмастырылған төлем формасы — бұл тек pixel diff қана ұстайтын инцидент. Шын мәнінде бұл бақылаудың екі түрлі деңгейі: HTTP-тексеру «сервер бетті береді ме?» деген сұраққа жауап береді, скриншот — «бет тиісінше көрінеді ме?»

Скриншот-мониторинг арқылы дефейсті ұстауға бола ма?

Иә. Беттегі кез келген көрінетін өзгеріс — баннер, күтпеген JS-инжект, логотипті алмастыру, JS арқылы редирект — pixel diff-ке түседі және URL баптауларында белгіленген шектен асып кетсе, хабарламаны шақырады. Лендингтер мен төлем беттері үшін әдетте төмен шек қояды (1–5%), динамикалық басты беттер үшін — жоғары (10–20%), өзгеретін блоктарға жалған іске қосылулар алмау үшін.

Скриншоттар әр түрлі аймақтардан жасала ма?

Жоқ. msk/eu және басқа аймақтардан URL-ді сұрайтын HTTP-тексерулерден айырмашылығы, скриншоттарды бір бөлінген орыннан жасайды. Әр URL-ге бір скриншот алынады, әр аймақтан біреу емес. Бұл саналы түрде жасалған: pixel diff аймақтар арасында емес, бір URL-дің дәйекті суреттері арасында уақыт бойынша есептеледі — осылайша уақытша өзгерістер детектирленеді, рендеринг гео-тәуелділіктері емес.

Қандай тарифтерде қанша скриншот?

Free-де скриншоттар жоқ — 0 монитор және айына 0 сурет. Basic-те 290 ₽/ай үшін 2 монитор үшін айына 10 скриншот қол жетімді. Pro-да 790 ₽/ай үшін — 10 монитор үшін айына 50 скриншот. Толығырақ /pricing бетінде.

Ағылшын тілінде visual regression monitoring және screenshot diff service дегеніміз не?

Бұл бір тапсырманың синонимдері. Screenshot monitoring — жалпы термин, visual regression monitoring деплойдан кейінгі регрессияға фокусты ерекшелейді, screenshot diff service pixel-diff құралына екпін салады. Tracker.ru осы үш формулировканың бәрін жабады — скриншоттарды тұрақты және қалпына келу кезінде жасаймыз, URL-дағы шектің нәзік баптауымен pixel diff-ті есептейміз, diff-суреттерді хабарламаларға жібереміз.

Скриншот қашан нақты жасалады?

Кесте бойынша — таңдау бойынша 1, 6, 12 немесе 24 сағат (бұл төрт тіркелген пресет, жиірек интервалдар қарастырылмаған). Қосымша — инциденттен кейін сайт қалпына келгенде: жылдам визуалды тексеру үшін recovery хабарламасында жаңа скриншот болуы үшін. Сайт құлағанда скриншот автоматты түрде жасалмайды — триггер тек recovery, желілік тұрақсыздық сәтінде шулы суреттер шығармау үшін.

Нақты URL үшін скриншоттарды өшіруге бола ма?

Иә. URL бетінің «Скриншоттар» бөлімінде ауыстырғыш бар: лимит=0 — суреттер жасалмайды, осы URL үшін тарифтің квотасы жұмсалмайды. Осылайша өте динамикалық беттер үшін (жаңалықтар сайтының басты беті, графиктер бар дашборд) скриншоттарды өшіру ыңғайлы, олардағы pixel diff бойынша кез келген салыстыру нәтижесінде шулы болады.


Сайттың визуалды өзгерістерін мониторингті қосу — /sign-up. Pixel diff алгоритмінің техникалық егжей-тегжейлері мен параметрлері — /docs/features/screenshots құжаттамасында. Тарифтерді салыстыру — /pricing.