Informacje o interwencjach Chrome w zakresie obciążających reklam

Nour Nabil
Nour Nabil
LinkedIn
Rowan Merewood

Data publikacji: 22 września 2025 r., ostatnia aktualizacja: 7 stycznia 2026 r.

Dla użytkowników niewiele rzeczy jest bardziej frustrujących niż strona internetowa, która nagle zaczyna działać bardzo wolno, wyczerpuje baterię lub zużywa miesięczny limit danych. Czasami przyczyną nie jest treść, którą użytkownik chce zobaczyć, ale reklama wyświetlana w tle.

Aby chronić wygodę użytkowników, Chrome ogranicza zasoby, z których może korzystać reklama. Gdy reklama przekroczy te limity i stanie się obciążającą reklamą, Chrome ją zwalnia, aby zwolnić zasoby urządzenia.

Z tej dokumentacji dowiesz się, jak działa ta interwencja, jakie są konkretne progi i jakie sprawdzone metody możesz stosować, aby zapewnić płynne działanie reklam.

Czym jest interwencja związana z reklamami wykorzystującymi dużo zasobów?

Interwencja w przypadku reklam o dużym obciążeniu to mechanizm w Chrome, który monitoruje wykorzystanie zasobów przez ramki reklam. Jeśli reklama zużywa nieproporcjonalnie dużo przepustowości lub mocy obliczeniowej procesora, Chrome zwolni tę konkretną ramkę reklamy.

Zamiast reklamy użytkownik zobaczy szare pole z komunikatem Reklama została usunięta, któremu zwykle towarzyszy link Szczegóły z wyjaśnieniem, że reklama zużywała zbyt dużo zasobów.

Szare pole z napisem „Reklama została usunięta” i linkiem „Szczegóły”, które pojawia się zamiast reklamy o dużej wadze, która przekroczyła limity zasobów.
Przykładowy widok reklamy po usunięciu.

Kiedy reklama jest uznawana za „ciężką”?

Chrome uznaje reklamę za obciążającą na podstawie 3 określonych progów. Jeśli użytkownik nie wszedł w interakcję z reklamą i spełnia ona którekolwiek z tych kryteriów, zostanie ona usunięta:

  • Użycie sieci: reklama wykorzystuje ponad 4 MB przepustowości sieci.
  • Szczytowe użycie procesora: reklama używa głównego wątku przez ponad 15 sekund w dowolnym 30-sekundowym przedziale czasu.
  • Łączne wykorzystanie procesora: reklama używa głównego wątku przez ponad 60 sekund. Wszystkie zasoby używane przez dowolne podrzędne ramki iframe ramki reklamy są wliczane do limitów interwencji w tej reklamie.

Jakie są typowe przyczyny tej interwencji?

Niektóre typy zachowań reklamowych częściej niż inne wywołują te interwencje. Częste przyczyny to:

  • Nieskompresowane multimedia: wczytywanie bardzo dużych, słabo skompresowanych obrazów.
  • Intensywne użycie JavaScriptu: wykonywanie złożonych operacji, takich jak dekodowanie plików wideo za pomocą JavaScriptu.
  • Obciążające obliczenia: wykonywanie złożonych obliczeń w tle.
  • Treści wideo bez gestów: wczytywanie dużych plików wideo przed wejściem użytkownika w interakcję z reklamą.

Co się dzieje po usunięciu reklamy?

Gdy Chrome wykryje, że reklama przekroczyła progi dla reklam obciążających zasoby, podejmuje natychmiastowe działania w celu ochrony zasobów urządzenia użytkownika.

Wrażenia użytkownika

Z perspektywy użytkownika reklama jest natychmiast zwalniana. Zamiast niej Chrome wyświetla szare pole z komunikatem Reklama została usunięta. Jeśli użytkownik kliknie Szczegóły w kontenerze, zobaczy konkretne wyjaśnienie.

Wrażenia dewelopera

