nodebb-plugin-ezoic-infinite 1.5.68 → 1.5.70

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nodebb-plugin-ezoic-infinite",
-  "version": "1.5.68",
+  "version": "1.5.70",
   "description": "Production-ready Ezoic infinite ads integration for NodeBB 4.x",
   "main": "library.js",
   "license": "MIT",

package/public/client.js

@@ -5,63 +5,41 @@
   const $ = (typeof window.jQuery === 'function') ? window.jQuery : null;
 
   // IMPORTANT: must NOT collide with Ezoic's own markup (they use `.ezoic-ad`).
-  // If we reuse that class, cleanup/pruning can delete real ads and cause
-  // "placeholder does not exist" spam + broken 1/X insertion.
   const WRAP_CLASS = 'nodebb-ezoic-wrap';
   const PLACEHOLDER_PREFIX = 'ezoic-pub-ad-placeholder-';
+  const POOL_ID = 'nodebb-ezoic-placeholder-pool';
 
-  // Insert at most N ads per run to keep the UI smooth on infinite scroll
+  // Smoothness caps
   const MAX_INSERTS_PER_RUN = 3;
 
-  // Preload before viewport (earlier load for smoother scroll)
+  // Preload margins
   const PRELOAD_MARGIN_DESKTOP = '2600px 0px 2600px 0px';
   const PRELOAD_MARGIN_MOBILE = '1500px 0px 1500px 0px';
-
-  // When the user scrolls very fast, temporarily preload more aggressively.
-  // This helps ensure ads are already in-flight before the user reaches them.
   const PRELOAD_MARGIN_DESKTOP_BOOST = '4200px 0px 4200px 0px';
   const PRELOAD_MARGIN_MOBILE_BOOST = '2500px 0px 2500px 0px';
+
   const BOOST_DURATION_MS = 2500;
   const BOOST_SPEED_PX_PER_MS = 2.2; // ~2200px/s
 
   const MAX_INFLIGHT_DESKTOP = 4;
   const MAX_INFLIGHT_MOBILE = 3;
 
-  function isBoosted() {
-    try { return Date.now() < (state.scrollBoostUntil || 0); } catch (e) { return false; }
-  }
-
-  function isMobile() {
-    try { return window && window.innerWidth && window.innerWidth < 768; } catch (e) { return false; }
-  }
-
-  function getPreloadRootMargin() {
-    if (isMobile()) return isBoosted() ? PRELOAD_MARGIN_MOBILE_BOOST : PRELOAD_MARGIN_MOBILE;
-    return isBoosted() ? PRELOAD_MARGIN_DESKTOP_BOOST : PRELOAD_MARGIN_DESKTOP;
-  }
-
-  function getMaxInflight() {
-    const base = isMobile() ? MAX_INFLIGHT_MOBILE : MAX_INFLIGHT_DESKTOP;
-    return base + (isBoosted() ? 1 : 0);
-  }
-
   const SELECTORS = {
     topicItem: 'li[component="category/topic"]',
     postItem: '[component="post"][data-pid]',
     categoryItem: 'li[component="categories/category"]',
   };
 
-  // Soft block during navigation / heavy DOM churn to avoid “placeholder does not exist” spam
-  let blockedUntil = 0;
-  function isBlocked() {
-    return Date.now() < blockedUntil;
-  }
+  // Production build: debug disabled
+  function dbg() {}
+
+  // ---------------- state ----------------
 
   const state = {
     pageKey: null,
     cfg: null,
 
-    // Full lists (never consumed) + cursors for round-robin reuse
+    // pools (full lists) + cursors
     allTopics: [],
     allPosts: [],
     allCategories: [],
@@ -69,93 +47,46 @@
     curPosts: 0,
     curCategories: 0,
 
-    // throttle per placeholder id
+    // per-id throttle
     lastShowById: new Map(),
-    internalDomChange: 0,
-    lastRecycleAt: { topic: 0, categoryTopics: 0, categories: 0 },
-
-    // track placeholders that have been shown at least once in this pageview
-    usedOnce: new Set(),
 
     // observers / schedulers
     domObs: null,
     io: null,
-    runQueued: false,
+    ioMargin: null,
+
+    // internal mutations guard
+    internalDomChange: 0,
 
     // preloading budget
     inflight: 0,
     pending: [],
     pendingSet: new Set(),
 
-    // fast scroll boosting
+    // scroll boost
     scrollBoostUntil: 0,
     lastScrollY: 0,
     lastScrollTs: 0,
-    ioMargin: null,
 
-    // hero)
+    // hero
     heroDoneForPage: false,
-    burstRuns: 0,
+
+    // run scheduler
+    runQueued: false,
+    burstActive: false,
+    burstDeadline: 0,
+    burstCount: 0,
+    lastBurstReqTs: 0,
   };
 
+  // Soft block during navigation / heavy DOM churn
+  let blockedUntil = 0;
   const insertingIds = new Set();
 
-  // Hidden pool where we keep placeholder DIVs when they are not currently
-  // mounted in the content flow. This avoids:
-  //  - Ezoic trying to act on ids that were removed from the DOM ("does not exist")
-  //  - re-defining placeholders (we re-use the same node)
-  const POOL_ID = 'nodebb-ezoic-placeholder-pool';
-  function getPoolEl() {
-    let el = document.getElementById(POOL_ID);
-    if (el) return el;
-    el = document.createElement('div');
-    el.id = POOL_ID;
-    el.style.cssText = 'position:fixed;left:-99999px;top:-99999px;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none;';
-    (document.body || document.documentElement).appendChild(el);
-    return el;
-  }
-
-  function isInPool(ph) {
-    try { return !!(ph && ph.closest && ph.closest('#' + POOL_ID)); } catch (e) { return false; }
-  }
+  function now() { return Date.now(); }
+  function isBlocked() { return now() < blockedUntil; }
 
