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

Nour Nabil
Nour Nabil
LinkedIn
Rowan Merewood

Opublikowano: 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 winowajcą nie są treści, które użytkownik chce zobaczyć, ale reklama działająca w tle.

Aby chronić wrażenia użytkowników, Chrome ogranicza zasoby, których może używać reklama. Gdy reklama przekroczy te limity i stanie się reklamą wykorzystującą dużo zasobów, Chrome ją wyładuje, aby zwolnić zasoby urządzenia.

Z tego dokumentu dowiesz się, jak działa ta interwencja, jakie są konkretne progi i jakie sprawdzone metody możesz stosować, aby reklamy działały płynnie.

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

Interwencja związana z reklamami wykorzystującymi dużo zasobów 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 wyładuje 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 informacją, ż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ę w miejscu reklamy o dużej wadze, która przekroczyła limity zasobów.
Przykład widoku reklamy po usunięciu.

Kiedy reklama jest uznawana za wykorzystującą dużo zasobów?

Chrome uznaje reklamę za wykorzystującą dużo zasobów na podstawie 3 konkretnych progów. Jeśli użytkownik nie wszedł w interakcję z reklamą i spełnia ona dowolne z tych kryteriów, zostanie wyładowana:

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

Jakie są typowe przyczyny tej interwencji?

Niektóre typy zachowań reklam częściej niż inne powodują te interwencje. Do typowych przyczyn należą:

  • Nieskompresowane multimedia: wczytywanie bardzo dużych, słabo skompresowanych obrazów.
  • Duże obciążenie JavaScriptem: wykonywanie rozbudowanych operacji, takich jak dekodowanie plików wideo za pomocą JavaScriptu.
  • Duże obciążenie obliczeniami: wykonywanie złożonych obliczeń w tle.
  • Treści wideo bez gestów: wczytywanie dużych plików wideo, zanim użytkownik wejdzie w interakcję z reklamą.

Co się dzieje, gdy reklama zostanie usunięta?

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

Wrażenia użytkowników

Z perspektywy użytkownika reklama jest natychmiast wyładowywana. W jej miejsce 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 deweloperów

Chrome generuje też raport o interwencji za pomocą 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 dowiedzenia się, że reklamy na ich stronach zostały usunięte. Aby rozwiązać ten problem, Chrome rozszerzył mechanizm raportowania. Raporty o interwencji są teraz wysyłane do ramki osadzającej (nadrzędnej ramki głównej ramki reklamy) oprócz samej ramki reklamy. Raporty wysyłane do ramki osadzającej zawierają identyfikator ramki podrzędnej i adres URL ramki reklamy.

Aby skonfigurować stronę do 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, skierowany na adres URL ramki osadzającej, ale wiadomość będzie dodatkowo zawierać identyfikator ramki podrzędnej i konkretny adres URL ramki podrzędnej:

...
"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 API JavaScript udostępnia ReportingObserver z metodą observe(), której można użyć do wywołania 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();

Ponieważ interwencja wyładowuje stronę iframe (np. reklamę), użyj zdarzenia pagehide, aby mieć pewność, że wywołanie zwrotne raportowania przechwyci raport o interwencji, zanim strona zniknie.

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

Wynikowy kod JSON z JavaScriptu jest podobny do tego, który jest wysył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 pod banerem reklam wykorzystujących dużo zasobów, stosuj te sprawdzone metody:

  • Wymagaj interakcji użytkownika w przypadku treści wykorzystujących dużo zasobów: kryteria interwencji dotyczą reklam, z którymi użytkownik nie wszedł w interakcję. Jeśli użytkownik kliknie lub dotknie Twoją reklamę, limity zasobów przestaną obowiązywać. W przypadku filmów i rich mediów poczekaj na gest użytkownika (np. „kliknij, aby odtworzyć”) przed wczytaniem zasobów wykorzystujących dużo zasobów.
  • Optymalizuj obrazy i filmy: upewnij się, że obrazy są 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 wejdzie w interakcję.
  • Sprawdzaj wykorzystanie procesora: złożone animacje lub operacje JavaScript, które powodują ciągłe układanie i rysowanie, mogą powodować wzrost wykorzystania procesora. Używaj narzędzi do identyfikowania wąskich gardeł w kodzie, które mogą zajmować wątek główny przez długi czas.
  • Monitoruj ramki podrzędne: pamiętaj, że liczba zasobów obejmuje wszystko w ramce iframe reklamy. Jeśli reklama wczytuje piksele śledzące przez inne firmy lub ramki podrzędne, ich wykorzystanie zasobów jest wliczane do limitu.
  • Izoluj treści inne niż reklamy: oddziel ramki z treściami innymi niż reklamy do różnych domen lub rozpoznawalnych wzorców, które zgodnie z zasadami dostawcy listy filtrów nie będą uznawane za domeny reklamowe.