Chrome generuje też raport o interwencji za pomocą interfejsu Reporting API, aby poinformować Cię o tym, co się stało. Wcześniej te raporty były wysyłane tylko do samej ramki reklamy i jej ramek podrzędnych. Wydawcy często nie mieli jednak możliwości sprawdzenia, czy reklamy na ich stronach zostały usunięte. Aby rozwiązać ten problem, Chrome rozszerzył mechanizm raportowania. Raporty o interwencjach są teraz wysyłane do ramki osadzania (ramki nadrzędnej w stosunku do ramki reklamy głównej) oraz do samej ramki reklamy. Raporty wysyłane do ramki osadzającej zawierają identyfikator ramki podrzędnej i adres URL ramki reklamy.

Aby skonfigurować stronę pod kątem raportów HTTP, odpowiedź powinna zawierać nagłówek Report-To:

Reporting-Endpoints: default="https://example.com/reports"

Wywołane żądanie POST będzie zawierać raport podobny do tego:

POST /reports HTTP/1.1
Host: example.com
…
Content-Type: application/report

[{
 "type": "intervention",
 "age": 60,
 "url": "https://example.com/url/of/ad.html",
 "body": {
   "sourceFile": null,
   "lineNumber": null,
   "columnNumber": null,
   "id": "HeavyAdIntervention",
   "message": "Ad was removed because its CPU usage exceeded the limit. See https://www.chromestatus.com/feature/4800491902992384?utm_source=devtools"
 }
}]

Ramka osadzająca otrzyma podobny raport, zaadresowany na jej adres URL, ale wiadomość będzie dodatkowo zawierać identyfikator ramki podrzędnej i jej konkretny adres URL:

...
"message": "Ad was removed because its CPU usage exceeded the limit. See https://www.chromestatus.com/feature/4800491902992384?utm_source=devtools (id=123;url=http://example2.com/pre-redirect-ad-url.html)"
...

Interfejs JavaScript API udostępnia obiekt ReportingObserver z metodą observe(), której można używać do wywoływania podanego wywołania zwrotnego w przypadku interwencji. Może to być przydatne, jeśli chcesz dołączyć do raportu dodatkowe informacje, które pomogą w debugowaniu.

// callback that will handle intervention reports
function sendReports(reports) {
  for (let report of reports) {
    // Log the `report` json using your own reporting process
    navigator.sendBeacon('https://report.example/your-endpoint', report);
  }
}

// create the observer with the callback
const observer = new ReportingObserver(
  (reports, observer) => {
    sendReports(reports);
  },
  { buffered: true }
);

// start watching for interventions
observer.observe();

Interwencja powoduje odładowanie strony iframe (np. reklamy), dlatego użyj zdarzenia pagehide, aby mieć pewność, że wywołanie zwrotne raportowania przechwyci raport interwencji, zanim strona zniknie.

window.addEventListener('pagehide', (event) => {
  // pull all pending reports from the queue
  let reports = observer.takeRecords();
  sendReports(reports);
});

Wynikowy kod JSON ze skryptu JavaScript jest podobny do tego, który został wysłany w żądaniu POST:

[
  {
    type: 'intervention',
    url: 'https://example.com/url/of/ad.html',
    body: {
      sourceFile: null,
      lineNumber: null,
      columnNumber: null,
      id: 'HeavyAdIntervention',
      message:
        'Ad was removed because its network usage exceeded the limit. See https://www.chromestatus.com/feature/4800491902992384',
    },
  },
];

Sprawdzone metody dla deweloperów

Aby zapobiec wyświetlaniu reklam w formie banera z dużą ilością danych, stosuj te sprawdzone metody:

  • Wymagaj interakcji użytkownika w przypadku treści o dużej wadze: kryteria interwencji dotyczą reklam, z którymi użytkownik nie wszedł w interakcję. Jeśli użytkownik kliknie reklamę, limity zasobów przestają obowiązywać. W przypadku filmów i multimediów poczekaj na działanie użytkownika (np. „kliknij, aby odtworzyć”) przed wczytaniem dużych plików.
  • Optymalizuj obrazy i filmy: zadbaj o to, aby obrazy były skompresowane, a filmy zoptymalizowane pod kątem internetu. Unikaj automatycznego wczytywania dużych plików wideo. Zamiast tego używaj lekkich elementów zastępczych, dopóki użytkownik nie podejmie działania.
  • Sprawdź wykorzystanie procesora: złożone animacje lub operacje JavaScript, które wywołują ciągłe układanie i rysowanie, mogą powodować gwałtowny wzrost wykorzystania procesora. Używaj narzędzi do identyfikowania w kodzie wąskich gardeł, które mogą zajmować wątek główny przez dłuższy czas.
  • Monitoruj ramki podrzędne: pamiętaj, że liczba zasobów obejmuje wszystko, co znajduje się w elemencie iframe reklamy. Jeśli reklama wczytuje piksele śledzące lub ramki podrzędne firm zewnętrznych, ich wykorzystanie zasobów jest wliczane do limitu.
  • Odseparuj treści niebędące reklamami: oddziel ramki z treściami niebędącymi reklamami do różnych domen lub rozpoznawalnych wzorców, które prawdopodobnie nie będą uznawane za domeny reklamowe zgodnie z zasadami dostawcy listy filtrów.

