Ponowne wykorzystywanie banerów reklamowych w przewijanych plikach danych

W przypadku długich lub list z przewijaniem nieskończonym, takich jak kanały wiadomości lub strumienie (treści) w mediach społecznościowych, tworzenie baneru reklamowego dla każdej pozycji może prowadzić do dużego zużycia pamięci i opóźnień interfejsu. Aby zwiększyć wydajność, używaj recyklingu banerów, aby utrzymywać małą pamięć podręczną o stałym rozmiarze z instancjami BannerAd i ponownie wykorzystywać reklamy poza ekranem podczas przewijania przez użytkownika.

Na tej stronie znajdziesz informacje o określaniu rozmiaru pamięci podręcznej reklam, sprawdzaniu, czy instancja BannerAd znajduje się poza ekranem, oraz ponownym przypisywaniu reklam z pamięci podręcznej do pozycji na liście.

Obraz poniżej pokazuje, jak baner reklamowy poza ekranem wraca do pamięci podręcznej i jest ponownie używany na pozycji na liście, gdy użytkownik przewija stronę:

Wymagania wstępne

Zanim przejdziesz dalej, użyj banerów adaptacyjnych śródtekstowych w przypadku banerów przewijanych.

Śledzenie przypisanych pozycji na liście

Podczas przewijania przez użytkownika banery są ponownie wykorzystywane, co oznacza, że w pamięci przechowywana jest ograniczona liczba instancji BannerAd, które są przenoszone między pozycjami na liście.

Aby wiedzieć, którą reklamę ponownie wykorzystać, śledź, które miejsce na liście zajmuje każda reklama w pamięci podręcznej.

Zachowaj w widżecie ten stan:

• Pamięć podręczna o stałym rozmiarze zawierająca BannerAd instancji. Rozmiar pamięci podręcznej, który ustawisz, to maksymalna liczba reklam przechowywanych w pamięci jednocześnie.
• Interwał reklamowy, który określa, jak często reklama pojawia się na liście.
• Klasa pozycji Map, która łączy każdą instancję BannerAd z pozycją na liście, jaką zajmuje ta instancja. Gdy ponownie użyjesz reklamy, zaktualizuj wpis w tej Map klasie, aby wskazywał najnowszą pozycję.
• Klasa rozmiaru Map, która przechowuje obiekt AdSize rozwiązany przez platformę dla każdej wczytanej reklamy. Po wczytaniu reklamy znane są wysokości wbudowanych banerów adaptacyjnych.

W przykładzie poniżej śledzimy przypisane pozycje na liście dla każdej reklamy w pamięci podręcznej:

// Maximum number of banner ad instances kept in the cache.
static const int _cacheSize = 8;

// Spacing between banner ads. For example, index 0, 6, 12, and so on
// display ads.
static const int _adInterval = 6;

// The cache of allocated BannerAd instances.
final List<BannerAd> _banners = [];

// Maps each BannerAd instance to its currently assigned list item position.
final Map<BannerAd, int> _bannerPositions = {};

// Stores the platform-resolved size of each loaded banner ad.
final Map<BannerAd, AdSize> _bannerSizes = {};
inline_adaptive_banner_snippets.dart

Wybierz rozmiar pamięci podręcznej

Zwiększ rozmiar pamięci podręcznej powyżej maksymalnej liczby reklam, które mogą się wyświetlać na ekranie w tym samym czasie. Jeśli pamięć podręczna jest mniejsza, wybrana do ponownego użycia reklama jest często nadal widoczna, a aplikacja przydziela dodatkowe reklamy zamiast ponownie wykorzystywać te już wyświetlone.

Aby wybrać rozmiar:

1. Oszacuj, ile reklam zmieści się jednocześnie na ekranie, dzieląc wysokość widocznego obszaru przez wysokość jednego przedziału reklamy.
2. Dodaj miejsce na reklamy, które podczas szybkiego przewijania nadal się odłączają.
3. Jeśli zauważysz, że reklamy wybrane do ponownego wykorzystania nadal są wyświetlane na ekranie, zwiększ rozmiar pamięci podręcznej.

Przykład na tej stronie wyświetla reklamę co 6 wierszy i korzysta z pamięci podręcznej o rozmiarze 8. W tym przykładzie jest miejsce na kilka reklam widocznych jednocześnie na ekranie.

Sprawdzanie, czy reklama jest widoczna na ekranie

Wszystkie Google Mobile Ads Flutter Pluginklasy, które renderują widoki platformy, implementują klasę AdWithView i udostępniają getter isMounted. Zanim ponownie przypiszesz reklamę z pamięci podręcznej do pozycji na liście, sprawdź getter isMounted, aby potwierdzić, że reklama została przewinięta poza ekran i można jej bezpiecznie użyć ponownie.

Odzyskiwanie i ponowne wykorzystywanie banera reklamowego

Gdy lista zażąda banera w danym miejscu, wykonaj te czynności:

1. Ponownie użyj reklamy przypisanej już do tego miejsca, jeśli taka istnieje.
2. Jeśli pamięć podręczna nie jest pełna, wyślij żądanie reklamy.
3. Jeśli pamięć podręczna jest pełna, wybierz reklamę w pamięci podręcznej i sprawdź, czy getter isMounted ma wartość false, zanim ponownie przypiszesz reklamę.
4. Wywołaj metodę dispose() w przypadku każdej reklamy w pamięci podręcznej, gdy widżet zostanie usunięty z drzewa widżetów.

Poniższy przykład pokazuje, jak pobrać i ponownie wykorzystać baner reklamowy:

BannerAd _getRecycledBannerAd(BuildContext context, int bannerPosition) {
  // 1. If an ad is already mapped to this position, reuse it.
  final BannerAd? existingBanner = _bannerPositions.entries
      .firstWhereOrNull((entry) => entry.value == bannerPosition)
      ?.key;
  if (existingBanner != null) {
    return existingBanner;
  }

  // 2. If the cache is not full, allocate a new ad instance.
  if (_banners.length < _cacheSize) {
    final BannerAd newBanner = _createBannerAd(context);
    _banners.add(newBanner);
    _bannerPositions[newBanner] = bannerPosition;
    return newBanner;
  }

  // 3. Select an existing ad from the cache using modulo arithmetic.
  final BannerAd targetBanner = _banners[bannerPosition % _cacheSize];

  // 4. Verify the ad is detached from the screen before recycling.
  if (targetBanner.isMounted) {
    // If still on screen during fast scrolls, allocate a temporary instance.
    return _createBannerAd(context);
  } else {
    // Safe to reuse: reassign to the new position.
    _bannerPositions[targetBanner] = bannerPosition;
    return targetBanner;
  }
}
inline_adaptive_banner_snippets.dart

Pełny przykład znajdziesz w sekcji Google Mobile Ads Flutter Plugin przykład.