-  function releaseWrapNode(wrap) {
-    try {
-      const ph = wrap && wrap.querySelector && wrap.querySelector(`[id^="${PLACEHOLDER_PREFIX}"]`);
-      if (ph) {
-        try { getPoolEl().appendChild(ph); } catch (e) {}
-        try { if (state.io) state.io.unobserve(ph); } catch (e) {}
-      }
-    } catch (e) {}
-    try { wrap && wrap.remove && wrap.remove(); } catch (e) {}
-  }
-
-
-  function markEmptyWrapper(id) {
-    try {
-      const ph = document.getElementById(`${PLACEHOLDER_PREFIX}${id}`);
-      if (!ph || !ph.isConnected) return;
-      const wrap = ph.closest ? ph.closest(`.${WRAP_CLASS}`) : null;
-      if (!wrap) return;
-      // If still empty after a delay, collapse it.
-      setTimeout(() => {
-        try {
-          const ph2 = document.getElementById(`${PLACEHOLDER_PREFIX}${id}`);
-          if (!ph2 || !ph2.isConnected) return;
-          const w2 = ph2.closest ? ph2.closest(`.${WRAP_CLASS}`) : null;
-          if (!w2) return;
-          // consider empty if only whitespace and no iframes/ins/img
-          const hasAd = !!(ph2.querySelector && ph2.querySelector('iframe, ins, img, .ez-ad, .ezoic-ad'));
-          if (!hasAd) w2.classList.add('is-empty');
-        } catch (e) {}
-      }, 3500);
-    } catch (e) {}
-  }
-
-  // Production build: debug disabled
-  function dbg() {}
-
-  // ---------- small utils ----------
+  // ---------------- utils ----------------
 
   function normalizeBool(v) {
     return v === true || v === 'true' || v === 1 || v === '1' || v === 'on';
@@ -194,19 +125,31 @@
     return window.location.pathname;
   }
 
-  function getKind() {
-    const p = window.location.pathname || '';
-    if (/^\/topic\//.test(p)) return 'topic';
-    if (/^\/category\//.test(p)) return 'categoryTopics';
-    if (p === '/' || /^\/categories/.test(p)) return 'categories';
+  function isMobile() {
+    try { return window.innerWidth < 768; } catch (e) { return false; }
+  }
 
-    // fallback by DOM
-    if (document.querySelector(SELECTORS.categoryItem)) return 'categories';
-    if (document.querySelector(SELECTORS.postItem)) return 'topic';
-    if (document.querySelector(SELECTORS.topicItem)) return 'categoryTopics';
-    return 'other';
+  function isBoosted() {
+    return now() < (state.scrollBoostUntil || 0);
+  }
+
+  function getPreloadRootMargin() {
+    if (isMobile()) return isBoosted() ? PRELOAD_MARGIN_MOBILE_BOOST : PRELOAD_MARGIN_MOBILE;
+    return isBoosted() ? PRELOAD_MARGIN_DESKTOP_BOOST : PRELOAD_MARGIN_DESKTOP;
+  }
+
+  function getMaxInflight() {
+    const base = isMobile() ? MAX_INFLIGHT_MOBILE : MAX_INFLIGHT_DESKTOP;
+    return base + (isBoosted() ? 1 : 0);
+  }
+
+  function withInternalDomChange(fn) {
+    state.internalDomChange++;
+    try { fn(); } finally { state.internalDomChange--; }
   }
 
+  // ---------------- DOM helpers ----------------
+
   function getTopicItems() {
     return Array.from(document.querySelectorAll(SELECTORS.topicItem));
   }
@@ -227,7 +170,59 @@
     });
   }
 