Jak debugować i diagnozować przyczynę interwencji?

Aby skutecznie rozwiązywać problemy z interwencjami dotyczącymi reklam o dużej wadze, musisz najpierw zrozumieć, jak logika wykrywania w Chrome identyfikuje treści jako reklamy, a następnie użyć wbudowanych narzędzi dla programistów, aby sprawdzić konkretne wyzwalacze zasobów, które doprowadziły do usunięcia.

Jak Chrome wykrywa obecność reklamy?

Chrome oznacza treści jako reklamy, porównując żądania zasobów z listą filtrów. Logika wykrywania dotyczy treści w elementach iframe. Główna ramka strony nigdy nie jest uznawana za związaną z reklamą, nawet jeśli zawiera skrypty reklamowe. Pamiętaj, że element iframe załadowany z zasobu pasującego do listy filtrów będzie uznawany za reklamę, nawet jeśli z tej ramki są też ładowane inne treści, które nie są reklamami. Przykładem może być odtwarzacz wideo wczytany w elemencie iframe oznaczonym jako reklama, który może też wczytywać treści inne niż reklamy.

Jak sprawdzić wykrywanie reklam?

Jako deweloper możesz wizualnie sprawdzić, czy Chrome prawidłowo wykrył Twoje treści jako reklamę, korzystając z Narzędzi deweloperskich w Chrome.

  • Wyróżnianie ramek reklam: w panelu Renderowanie kliknij Wyróżnij ramki reklam. Wykryte ramki reklam zostaną wyróżnione na ekranie kolorem czerwonym.
  • Adnotacja elementu: w panelu Elementy wykryte ramki iframe reklam będą wyświetlać adnotację reklamy obok tagu otwierającego <iframe>.
  • Aktywność sieciowa: w panelu Sieć możesz filtrować żądania na podstawie wartości logicznej Is ad-related.
  • Stan reklamy: w panelu aplikacji w sekcji Ramki ramki z tagami reklam będą zawierać atrybut Ad Status.

Jak zdiagnozować przyczynę interwencji?

Chrome udostępnia narzędzia do kontrolowania i poprawiania jakości oraz wydajności stron internetowych. Uruchom Lighthouse w Narzędziach deweloperskich w Chrome, aby uzyskać raporty o wydajności strony. Możesz też zapoznać się z kolekcją web.dev/fast i dowiedzieć się więcej o Web Vitals.

Wykorzystanie sieci

Otwórz panel Sieć w Narzędziach deweloperskich w Chrome, aby zobaczyć ogólną aktywność sieciową reklamy. Zaznacz opcję Disable cache (Wyłącz pamięć podręczną), aby uzyskać spójne wyniki przy wielokrotnym wczytywaniu.

Panel Sieć w Narzędziach deweloperskich w Chrome pokazujący zarejestrowaną aktywność sieciową z włączoną opcją „Wyłącz pamięć podręczną”.
Panel Sieć w Narzędziach deweloperskich.

Przeniesiona wartość u dołu strony będzie zawierać kwotę przeniesioną dla całej strony. Aby ograniczyć liczbę żądań tylko do tych, które są związane z reklamą, użyj pola Filtruj u góry.

Jeśli znajdziesz pierwotne żądanie reklamy, np. źródło elementu iframe, użyj karty „Inicjator” w żądaniu, aby wyświetlić wszystkie żądania, które ono wywołuje.

