nodebb-plugin-ezoic-infinite 1.5.30 → 1.5.32

package/package.json

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

package/public/client.js

@@ -10,8 +10,24 @@
   // Insert at most N ads per run to keep the UI smooth on infinite scroll
   const MAX_INSERTS_PER_RUN = 3;
 
-  // Preload before viewport (tune if you want even earlier)
-  const PRELOAD_ROOT_MARGIN = '1200px 0px';
+  // Preload before viewport (earlier load for smoother scroll)
+  const PRELOAD_MARGIN_DESKTOP = '2600px 0px 2600px 0px';
+  const PRELOAD_MARGIN_MOBILE = '1500px 0px 1500px 0px';
+
+  const MAX_INFLIGHT_DESKTOP = 4;
+  const MAX_INFLIGHT_MOBILE = 3;
+
+  function isMobile() {
+    try { return window && window.innerWidth && window.innerWidth < 768; } catch (e) { return false; }
+  }
+
+  function getPreloadRootMargin() {
+    return isMobile() ? PRELOAD_MARGIN_MOBILE : PRELOAD_MARGIN_DESKTOP;
+  }
+
+  function getMaxInflight() {
+    return isMobile() ? MAX_INFLIGHT_MOBILE : MAX_INFLIGHT_DESKTOP;
+  }
 
   const SELECTORS = {
     topicItem: 'li[component="category/topic"]',
@@ -50,22 +66,43 @@
     io: null,
     runQueued: false,
 
-    // hero
+    // preloading budget
+    inflight: 0,
+    pending: [],
+    pendingSet: new Set(),
+
+    // hero)
     heroDoneForPage: false,
   };
 
   const insertingIds = new Set();
 
-  // Debug logs (enable with localStorage.ezoicInfiniteDebug = "1")
-  function dbg(...args) {
+    }
+
+  function markEmptyWrapper(id) {
     try {
-      if (window && window.localStorage && window.localStorage.getItem('ezoicInfiniteDebug') === '1') {
-        // eslint-disable-next-line no-console
-        console.log('[ezoicInfinite]', ...args);
-      }
+      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 ----------
 
   function normalizeBool(v) {
@@ -408,15 +445,51 @@ function buildWrap(id, kindClass, afterPos) {
     }
   }
 
-  function showAd(id) {
-    if (!id || isBlocked()) return;
+  function enqueueShow(id) {
+  if (!id || isBlocked()) return;
 
-    const now = Date.now();
-    const last = state.lastShowById.get(id) || 0;
-    if (now - last < 1500) return; // basic throttle
+  // 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);
+}
+
+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 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);
 
-    // Defer one frame so the placeholder is definitely in DOM after insertion/recycle
-    requestAnimationFrame(() => {
+  requestAnimationFrame(() => {
+    try {
       if (isBlocked()) return;
 
       const ph = document.getElementById(`${PLACEHOLDER_PREFIX}${id}`);
@@ -424,54 +497,36 @@ function buildWrap(id, kindClass, afterPos) {
 
       const now2 = Date.now();
       const last2 = state.lastShowById.get(id) || 0;
-      if (now2 - last2 < 1200) return;
+      if (now2 - last2 < 900) return;
       state.lastShowById.set(id, now2);
 
-      try {
-        window.ezstandalone = window.ezstandalone || {};
-        const ez = window.ezstandalone;
+      window.ezstandalone = window.ezstandalone || {};
+      const ez = window.ezstandalone;
 
-        const doShow = () => {
-          try {
-            if (state.usedOnce && state.usedOnce.has(id) && typeof ez.destroyPlaceholders === 'function') {
-              // Avoid Ezoic caching state for reused placeholders
-              ez.destroyPlaceholders(id);
-            }
-          } catch (e) {}
-          try { ez.showAds(id); } catch (e) {}
-          try { state.usedOnce && state.usedOnce.add(id); } catch (e) {}
-        };
+      const doShow = () => {
+        try {
+          if (state.usedOnce && state.usedOnce.has(id) && typeof ez.destroyPlaceholders === 'function') {
+            try { ez.destroyPlaceholders(id); } catch (e) {}
+          }
+        } catch (e) {}
 
-        // Fast path
-        if (typeof ez.showAds === 'function') {
-          doShow();
-          return;
-        }
+        try { ez.showAds(id); } catch (e) {}
+        try { state.usedOnce && state.usedOnce.add(id); } catch (e) {}
+        try { markEmptyWrapper(id); } catch (e) {}
 
-        // Queue once for when Ezoic is ready
-        ez.cmd = ez.cmd || [];
-        if (!ph.__ezoicQueued) {
-          ph.__ezoicQueued = true;
-          ez.cmd.push(() => {
-            try {
-              if (isBlocked()) return;
-              const el = document.getElementById(`${PLACEHOLDER_PREFIX}${id}`);
-              if (!el || !el.isConnected) return;
-              const ez2 = window.ezstandalone;
-              if (!ez2 || typeof ez2.showAds !== 'function') return;
-              try {
-                if (state.usedOnce && state.usedOnce.has(id) && typeof ez2.destroyPlaceholders === 'function') {
-                  ez2.destroyPlaceholders(id);
-                }
-              } catch (e) {}
-              try { ez2.showAds(id); } catch (e) {}
-              try { state.usedOnce && state.usedOnce.add(id); } catch (e) {}
-            } catch (e) {}
-          });
-        }
-      } catch (e) {}
-    });
-  }
+        setTimeout(() => { clearTimeout(hardTimer); release(); }, 650);
+      };
+
+      if (Array.isArray(ez.cmd)) {
+        try { ez.cmd.push(doShow); } catch (e) { doShow(); }
+      } else {
+        doShow();
+      }
+    } finally {
+      // If we returned early, hardTimer will release.
+    }
+  });
+}
 
 
   // ---------- preload / above-the-fold ----------
@@ -487,9 +542,9 @@ function buildWrap(id, kindClass, afterPos) {
 
           const idAttr = el && el.getAttribute && el.getAttribute('data-ezoic-id');
           const id = parseInt(idAttr, 10);
-          if (Number.isFinite(id) && id > 0) showAd(id);
+          if (Number.isFinite(id) && id > 0) enqueueShow(id);
         }
-      }, { root: null, rootMargin: PRELOAD_ROOT_MARGIN, threshold: 0.01 });
+      }, { root: null, rootMargin: getPreloadRootMargin(), threshold: 0 });
     } catch (e) {
       state.io = null;
     }
@@ -505,7 +560,7 @@ function buildWrap(id, kindClass, afterPos) {
     // If already above fold, fire immediately
     try {
       const r = ph.getBoundingClientRect();
-      if (r.top < window.innerHeight * 1.5 && r.bottom > -200) showAd(id);
+      if (r.top < window.innerHeight * 3.0 && r.bottom > -800) enqueueShow(id);
     } catch (e) {}
   }
 
@@ -708,6 +763,9 @@ function buildWrap(id, kindClass, afterPos) {
     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.heroDoneForPage = false;