Jak debugować i diagnozować przyczynę interwencji?

Aby skutecznie rozwiązywać problemy z interwencjami związanymi z reklamami wykorzystującymi dużo zasobów, musisz najpierw zrozumieć, jak logika wykrywania Chrome identyfikuje treści jako reklamy, a następnie użyć wbudowanych narzędzi dla deweloperów, aby sprawdzić konkretne przyczyny wykorzystania zasobów, które doprowadziły do usunięcia.

Jak Chrome wykrywa obecność reklamy?

Chrome oznacza treści jako reklamy, dopasowując żądania zasobów do listy filtrów. Logika wykrywania dotyczy treści w ramkach iframe. Główna ramka strony nigdy nie jest uznawana za związaną z reklamami, nawet jeśli zawiera skrypty reklamowe. Pamiętaj, że ramka iframe wczytana z zasobu pasującego do listy filtrów będzie uznawana za reklamę, nawet jeśli z tej ramki są też wczytywane inne treści, które nie są reklamami. Przykładem może być odtwarzacz wideo wczytany w ramce iframe oznaczonej 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 reklamy, za pomocą Narzędzi deweloperskich w Chrome.

  • Wyróżnianie ramek reklam: w panelu Renderowanie wybierz Wyróżnij ramki reklam, aby oznaczyć wykryte ramki reklam 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ść sieci: w panelu Sieć filtruj żądania na podstawie wartości logicznej Is ad-related.
  • Stan reklamy: w panelu Aplikacja w sekcji Ramki ramki oznaczone jako reklamy będą zawierać atrybut Ad Status.

Jak zdiagnozować przyczynę interwencji?

Chrome udostępnia narzędzia do sprawdzania 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ę Wyłącz pamięć podręczną , aby uzyskać spójne wyniki przy powtarzających się wczytywaniach.

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.

Wartość przeniesiona u dołu strony pokazuje ilość danych przeniesionych na całą stronę. Aby ograniczyć żądania tylko do tych, które są związane z reklamą, użyj pola Filtruj u góry.

Jeśli znajdziesz początkowe żądanie reklamy, np. źródło ramki iframe, użyj karty Inicjator w żądaniu, aby zobaczyć 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 żądania.

Posortowanie ogólnej listy żądań według rozmiaru to dobry sposób na wykrycie zbyt dużych zasobów. Do typowych przyczyn należą 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.
Sortowanie żądań według rozmiaru odpowiedzi.

Sortowanie według nazwy może też być dobrym sposobem na wykrycie powtarzających się żądań. Przyczyną interwencji może być 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 zdiagnozować problemy z wykorzystaniem procesora. Otwórz menu Ustawienia przechwytywania. Użyj menu Procesor , 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 procesora w panelu Wydajność.

Następnie kliknij przycisk Nagraj, aby rozpocząć nagrywanie aktywności. Możesz eksperymentować z tym, kiedy i jak długo nagrywasz, ponieważ wczytanie długiego śladu może zająć sporo czasu. Po wczytaniu nagrania możesz użyć górnej osi czasu, aby wybrać jego fragment. 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 śladu w panelu Wydajność.

U dołu znajdziesz karty Od dołu, Drzewo wywołań i Dziennik zdarzeń. Posortowanie tych kolumn według Czasu własnego i Czasu całkowitego 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.
Sortowanie według czasu własnego na karcie Od dołu.

Powiązany plik źródłowy jest też tam połączony, dzięki czemu możesz przejść do panelu Źródła , aby sprawdzić koszt każdej linii.

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

Typowe problemy, na które należy zwrócić uwagę, to słabo zoptymalizowane animacje, które powodują ciągłe układanie i rysowanie, lub kosztowne operacje ukryte w dołączonej bibliotece.

Jak zgłosić nieprawidłowe interwencje?

Jeśli treści inne niż reklamy zostały oznaczone jako reklamy, rozważ zmianę kodu, aby uniknąć dopasowania do reguł filtrowania, lub skontaktuj się bezpośrednio z osobami odpowiedzialnymi za EasyList, aby zmienić reguły filtrowania. Pamiętaj, że interwencja związana z reklamami wykorzystującymi dużo zasobów nie ma wpływu na ramki z gestem użytkownika, więc można wykluczyć filmy, wymagając kliknięcia przycisku odtwarzania przed wczytaniem treści. Jeśli EasyList nie pasuje do Twoich treści, a Chrome w jakiś sposób błędnie zaklasyfikował treści jako związane z reklamami, możesz zgłosić problem w Chrome, korzystając z tego szablonu. Podczas zgłaszania problemu dołącz przechwycony przykład raportu o interwencji i przykładowy adres URL, aby odtworzyć problem.