Karta „Inicjator” w Narzędziach deweloperskich pokazująca sekwencję żądań zasobów wywołanych przez konkretną ramkę reklamy.
Karta Inicjator dla żądania.

Posortowanie ogólnej listy żądań według rozmiaru to dobry sposób na wykrycie zbyt dużych zasobów. Częstą przyczyną są obrazy i filmy, które nie zostały zoptymalizowane.

Lista w panelu Sieć w Narzędziach deweloperskich jest posortowana według rozmiaru odpowiedzi, co pozwala zidentyfikować duże, niezoptymalizowane pliki multimedialne.
Sortuj prośby według rozmiaru odpowiedzi.

Sortowanie według nazwy może też pomóc w wykryciu powtarzających się żądań. Interwencję może wywołać nie pojedynczy duży zasób, ale duża liczba powtarzających się żądań, które stopniowo przekraczają limit.

Wykorzystanie procesora

Panel Wydajność w Narzędziach deweloperskich pomoże Ci zdiagnozować problemy z użyciem procesora. Otwórz menu ustawień nagrywania. Użyj menu CPU, aby jak najbardziej spowolnić procesor. Interwencje dotyczące procesora są znacznie częściej wywoływane na urządzeniach o mniejszej mocy niż na zaawansowanych maszynach deweloperskich.

Ustawienia przechwytywania w panelu Wydajność w Narzędziach deweloperskich z wybranym menu ograniczania procesora, aby symulować sprzęt o mniejszej mocy z 6-krotnym spowolnieniem.
Włącz ograniczanie przepustowości sieci i wykorzystania procesora w panelu Wydajność.

Następnie kliknij przycisk Nagrywaj, aby rozpocząć rejestrowanie aktywności. Możesz eksperymentować z czasem i długością nagrywania, ponieważ wczytanie długiego śladu może zająć sporo czasu. Po załadowaniu nagrania możesz użyć górnej osi czasu, aby wybrać fragment nagrania. Skup się na obszarach wykresu w kolorze żółtym, fioletowym lub zielonym, które reprezentują skrypty, renderowanie i rysowanie.

podsumowanie śledzenia wydajności w Narzędziach deweloperskich z wykresem kołowym przedstawiającym czas poświęcony na różne działania, takie jak wczytywanie, skryptowanie, renderowanie i rysowanie.
Podsumowanie logu czasu w panelu Wydajność.

U dołu znajdziesz karty Od dołu do góry, Drzewo wywołań i Dziennik zdarzeń. Sortowanie tych kolumn według wartości Self Time (Czas własny) i Total Time (Czas całkowity) może pomóc w identyfikacji wąskich gardeł w kodzie.

Karta Od dołu w panelu Wydajność posortowana według opcji „Czas własny”, aby wskazać konkretne wąskie gardła.
Na karcie Od dołu do góry posortuj według czasu własnego.

Jest tam też link do powiązanego pliku źródłowego, dzięki czemu możesz przejść do panelu Źródła i sprawdzić koszt każdej linii.

Czas wykonania widoczny w panelu Źródła.
Czas wykonywania widoczny w panelu Źródła.

Typowe problemy, na które warto zwrócić uwagę, to źle zoptymalizowane animacje, które powodują ciągłe zmiany układu i renderowanie, lub kosztowne operacje ukryte w dołączonej bibliotece.

Jak zgłosić nieprawidłowe interwencje?

Jeśli treści niebędące reklamami zostały otagowane jako takie, rozważ zmianę kodu, aby uniknąć dopasowania do reguł filtrowania, lub skontaktuj się bezpośrednio z osobami zarządzającymi EasyList, aby zmienić reguły filtrowania. Pamiętaj, że interwencja dotycząca reklam o dużej wadze nie ma wpływu na ramki z gestem użytkownika, więc film można wykluczyć, wymagając kliknięcia przycisku odtwarzania przed załadowaniem treści. Jeśli EasyList nie pasuje do Twoich treści, a Chrome w jakiś sposób błędnie zaklasyfikował je jako związane z reklamami, możesz zgłosić problem w Chrome, korzystając z tego szablonu. Zgłaszając problem, dołącz przykładowy zrzut ekranu raportu o interwencji oraz przykładowy adres URL, który pozwoli odtworzyć problem.