-  // ---------- warm-up & patching ----------
+  function getKind() {
+    const p = window.location.pathname || '';
+    if (/^\/topic\//.test(p)) return 'topic';
+    if (/^\/category\//.test(p)) return 'categoryTopics';
+    if (p === '/' || /^\/categories/.test(p)) return 'categories';
+
+    if (document.querySelector(SELECTORS.categoryItem)) return 'categories';
+    if (document.querySelector(SELECTORS.postItem)) return 'topic';
+    if (document.querySelector(SELECTORS.topicItem)) return 'categoryTopics';
+    return 'other';
+  }
+
+  function isAdjacentAd(target) {
+    if (!target) return false;
+    const next = target.nextElementSibling;
+    if (next && next.classList && next.classList.contains(WRAP_CLASS)) return true;
+    const prev = target.previousElementSibling;
+    if (prev && prev.classList && prev.classList.contains(WRAP_CLASS)) return true;
+    return false;
+  }
+
+  function findWrap(kindClass, afterPos) {
+    return document.querySelector(`.${WRAP_CLASS}.${kindClass}[data-ezoic-after="${afterPos}"]`);
+  }
+
+  // ---------------- placeholder pool ----------------
+
+  function getPoolEl() {
+    let el = document.getElementById(POOL_ID);
+    if (el) return el;
+    el = document.createElement('div');
+    el.id = POOL_ID;
+    el.style.cssText = 'position:fixed;left:-99999px;top:-99999px;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none;';
+    (document.body || document.documentElement).appendChild(el);
+    return el;
+  }
+
+  function isInPool(ph) {
+    try { return !!(ph && ph.closest && ph.closest('#' + POOL_ID)); } catch (e) { return false; }
+  }
+
+  function releaseWrapNode(wrap) {
+    try {
+      const ph = wrap && wrap.querySelector && wrap.querySelector(`[id^="${PLACEHOLDER_PREFIX}"]`);
+      if (ph) {
+        try { getPoolEl().appendChild(ph); } catch (e) {}
+        try { state.io && state.io.unobserve(ph); } catch (e) {}
+      }
+    } catch (e) {}
+    try { wrap && wrap.remove && wrap.remove(); } catch (e) {}
+  }
+
+  // ---------------- network warmup ----------------
 
   const _warmLinksDone = new Set();
   function warmUpNetwork() {
@@ -235,10 +230,18 @@
       const head = document.head || document.getElementsByTagName('head')[0];
       if (!head) return;
       const links = [
+        // Ezoic
         ['preconnect', 'https://g.ezoic.net', true],
         ['dns-prefetch', 'https://g.ezoic.net', false],
         ['preconnect', 'https://go.ezoic.net', true],
         ['dns-prefetch', 'https://go.ezoic.net', false],
+        // Google ads
+        ['preconnect', 'https://securepubads.g.doubleclick.net', true],
+        ['dns-prefetch', 'https://securepubads.g.doubleclick.net', false],
+        ['preconnect', 'https://pagead2.googlesyndication.com', true],
+        ['dns-prefetch', 'https://pagead2.googlesyndication.com', false],
+        ['preconnect', 'https://tpc.googlesyndication.com', true],
+        ['dns-prefetch', 'https://tpc.googlesyndication.com', false],
       ];
       for (const [rel, href, cors] of links) {
         const key = `${rel}|${href}`;
@@ -253,7 +256,9 @@
     } catch (e) {}
   }
 
-  // Patch showAds to avoid warnings when a placeholder disappears (infinite scroll, ajaxify)
+  // ---------------- Ezoic bridge ----------------
+
+  // Patch showAds to silently skip ids not in DOM. This prevents console spam.
   function patchShowAds() {
     const applyPatch = () => {
       try {
@@ -295,28 +300,7 @@
     }
   }
 
-    const RECYCLE_COOLDOWN_MS = 1500;
-
-    function kindKeyFromClass(kindClass) {
-    if (kindClass === 'ezoic-ad-message') return 'topic';
-    if (kindClass === 'ezoic-ad-between') return 'categoryTopics';
-    if (kindClass === 'ezoic-ad-categories') return 'categories';
-    return 'topic';
-  }
-
-function withInternalDomChange(fn) {
-    state.internalDomChange++;
-    try { fn(); } finally { state.internalDomChange--; }
-  }
-
-  function canRecycle(kind) {
-    const now = Date.now();
-    const last = state.lastRecycleAt[kind] || 0;
-    if (now - last < RECYCLE_COOLDOWN_MS) return false;
-    state.lastRecycleAt[kind] = now;
-    return true;
-  }
-// ---------- config & pools ----------
+  // ---------------- config ----------------
 
   async function fetchConfigOnce() {
     if (state.cfg) return state.cfg;
@@ -332,89 +316,14 @@ function withInternalDomChange(fn) {
 
   function initPools(cfg) {
     if (!cfg) return;
-    if (state.allTopics.length === 0) state.allTopics = parsePool(cfg.placeholderIds);
-    if (state.allPosts.length === 0) state.allPosts = parsePool(cfg.messagePlaceholderIds);
-    if (state.allCategories.length === 0) state.allCategories = parsePool(cfg.categoryPlaceholderIds);
+    if (!state.allTopics.length) state.allTopics = parsePool(cfg.placeholderIds);
+    if (!state.allPosts.length) state.allPosts = parsePool(cfg.messagePlaceholderIds);
+    if (!state.allCategories.length) state.allCategories = parsePool(cfg.categoryPlaceholderIds);
   }
 
-  // ---------- insertion primitives ----------
+  // ---------------- insertion primitives ----------------
 
-  function isAdjacentAd(target) {
-    if (!target) return false;
-    const next = target.nextElementSibling;
-    if (next && next.classList && next.classList.contains(WRAP_CLASS)) return true;
-    const prev = target.previousElementSibling;
-    if (prev && prev.classList && prev.classList.contains(WRAP_CLASS)) return true;
-    return false;
-  }
-
-  
-  function getWrapIdFromWrap(wrap) {
-    try {
-      const v = wrap.getAttribute('data-ezoic-wrapid');
-      if (v) return String(v);
-      const ph = wrap.querySelector(`[id^="${PLACEHOLDER_PREFIX}"]`);
-      if (ph && ph.id) return ph.id.replace(PLACEHOLDER_PREFIX, '');
-    } catch (e) {}
-    return null;
-  }
-
-  function safeDestroyById(id) {
-    // IMPORTANT:
-    // Do NOT call ez.destroyPlaceholders here.
-    // In NodeBB ajaxify/infinite-scroll flows, Ezoic can be mid-refresh.
-    // Destroy calls can create churn, reduce fill, and generate "does not exist" spam.
-    // We only remove our wrapper; Ezoic manages slot lifecycle.
-    return;
-  }
-
-  function pruneOrphanWraps(kindClass, items) {
-    if (!items || !items.length) return 0;
-    const itemSet = new Set(items);
-    const wraps = document.querySelectorAll(`.${WRAP_CLASS}.${kindClass}`);
-    let removed = 0;
-
-    wraps.forEach((wrap) => {
-      // NodeBB can insert separators/spacers; accept an anchor within a few previous siblings
-      let ok = false;
-      let prev = wrap.previousElementSibling;
-      for (let i = 0; i < 3 && prev; i++) {
-        if (itemSet.has(prev)) { ok = true; break; }
-        prev = prev.previousElementSibling;
-      }
-
-      if (!ok) {
-        withInternalDomChange(() => {
-          try {
-            // Do not destroy placeholders; move them back to the pool so
-            // Ezoic won't log "does not exist" and we can reuse them later.
-            releaseWrapNode(wrap);
-          } catch (e) {}
-        });
-        removed++;
-      }
-    });
-
-    if (removed) dbg('prune-orphan', kindClass, { removed });
-    return removed;
-  }
-
-  function refreshEmptyState(id) {
-    // After Ezoic has had a moment to fill the placeholder, toggle the CSS class.
-    window.setTimeout(() => {
-      try {
-        const ph = document.getElementById(`${PLACEHOLDER_PREFIX}${id}`);
-        if (!ph || !ph.isConnected) return;
-        const wrap = ph.closest(`.${WRAP_CLASS}`);
-        if (!wrap) return;
-        const hasContent = ph.childElementCount > 0 || ph.offsetHeight > 0;
-        if (hasContent) wrap.classList.remove('is-empty');
-        else wrap.classList.add('is-empty');
-      } catch (e) {}
-    }, 3500);
-  }
-
-function buildWrap(id, kindClass, afterPos, createPlaceholder) {
+  function buildWrap(id, kindClass, afterPos, createPlaceholder) {
     const wrap = document.createElement('div');
     wrap.className = `${WRAP_CLASS} ${kindClass}`;
     wrap.setAttribute('data-ezoic-after', String(afterPos));
@@ -431,10 +340,6 @@ function buildWrap(id, kindClass, afterPos, createPlaceholder) {
     return wrap;
   }
 
-  function findWrap(kindClass, afterPos) {
-    return document.querySelector(`.${WRAP_CLASS}.${kindClass}[data-ezoic-after="${afterPos}"]`);
-  }
-
   function insertAfter(target, id, kindClass, afterPos) {
     if (!target || !target.insertAdjacentElement) return null;
     if (findWrap(kindClass, afterPos)) return null;
@@ -444,24 +349,18 @@ function buildWrap(id, kindClass, afterPos, createPlaceholder) {
 
     insertingIds.add(id);
     try {
-      // If a placeholder already exists (either in content or in our pool),
-      // do NOT create a new DOM node with the same id even temporarily.
       const wrap = buildWrap(id, kindClass, afterPos, !existingPh);
       target.insertAdjacentElement('afterend', wrap);
 
-      // If a placeholder with this id already exists elsewhere (some Ezoic flows
-      // pre-create placeholders), move it into our wrapper instead of aborting.
-      // replaceChild moves the node atomically (no detach window).
+      // If placeholder exists elsewhere (including pool), move it into the wrapper.
       if (existingPh) {
         try {
           existingPh.setAttribute('data-ezoic-id', String(id));
-          // If we didn't create a placeholder, just append.
           if (!wrap.firstElementChild) wrap.appendChild(existingPh);
           else wrap.replaceChild(existingPh, wrap.firstElementChild);
-        } catch (e) {
-          // Keep the new placeholder if replace fails.
-        }
+        } catch (e) {}
       }
+
       return wrap;
     } finally {
       insertingIds.delete(id);
@@ -472,138 +371,79 @@ function buildWrap(id, kindClass, afterPos, createPlaceholder) {
     const n = allIds.length;
     if (!n) return null;
 
-    // Try at most n ids to find one that's not already in the DOM
     for (let tries = 0; tries < n; tries++) {
       const idx = state[cursorKey] % n;
       state[cursorKey] = (state[cursorKey] + 1) % n;
-
       const id = allIds[idx];
+
       const ph = document.getElementById(`${PLACEHOLDER_PREFIX}${id}`);
-      // If placeholder is currently mounted in the content flow, skip.
-      // If it's in our hidden pool, it's available for reuse.
       if (ph && ph.isConnected && !isInPool(ph)) continue;
 
       return id;
     }
+
     return null;
   }
 
+  function pruneOrphanWraps(kindClass, items) {
+    if (!items || !items.length) return 0;
+    const itemSet = new Set(items);
+    const wraps = document.querySelectorAll(`.${WRAP_CLASS}.${kindClass}`);
+    let removed = 0;
 
-  function removeOneOldWrap(kindClass) {
-    try {
-      const wraps = Array.from(document.querySelectorAll(`.${WRAP_CLASS}.${kindClass}`));
-      if (!wraps.length) return false;
-
-      // Prefer a wrap far above the viewport
-      let victim = null;
-      for (const w of wraps) {
-        const r = w.getBoundingClientRect();
-        if (r.bottom < -2000) { victim = w; break; }
+    wraps.forEach((wrap) => {
+      let ok = false;
+      // NodeBB/skins can insert helper nodes between posts (clearfix, separators, etc.).
+      // Be tolerant so we don't remove a valid ad too early ("disappears too fast").
+      let prev = wrap.previousElementSibling;
+      for (let i = 0; i < 8 && prev; i++) {
+        if (itemSet.has(prev)) { ok = true; break; }
+        prev = prev.previousElementSibling;
       }
-      // Otherwise remove the earliest one in the document
-      if (!victim) victim = wraps[0];
 
-      releaseWrapNode(victim);
-      return true;
-    } catch (e) {
-      return false;
-    }
-  }
+      if (!ok) {
+        let next = wrap.nextElementSibling;
+        for (let i = 0; i < 3 && next; i++) {
+          if (itemSet.has(next)) { ok = true; break; }
+          next = next.nextElementSibling;
+        }
+      }
 
-  function enqueueShow(id) {
-  if (!id || isBlocked()) return;
-
-  // Basic per-id throttle (prevents rapid re-requests when DOM churns)
-  const now = Date.now();
-  const last = state.lastShowById.get(id) || 0;
-  if (now - last < 900) return;
-
-  const max = getMaxInflight();
-  if (state.inflight >= max) {
-    if (!state.pendingSet.has(id)) {
-      state.pending.push(id);
-      state.pendingSet.add(id);
-    }
-    return;
-  }
-  startShow(id);
-}
+      if (!ok) {
+        withInternalDomChange(() => releaseWrapNode(wrap));
+        removed++;
+      }
+    });
 
-function drainQueue() {
-  if (isBlocked()) return;
-  const max = getMaxInflight();
-  while (state.inflight < max && state.pending.length) {
-    const id = state.pending.shift();
-    state.pendingSet.delete(id);
-    startShow(id);
+    return removed;
   }
-}
-
-function startShow(id) {
-  if (!id || isBlocked()) return;
 
-  state.inflight++;
-  let released = false;
-  const release = () => {
-    if (released) return;
-    released = true;
-    state.inflight = Math.max(0, state.inflight - 1);
-    drainQueue();
-  };
-
-  const hardTimer = setTimeout(release, 6500);
-
-  requestAnimationFrame(() => {
-    try {
-      if (isBlocked()) return;
-
-      const ph = document.getElementById(`${PLACEHOLDER_PREFIX}${id}`);
-      if (!ph || !ph.isConnected) return;
-
-      const now2 = Date.now();
-      const last2 = state.lastShowById.get(id) || 0;
-      if (now2 - last2 < 900) return;
-      state.lastShowById.set(id, now2);
-
-      window.ezstandalone = window.ezstandalone || {};
-      const ez = window.ezstandalone;
-
-      const doShow = () => {
-        // Do NOT call destroyPlaceholders here.
-        // In ajaxify + infinite scroll flows, Ezoic can be in the middle of a refresh cycle.
-        // Calling destroy on active placeholders is a common source of:
-        //  - "HTML element ... does not exist"
-        //  - "Placeholder Id ... already been defined"
-        // Prefer a straight showAds; Ezoic will refresh as needed.
-        try { ez.showAds(id); } catch (e) {}
-        try { markEmptyWrapper(id); } catch (e) {}
-
-        setTimeout(() => { clearTimeout(hardTimer); release(); }, 650);
-      };
-
-      if (Array.isArray(ez.cmd)) {
-        try { ez.cmd.push(doShow); } catch (e) { doShow(); }
-      } else {
-        doShow();
+  function decluster(kindClass) {
+    // Remove consecutive wraps (keep the first)
+    const wraps = Array.from(document.querySelectorAll(`.${WRAP_CLASS}.${kindClass}`));
+    if (wraps.length < 2) return 0;
+    let removed = 0;
+    for (const w of wraps) {
+      const prev = w.previousElementSibling;
+      if (prev && prev.classList && prev.classList.contains(WRAP_CLASS)) {
+        withInternalDomChange(() => releaseWrapNode(w));
+        removed++;
       }
-    } finally {
-      // If we returned early, hardTimer will release.
     }
-  });
-}
-
+    return removed;
+  }
 
-  // ---------- preload / above-the-fold ----------
+  // ---------------- show (preload / fast fill) ----------------
 
   function ensurePreloadObserver() {
     const desiredMargin = getPreloadRootMargin();
     if (state.io && state.ioMargin === desiredMargin) return state.io;
 
-    // Rebuild IO if margin changed (e.g., scroll boost toggled)
     if (state.io) {
       try { state.io.disconnect(); } catch (e) {}
       state.io = null;
     }
+
     try {
       state.io = new IntersectionObserver((entries) => {
         for (const ent of entries) {
@@ -616,29 +456,36 @@ function startShow(id) {
           if (Number.isFinite(id) && id > 0) enqueueShow(id);
         }
       }, { root: null, rootMargin: desiredMargin, threshold: 0 });
+
       state.ioMargin = desiredMargin;
     } catch (e) {
       state.io = null;
       state.ioMargin = null;
     }
 
-    // If we rebuilt the observer, re-observe existing placeholders so we don't miss them.
+    // Re-observe current placeholders
     try {
       if (state.io) {
         const nodes = document.querySelectorAll(`[id^="${PLACEHOLDER_PREFIX}"]`);
         nodes.forEach((n) => { try { state.io.observe(n); } catch (e) {} });
       }
     } catch (e) {}
+
     return state.io;
   }
 
   function observePlaceholder(id) {
     const ph = document.getElementById(`${PLACEHOLDER_PREFIX}${id}`);
     if (!ph || !ph.isConnected) return;
+    ph.setAttribute('data-ezoic-id', String(id));
+
+    // When the ad actually fills, tighten height to the real iframe height and remove empty-collapsing.
+    armFillObserver(ph);
+
     const io = ensurePreloadObserver();
     try { io && io.observe(ph); } catch (e) {}
 
-    // If already above fold, fire immediately
+    // If already near viewport, fire immediately.
     try {
       const r = ph.getBoundingClientRect();
       const screens = isBoosted() ? 5.0 : 3.0;
@@ -647,7 +494,154 @@ function startShow(id) {
     } catch (e) {}
   }
 
-  // ---------- insertion logic ----------
+  // ---------------- fill tightening ----------------
+
+  const _fillObserved = new WeakSet();
+  function tightenFilled(ph) {
+    if (!ph || !ph.isConnected) return;
+    const wrap = ph.closest ? ph.closest(`.${WRAP_CLASS}`) : null;
+    if (!wrap) return;
+
+    // If we have any real ad content, we should not be in "empty" mode.
+    const frame = ph.querySelector ? ph.querySelector('iframe') : null;
+    const hasAd = !!(frame || (ph.querySelector && ph.querySelector('ins, img, .ez-ad, .ezoic-ad')));
+    if (!hasAd) return;
+
+    try { wrap.classList.remove('is-empty'); } catch (e) {}
+
+    // Remove the common "extra reserved space" created by Ezoic's min-height styles.
+    // Set minHeight to the actual iframe height when available.
+    try {
+      if (frame && frame.offsetHeight) {
+        const h = frame.offsetHeight;
+        const ezoicSpan = ph.closest ? ph.closest('span.ezoic-ad, .ezoic-ad') : null;
+        if (ezoicSpan && ezoicSpan.style) {
+          ezoicSpan.style.minHeight = `${h}px`;
+        }
+        // Also tighten the wrapper itself to avoid "space under" when the parent is taller.
+        wrap.style.minHeight = `${h}px`;
+      }
+    } catch (e) {}
+  }
+
+  function armFillObserver(ph) {
+    if (!ph || _fillObserved.has(ph)) return;
+    _fillObserved.add(ph);
+
+    // Fast path: already filled
+    try { tightenFilled(ph); } catch (e) {}
+
+    // Observe until it fills, then disconnect.
+    try {
+      const mo = new MutationObserver(() => {
+        try {
+          tightenFilled(ph);
+          const hasFrame = !!(ph.querySelector && ph.querySelector('iframe'));
+          if (hasFrame) mo.disconnect();
+        } catch (e) {}
+      });
+      mo.observe(ph, { childList: true, subtree: true });
+    } catch (e) {}
+  }
+
+  function enqueueShow(id) {
+    if (!id || isBlocked()) return;
+
+    // per-id throttle
+    const t = now();
+    const last = state.lastShowById.get(id) || 0;
+    if (t - last < 900) return;
+
+    const max = getMaxInflight();
+    if (state.inflight >= max) {
+      if (!state.pendingSet.has(id)) {
+        state.pending.push(id);
+        state.pendingSet.add(id);
+      }
+      return;
+    }
+
+    startShow(id);
+  }
+
+  function drainQueue() {
+    if (isBlocked()) return;
+    const max = getMaxInflight();
+    while (state.inflight < max && state.pending.length) {
+      const id = state.pending.shift();
+      state.pendingSet.delete(id);
+      startShow(id);
+    }
+  }
+
+  function markEmptyWrapper(id) {
+    // If still empty after delay, mark empty for CSS (1px)
+    try {
+      const ph = document.getElementById(`${PLACEHOLDER_PREFIX}${id}`);
+      if (!ph || !ph.isConnected) return;
+      const wrap = ph.closest ? ph.closest(`.${WRAP_CLASS}`) : null;
+      if (!wrap) return;
+
+      setTimeout(() => {
+        try {
+          const ph2 = document.getElementById(`${PLACEHOLDER_PREFIX}${id}`);
+          if (!ph2 || !ph2.isConnected) return;
+          const w2 = ph2.closest ? ph2.closest(`.${WRAP_CLASS}`) : null;
+          if (!w2) return;
+          const hasAd = !!(ph2.querySelector && ph2.querySelector('iframe, ins, img, .ez-ad, .ezoic-ad'));
+          if (!hasAd) w2.classList.add('is-empty');
+        } catch (e) {}
+      }, 3500);
+    } catch (e) {}
+  }
+
+  function startShow(id) {
+    if (!id || isBlocked()) return;
+
+    state.inflight++;
+    let released = false;
+    const release = () => {
+      if (released) return;
+      released = true;
+      state.inflight = Math.max(0, state.inflight - 1);
+      drainQueue();
+    };
+
+    const hardTimer = setTimeout(release, 6500);
+
+    requestAnimationFrame(() => {
+      try {
+        if (isBlocked()) return;
+
+        const ph = document.getElementById(`${PLACEHOLDER_PREFIX}${id}`);
+        if (!ph || !ph.isConnected) return;
+
+        const t = now();
+        const last = state.lastShowById.get(id) || 0;
+        if (t - last < 900) return;
+        state.lastShowById.set(id, t);
+
+        window.ezstandalone = window.ezstandalone || {};
+        const ez = window.ezstandalone;
+
+        const doShow = () => {
+          try { ez.showAds(id); } catch (e) {}
+          try { markEmptyWrapper(id); } catch (e) {}
+          setTimeout(() => { clearTimeout(hardTimer); release(); }, 650);
+        };
+
+        if (Array.isArray(ez.cmd)) {
+          try { ez.cmd.push(doShow); } catch (e) { doShow(); }
+        } else {
+          doShow();
+        }
+      } finally {
+        // hardTimer releases on early return
+      }
+    });
+  }
+
+  // ---------------- core injection ----------------
 
   function computeTargets(count, interval, showFirst) {
     const out = [];
@@ -656,6 +650,7 @@ function startShow(id) {
     for (let i = 1; i <= count; i++) {
       if (i % interval === 0) out.push(i);
     }
+    // unique + sorted
     return Array.from(new Set(out)).sort((a, b) => a - b);
   }
 
@@ -674,43 +669,87 @@ function startShow(id) {
       if (isAdjacentAd(el)) continue;
       if (findWrap(kindClass, afterPos)) continue;
 
-      let id = pickIdFromAll(allIds, cursorKey);
-      if (!id) {
-        // No free ids: recycle an old ad wrapper so we can reuse its placeholder id.
-        // Guard against tight observer loops.
-        if (!canRecycle(kindKeyFromClass(kindClass))) {
-          dbg('recycle-skip-cooldown', kindClass);
-          break;
-        }
-        let recycled = false;
-        withInternalDomChange(() => {
-          recycled = removeOneOldWrap(kindClass);
-        });
-        dbg('recycle-needed', kindClass, { recycled, ids: allIds.length });
-        // Stop this run after a recycle; the next mutation/scroll will retry injection.
-        break;
-      }
+      const id = pickIdFromAll(allIds, cursorKey);
+      if (!id) break;
+
       const wrap = insertAfter(el, id, kindClass, afterPos);
-      if (!wrap) {
-        continue;
-      }
+      if (!wrap) continue;
 
       observePlaceholder(id);
-      inserted += 1;
+      inserted++;
     }
 
     return inserted;
   }
 
-  async function insertHeroAdEarly() {
-    if (state.heroDoneForPage) return;
+  async function runCore() {
+    if (isBlocked()) return 0;
+
+    patchShowAds();
+
     const cfg = await fetchConfigOnce();
-    if (!cfg) { dbg('no-config'); return; }
-    if (cfg.excluded) { dbg('excluded'); return; }
+    if (!cfg || cfg.excluded) return 0;
+    initPools(cfg);
 
+    const kind = getKind();
+    let inserted = 0;
+
+    if (kind === 'topic') {
+      if (normalizeBool(cfg.enableMessageAds)) {
+        const items = getPostContainers();
+        pruneOrphanWraps('ezoic-ad-message', items);
+        inserted += injectBetween(
+          'ezoic-ad-message',
+          items,
+          Math.max(1, parseInt(cfg.messageIntervalPosts, 10) || 3),
+          normalizeBool(cfg.showFirstMessageAd),
+          state.allPosts,
+          'curPosts'
+        );
+        decluster('ezoic-ad-message');
+      }
+    } else if (kind === 'categoryTopics') {
+      if (normalizeBool(cfg.enableBetweenAds)) {
+        const items = getTopicItems();
+        pruneOrphanWraps('ezoic-ad-between', items);
+        inserted += injectBetween(
+          'ezoic-ad-between',
+          items,
+          Math.max(1, parseInt(cfg.intervalPosts, 10) || 6),
+          normalizeBool(cfg.showFirstTopicAd),
+          state.allTopics,
+          'curTopics'
+        );
+        decluster('ezoic-ad-between');
+      }
+    } else if (kind === 'categories') {
+      if (normalizeBool(cfg.enableCategoryAds)) {
+        const items = getCategoryItems();
+        pruneOrphanWraps('ezoic-ad-categories', items);
+        inserted += injectBetween(
+          'ezoic-ad-categories',
+          items,
+          Math.max(1, parseInt(cfg.intervalCategories, 10) || 4),
+          normalizeBool(cfg.showFirstCategoryAd),
+          state.allCategories,
+          'curCategories'
+        );
+        decluster('ezoic-ad-categories');
+      }
+    }
+
+    return inserted;
+  }
+
+  async function insertHeroAdEarly() {
+    if (state.heroDoneForPage || isBlocked()) return;
+
+    const cfg = await fetchConfigOnce();
+    if (!cfg || cfg.excluded) return;
     initPools(cfg);
 
     const kind = getKind();
+
     let items = [];
     let allIds = [];
     let cursorKey = '';
@@ -742,9 +781,8 @@ function startShow(id) {
     if (!items.length) return;
     if (!showFirst) { state.heroDoneForPage = true; return; }
 
-    // Insert after the very first item (above-the-fold)
     const afterPos = 1;
-    const el = items[afterPos - 1];
+    const el = items[0];
     if (!el || !el.isConnected) return;
     if (isAdjacentAd(el)) return;
     if (findWrap(kindClass, afterPos)) { state.heroDoneForPage = true; return; }
@@ -753,119 +791,76 @@ function startShow(id) {
     if (!id) return;
 
     const wrap = insertAfter(el, id, kindClass, afterPos);
-    if (!wrap) {
-      return;
-    }
+    if (!wrap) return;
 
     state.heroDoneForPage = true;
     observePlaceholder(id);
   }
 
-  async function runCore() {
-    if (isBlocked()) { dbg('blocked'); return; }
-    let insertedThisRun = 0;
-
-    patchShowAds();
-
-    const cfg = await fetchConfigOnce();
-    if (!cfg) { dbg('no-config'); return; }
-    if (cfg.excluded) { dbg('excluded'); return; }
-    initPools(cfg);
+  // ---------------- scheduler ----------------
 
-    const kind = getKind();
-
-    if (kind === 'topic') {
-      if (normalizeBool(cfg.enableMessageAds)) {
-        const __items = getPostContainers();
-        pruneOrphanWraps('ezoic-ad-message', __items);
-        insertedThisRun += injectBetween(
-          'ezoic-ad-message',
-          __items,
-          Math.max(1, parseInt(cfg.messageIntervalPosts, 10) || 3),
-          normalizeBool(cfg.showFirstMessageAd),
-          state.allPosts,
-          'curPosts'
-        );
-      }
-    } else if (kind === 'categoryTopics') {
-      if (normalizeBool(cfg.enableBetweenAds)) {
-        const __items = getTopicItems();
-        pruneOrphanWraps('ezoic-ad-between', __items);
-        insertedThisRun += injectBetween(
-          'ezoic-ad-between',
-          __items,
-          Math.max(1, parseInt(cfg.intervalPosts, 10) || 6),
-          normalizeBool(cfg.showFirstTopicAd),
-          state.allTopics,
-          'curTopics'
-        );
-      }
-    } else if (kind === 'categories') {
-      if (normalizeBool(cfg.enableCategoryAds)) {
-        const __items = getCategoryItems();
-        pruneOrphanWraps('ezoic-ad-categories', __items);
-        insertedThisRun += injectBetween(
-          'ezoic-ad-categories',
-          __items,
-          Math.max(1, parseInt(cfg.intervalCategories, 10) || 4),
-          normalizeBool(cfg.showFirstCategoryAd),
-          state.allCategories,
-          'curCategories'
-        );
-      }
-    }
-  }
-
-  function scheduleRun(delayMs = 0) {
-    // schedule a single run (coalesced)
+  function scheduleRun(delayMs = 0, cb) {
     if (state.runQueued) return;
     state.runQueued = true;
-    const doRun = () => {
+
+    const run = async () => {
       state.runQueued = false;
       const pk = getPageKey();
       if (state.pageKey && pk !== state.pageKey) return;
-      runCore().catch(() => {});
+      let inserted = 0;
+      try { inserted = await runCore(); } catch (e) { inserted = 0; }
+      try { cb && cb(inserted); } catch (e) {}
     };
-    if (delayMs > 0) {
-      window.setTimeout(() => window.requestAnimationFrame(doRun), delayMs);
-    } else {
-      window.requestAnimationFrame(doRun);
-    }
+
+    const doRun = () => requestAnimationFrame(run);
+    if (delayMs > 0) setTimeout(doRun, delayMs);
+    else doRun();
   }
 
-  function scheduleBurst() {
-    // During ajaxify/infinite scroll, the DOM may arrive in waves.
-    // We run a small, bounded burst to ensure all 1/X targets are reached.
+  function requestBurst() {
+    if (isBlocked()) return;
+
+    const t = now();
+    if (t - state.lastBurstReqTs < 120) return;
+    state.lastBurstReqTs = t;
+
     const pk = getPageKey();
     state.pageKey = pk;
-    state.burstRuns = 0;
-    const burst = () => {
-      if (getPageKey() !== pk) return;
-      if (state.burstRuns >= 6) return;
-      state.burstRuns += 1;
-      scheduleRun(0);
-      // follow-up passes catch late-rendered items (especially on topics)
-      window.setTimeout(() => scheduleRun(0), 180);
-      window.setTimeout(() => scheduleRun(0), 650);
-      window.setTimeout(() => scheduleRun(0), 1400);
+
+    state.burstDeadline = t + 1800;
+    if (state.burstActive) return;
+
+    state.burstActive = true;
+    state.burstCount = 0;
+
+    const step = () => {
+      if (getPageKey() !== pk) { state.burstActive = false; return; }
+      if (isBlocked()) { state.burstActive = false; return; }
+      if (now() > state.burstDeadline) { state.burstActive = false; return; }
+      if (state.burstCount >= 8) { state.burstActive = false; return; }
+
+      state.burstCount++;
+      scheduleRun(0, (inserted) => {
+        // Continue while we are still inserting or we have pending shows.
+        const hasWork = inserted > 0 || state.pending.length > 0;
+        if (!hasWork) { state.burstActive = false; return; }
+        // Short delay keeps UI smooth while catching late DOM waves.
+        setTimeout(step, inserted > 0 ? 120 : 220);
+      });
     };
-    burst();
-  }
 
+    step();
+  }
 
-  // ---------- observers / lifecycle ----------
+  // ---------------- lifecycle ----------------
 
   function cleanup() {
-    blockedUntil = Date.now() + 1200;
+    blockedUntil = now() + 1200;
 
-    // remove all wrappers
     try {
-      document.querySelectorAll(`.${WRAP_CLASS}`).forEach((el) => {
-        releaseWrapNode(el);
-      });
+      document.querySelectorAll(`.${WRAP_CLASS}`).forEach((el) => releaseWrapNode(el));
     } catch (e) {}
 
-    // reset state
     state.cfg = null;
     state.allTopics = [];
     state.allPosts = [];
@@ -874,21 +869,48 @@ function startShow(id) {
     state.curPosts = 0;
     state.curCategories = 0;
     state.lastShowById.clear();
+
     state.inflight = 0;
     state.pending = [];
-    try { state.pendingSet && state.pendingSet.clear(); } catch (e) {}
-    try { state.usedOnce && state.usedOnce.clear(); } catch (e) {}
+    state.pendingSet.clear();
+
     state.heroDoneForPage = false;
 
-    // keep observers alive (MutationObserver will re-trigger after navigation)
+    // keep observers alive
+  }
+
+  function shouldReactToMutations(mutations) {
+    // Fast filter: only react if relevant nodes were added/removed.
+    for (const m of mutations) {
+      if (!m.addedNodes || m.addedNodes.length === 0) continue;
+      for (const n of m.addedNodes) {
+        if (!n || n.nodeType !== 1) continue;
+        const el = /** @type {Element} */ (n);
+        if (
+          el.matches?.(SELECTORS.postItem) ||
+          el.matches?.(SELECTORS.topicItem) ||
+          el.matches?.(SELECTORS.categoryItem) ||
+          el.querySelector?.(SELECTORS.postItem) ||
+          el.querySelector?.(SELECTORS.topicItem) ||
+          el.querySelector?.(SELECTORS.categoryItem)
+        ) {
+          return true;
+        }
+      }
+    }
+    return false;
   }
 
   function ensureDomObserver() {
     if (state.domObs) return;
-    state.domObs = new MutationObserver(() => {
+
+    state.domObs = new MutationObserver((mutations) => {
       if (state.internalDomChange > 0) return;
-      if (!isBlocked()) scheduleBurst();
+      if (isBlocked()) return;
+      if (!shouldReactToMutations(mutations)) return;
+      requestBurst();
     });
+
     try {
       state.domObs.observe(document.body, { childList: true, subtree: true });
     } catch (e) {}
@@ -912,56 +934,52 @@ function startShow(id) {
       ensurePreloadObserver();
       ensureDomObserver();
 
-      // Ultra-fast above-the-fold first
       insertHeroAdEarly().catch(() => {});
-
-      // Then normal insertion
-      scheduleBurst();
+      requestBurst();
     });
 
-    // Infinite scroll / partial updates
-    $(window).on('action:posts.loaded.ezoicInfinite action:topics.loaded.ezoicInfinite action:category.loaded.ezoicInfinite action:topic.loaded.ezoicInfinite', () => {
-      if (isBlocked()) return;
-      scheduleBurst();
-    });
+    $(window).on(
+      'action:posts.loaded.ezoicInfinite action:topics.loaded.ezoicInfinite action:category.loaded.ezoicInfinite action:topic.loaded.ezoicInfinite',
+      () => {
+        if (isBlocked()) return;
+        requestBurst();
+      }
+    );
   }
 
   function bindScroll() {
     let ticking = false;
     window.addEventListener('scroll', () => {
-      // Detect very fast scrolling and temporarily boost preload/parallelism.
+      // Fast-scroll boost
       try {
-        const now = Date.now();
+        const t = now();
         const y = window.scrollY || window.pageYOffset || 0;
         if (state.lastScrollTs) {
-          const dt = now - state.lastScrollTs;
+          const dt = t - state.lastScrollTs;
           const dy = Math.abs(y - (state.lastScrollY || 0));
           if (dt > 0) {
-            const speed = dy / dt; // px/ms
+            const speed = dy / dt;
             if (speed >= BOOST_SPEED_PX_PER_MS) {
               const wasBoosted = isBoosted();
-              state.scrollBoostUntil = Math.max(state.scrollBoostUntil || 0, now + BOOST_DURATION_MS);
-              if (!wasBoosted) {
-                // margin changed -> rebuild IO so existing placeholders get earlier preload
-                ensurePreloadObserver();
-              }
+              state.scrollBoostUntil = Math.max(state.scrollBoostUntil || 0, t + BOOST_DURATION_MS);
+              if (!wasBoosted) ensurePreloadObserver();
             }
           }
         }
         state.lastScrollY = y;
-        state.lastScrollTs = now;
+        state.lastScrollTs = t;
       } catch (e) {}
 
       if (ticking) return;
       ticking = true;
-      window.requestAnimationFrame(() => {
+      requestAnimationFrame(() => {
         ticking = false;
-        if (!isBlocked()) scheduleBurst();
+        requestBurst();
       });
     }, { passive: true });
   }
 
-  // ---------- boot ----------
+  // ---------------- boot ----------------
 
   state.pageKey = getPageKey();
   warmUpNetwork();
@@ -972,8 +990,7 @@ function startShow(id) {
   bindNodeBB();
   bindScroll();
 
-  // First paint: try hero + run
   blockedUntil = 0;
   insertHeroAdEarly().catch(() => {});
-  scheduleBurst();
+  requestBurst();
 })();

package/public/style.css

@@ -13,7 +13,8 @@
 .nodebb-ezoic-wrap > [id^="ezoic-pub-ad-placeholder-"] {
   margin: 0 !important;
   padding: 0 !important;
-  min-height: 1px; /* keeps placeholder measurable for IO */
+  /* Keep the placeholder measurable (IO) but visually negligible */
+  min-height: 1px;
 }
 
 /* If Ezoic wraps inside our wrapper, keep it tight */
@@ -21,6 +22,28 @@
 .nodebb-ezoic-wrap .ezoic-ad {
   margin: 0 !important;
   padding: 0 !important;
+  /* Ezoic sometimes reserves extra height (e.g. min-height: 400px) even when the filled iframe is smaller.
+     We prefer zero unused space; JS will also tighten after fill to the real iframe height. */
+  min-height: 0 !important;
+  height: auto !important;
+}
+
+/* Remove the classic "gap under iframe" (baseline/inline-block) */
+.nodebb-ezoic-wrap,
+.nodebb-ezoic-wrap * {
+  line-height: 0 !important;
+  font-size: 0 !important;
+}
+
+.nodebb-ezoic-wrap iframe,
+.nodebb-ezoic-wrap div[id$="__container__"] iframe {
+  display: block !important;
+  vertical-align: top !important;
+}
+
+.nodebb-ezoic-wrap div[id$="__container__"] {
+  display: block !important;
+  line-height: 0 !important;
 }
 
 
@@ -29,19 +52,12 @@
   display: block !important;
   margin: 0 !important;
   padding: 0 !important;
-  height: 0 !important;
-  min-height: 0 !important;
+  /* Don't fully collapse (can prevent fill / triggers "unused"), keep it at 1px */
+  height: 1px !important;
+  min-height: 1px !important;
   overflow: hidden !important;
 }
 
-.nodebb-ezoic-wrap {
-  min-height: 0 !important;
-}
-
-.nodebb-ezoic-wrap > [id^="ezoic-pub-ad-placeholder-"] {
-  min-height: 0 !important;
-}
-
 /*
   Optional: also neutralize spacing on native Ezoic `.ezoic-ad` blocks.
   (Keeps your previous "CSS very good" behavior.)