nodebb-plugin-ezoic-infinite 1.5.33 → 1.5.35

package/package.json

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

package/public/client.js

@@ -24,7 +24,53 @@
   const MAX_INFLIGHT_DESKTOP = 4;
   const MAX_INFLIGHT_MOBILE = 3;
 
-  function isBoosted() {
+  
+// Adaptive performance profile (device/network aware)
+const PERF_DEFAULTS = Object.freeze({
+  maxInflightDesktop: MAX_INFLIGHT_DESKTOP,
+  maxInflightMobile: MAX_INFLIGHT_MOBILE,
+  maxInsertsPerRun: MAX_INSERTS_PER_RUN,
+});
+
+function getPerfProfile() {
+  // Cache result for this pageview; recomputed on navigation via cleanup()
+  if (state.perfProfile) return state.perfProfile;
+  const p = {
+    maxInflightDesktop: PERF_DEFAULTS.maxInflightDesktop,
+    maxInflightMobile: PERF_DEFAULTS.maxInflightMobile,
+    maxInsertsPerRun: PERF_DEFAULTS.maxInsertsPerRun,
+  };
+
+  try {
+    const mem = typeof navigator !== 'undefined' ? navigator.deviceMemory : undefined; // GB
+    const cores = typeof navigator !== 'undefined' ? navigator.hardwareConcurrency : undefined;
+
+    // Conservative tuning for low-end devices
+    if (typeof mem === 'number' && mem > 0 && mem <= 2) {
+      p.maxInflightDesktop = Math.max(2, p.maxInflightDesktop - 1);
+      p.maxInflightMobile = Math.max(1, p.maxInflightMobile - 1);
+      p.maxInsertsPerRun = Math.max(1, p.maxInsertsPerRun - 1);
+    }
+    if (typeof cores === 'number' && cores > 0 && cores <= 4) {
+      p.maxInflightDesktop = Math.max(2, p.maxInflightDesktop - 1);
+      p.maxInflightMobile = Math.max(1, p.maxInflightMobile - 1);
+      p.maxInsertsPerRun = Math.max(1, p.maxInsertsPerRun - 1);
+    }
+
+    const conn = typeof navigator !== 'undefined' ? navigator.connection : undefined;
+    const eff = conn && conn.effectiveType ? String(conn.effectiveType).toLowerCase() : '';
+    // Slow connections: don't ramp concurrency too high (keeps page responsive).
+    if (eff.includes('2g')) {
+      p.maxInflightDesktop = Math.max(2, p.maxInflightDesktop - 1);
+      p.maxInflightMobile = Math.max(1, p.maxInflightMobile - 1);
+    }
+  } catch (e) {}
+
+  state.perfProfile = p;
+  return p;
+}
+
+function isBoosted() {
     try { return Date.now() < (state.scrollBoostUntil || 0); } catch (e) { return false; }
   }
 
@@ -38,7 +84,8 @@
   }
 
   function getMaxInflight() {
-    const base = isMobile() ? MAX_INFLIGHT_MOBILE : MAX_INFLIGHT_DESKTOP;
+    const perf = getPerfProfile();
+    const base = isMobile() ? perf.maxInflightMobile : perf.maxInflightDesktop;
     return base + (isBoosted() ? 1 : 0);
   }
 
@@ -48,6 +95,31 @@
     categoryItem: 'li[component="categories/category"]',
   };
 
+const RELEVANT_MATCHERS = [
+  SELECTORS.postItem,
+  SELECTORS.topicItem,
+  SELECTORS.categoryItem,
+];
+
+function mutationHasRelevantAddedNodes(mutations) {
+  try {
+    for (const m of mutations) {
+      if (!m || !m.addedNodes || !m.addedNodes.length) continue;
+      for (const n of m.addedNodes) {
+        if (!n || n.nodeType !== 1) continue;
+        const el = /** @type {Element} */ (n);
+        for (const sel of RELEVANT_MATCHERS) {
+          if (el.matches && el.matches(sel)) return true;
+          if (el.querySelector && el.querySelector(sel)) return true;
+        }
+      }
+    }
+  } catch (e) {}
+  return false;
+}
+
+
+
   // Soft block during navigation / heavy DOM churn to avoid “placeholder does not exist” spam
   let blockedUntil = 0;
   function isBlocked() {
@@ -95,29 +167,6 @@
   };
 
   const insertingIds = new Set();
-
-
-  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() {}
 
@@ -334,7 +383,33 @@ function withInternalDomChange(fn) {
     } catch (e) {}
   }
 
-  function pruneOrphanWraps(kindClass, items) {
+  
+  function findWrapById(id) {
+    try {
+      return document.querySelector(`.${WRAP_CLASS}[data-ezoic-wrapid="${id}"]`);
+    } catch (e) {}
+    return null;
+  }
+
+  function armPlaceholder(wrap, id) {
+    try {
+      if (!wrap || !wrap.isConnected) return null;
+      const domId = `${PLACEHOLDER_PREFIX}${id}`;
+
+      // If the id is already present somewhere, do not reassign it.
+      const existing = document.getElementById(domId);
+      if (existing && existing.isConnected) return existing;
+
+      const ph = wrap.querySelector('[data-ezoic-ph="1"]');
+      if (!ph) return null;
+
+      if (!ph.id) ph.id = domId;
+      return ph;
+    } catch (e) {}
+    return null;
+  }
+
+function pruneOrphanWraps(kindClass, items) {
     if (!items || !items.length) return 0;
     const itemSet = new Set(items);
     const wraps = document.querySelectorAll(`.${WRAP_CLASS}.${kindClass}`);
@@ -364,22 +439,6 @@ function withInternalDomChange(fn) {
     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) {
     const wrap = document.createElement('div');
     wrap.className = `${WRAP_CLASS} ${kindClass}`;
@@ -388,8 +447,10 @@ function buildWrap(id, kindClass, afterPos) {
     wrap.style.width = '100%';
 
     const ph = document.createElement('div');
-    ph.id = `${PLACEHOLDER_PREFIX}${id}`;
+    // Do not assign the Ezoic placeholder id until we actually want to load the ad.
+    // This avoids Ezoic defining placeholders too early during DOM churn/infinite scroll.
     ph.setAttribute('data-ezoic-id', String(id));
+    ph.setAttribute('data-ezoic-ph', '1');
     wrap.appendChild(ph);
 
     return wrap;
@@ -404,8 +465,8 @@ function buildWrap(id, kindClass, afterPos) {
     if (findWrap(kindClass, afterPos)) return null;
     if (insertingIds.has(id)) return null;
 
-    const existingPh = document.getElementById(`${PLACEHOLDER_PREFIX}${id}`);
-    if (existingPh && existingPh.isConnected) return null;
+        const existingWrap = findWrapById(id);
+    if (existingWrap && existingWrap.isConnected) return null;
 
     insertingIds.add(id);
     try {
@@ -427,8 +488,8 @@ function buildWrap(id, kindClass, afterPos) {
       state[cursorKey] = (state[cursorKey] + 1) % n;
 
       const id = allIds[idx];
-      const ph = document.getElementById(`${PLACEHOLDER_PREFIX}${id}`);
-      if (ph && ph.isConnected) continue;
+            const w = findWrapById(id);
+      if (w && w.isConnected) continue;
 
       return id;
     }
@@ -450,13 +511,20 @@ function buildWrap(id, kindClass, afterPos) {
       // Otherwise remove the earliest one in the document
       if (!victim) victim = wraps[0];
 
-      // Unobserve placeholder if still observed
-      try {
-        const ph = victim.querySelector && victim.querySelector(`[id^="${PLACEHOLDER_PREFIX}"]`);
-        if (ph && state.io) state.io.unobserve(ph);
-      } catch (e) {}
+      const id = getWrapIdFromWrap(victim);
+
+      withInternalDomChange(() => {
+        // Unobserve placeholder if still observed
+        try {
+          const t = victim;
+          if (t && state.io) state.io.unobserve(t);
+        } catch (e) {}
+
+        try { if (id) safeDestroyById(id); } catch (e) {}
+
+        try { victim.remove(); } catch (e) {}
+      });
 
-      victim.remove();
       return true;
     } catch (e) {
       return false;
@@ -523,14 +591,13 @@ function startShow(id) {
 
       const doShow = () => {
         try {
-          if (state.usedOnce && state.usedOnce.has(id) && typeof ez.destroyPlaceholders === 'function') {
-            try { ez.destroyPlaceholders(id); } catch (e) {}
+          if (state.usedOnce && state.usedOnce.has(id)) {
+            safeDestroyById(id);
           }
         } catch (e) {}
 
         try { ez.showAds(id); } catch (e) {}
         try { state.usedOnce && state.usedOnce.add(id); } catch (e) {}
-        try { markEmptyWrapper(id); } catch (e) {}
 
         setTimeout(() => { clearTimeout(hardTimer); release(); }, 650);
       };
@@ -565,9 +632,12 @@ function startShow(id) {
           const el = ent.target;
           try { state.io && state.io.unobserve(el); } catch (e) {}
 
-          const idAttr = el && el.getAttribute && el.getAttribute('data-ezoic-id');
+          const idAttr = el && el.getAttribute && el.getAttribute('data-ezoic-wrapid');
           const id = parseInt(idAttr, 10);
-          if (Number.isFinite(id) && id > 0) enqueueShow(id);
+          if (Number.isFinite(id) && id > 0) {
+            armPlaceholder(el, id);
+            enqueueShow(id);
+          }
         }
       }, { root: null, rootMargin: desiredMargin, threshold: 0 });
       state.ioMargin = desiredMargin;
@@ -579,7 +649,7 @@ function startShow(id) {
     // If we rebuilt the observer, re-observe existing placeholders so we don't miss them.
     try {
       if (state.io) {
-        const nodes = document.querySelectorAll(`[id^="${PLACEHOLDER_PREFIX}"]`);
+        const nodes = document.querySelectorAll(`.${WRAP_CLASS}[data-ezoic-wrapid]`);
         nodes.forEach((n) => { try { state.io.observe(n); } catch (e) {} });
       }
     } catch (e) {}
@@ -587,17 +657,20 @@ function startShow(id) {
   }
 
   function observePlaceholder(id) {
-    const ph = document.getElementById(`${PLACEHOLDER_PREFIX}${id}`);
-    if (!ph || !ph.isConnected) return;
+    const wrap = findWrapById(id);
+    if (!wrap || !wrap.isConnected) return;
     const io = ensurePreloadObserver();
-    try { io && io.observe(ph); } catch (e) {}
+    try { io && io.observe(wrap); } catch (e) {}
 
-    // If already above fold, fire immediately
+    // If already near the fold, arm & fire immediately
     try {
-      const r = ph.getBoundingClientRect();
+      const r = wrap.getBoundingClientRect();
       const screens = isBoosted() ? 5.0 : 3.0;
-      const minBottom = isBoosted() ? -1500 : -800;
-      if (r.top < window.innerHeight * screens && r.bottom > minBottom) enqueueShow(id);
+      const h = (window.innerHeight || 800);
+      if (r.top < screens * h && r.bottom > -screens * h) {
+        armPlaceholder(wrap, id);
+        enqueueShow(id);
+      }
     } catch (e) {}
   }
 
@@ -618,7 +691,8 @@ function startShow(id) {
 
     const targets = computeTargets(items.length, interval, showFirst);
     let inserted = 0;
-    const maxInserts = MAX_INSERTS_PER_RUN + (isBoosted() ? 1 : 0);
+    const perf = getPerfProfile();
+    const maxInserts = perf.maxInsertsPerRun + (isBoosted() ? 1 : 0);
 
     for (const afterPos of targets) {
       if (inserted >= maxInserts) break;
@@ -787,11 +861,16 @@ function startShow(id) {
 
     // remove all wrappers
     try {
-      document.querySelectorAll(`.${WRAP_CLASS}`).forEach((el) => {
-        try { el.remove(); } catch (e) {}
+      withInternalDomChange(() => {
+        document.querySelectorAll(`.${WRAP_CLASS}`).forEach((el) => {
+          try { el.remove(); } catch (e) {}
+        });
       });
     } catch (e) {}
 
+    // reset perf profile cache
+    state.perfProfile = null;
+
     // reset state
     state.cfg = null;
     state.allTopics = [];
@@ -812,9 +891,11 @@ function startShow(id) {
 
   function ensureDomObserver() {
     if (state.domObs) return;
-    state.domObs = new MutationObserver(() => {
+    state.domObs = new MutationObserver((mutations) => {
       if (state.internalDomChange > 0) return;
-      if (!isBlocked()) scheduleRun();
+      if (isBlocked()) return;
+      // Only rescan when NodeBB actually added posts/topics/categories.
+      if (mutationHasRelevantAddedNodes(mutations)) scheduleRun();
     });
     try {
       state.domObs.observe(document.body, { childList: true, subtree: true });

package/public/style.css

@@ -1,40 +1,9 @@
-/* Keep Ezoic wrappers “CLS-safe” and remove the extra vertical spacing Ezoic often injects */
+/* Minimal styling for injected Ezoic wrappers.
+   Spacing (margins/padding) is intentionally NOT forced here, because it can be
+   configured inside Ezoic and may vary by placement/device.
+*/
+
 .ezoic-ad {
   display: block;
   width: 100%;
-  margin: 0 !important;
-  padding: 0 !important;
-  overflow: hidden;
-}
-
-.ezoic-ad > [id^="ezoic-pub-ad-placeholder-"] {
-  margin: 0 !important;
-  padding: 0 !important;
-  min-height: 1px; /* keeps placeholder measurable for IO */
-}
-
-/* Ezoic sometimes wraps in extra spans/divs with margins */
-.ezoic-ad span.ezoic-ad,
-.ezoic-ad .ezoic-ad {
-  margin: 0 !important;
-  padding: 0 !important;
-}
-
-
-/* Collapse empty ad blocks (prevents "holes" when an ad doesn't fill or gets destroyed) */
-.ezoic-ad.is-empty {
-  display: block !important;
-  margin: 0 !important;
-  padding: 0 !important;
-  height: 0 !important;
-  min-height: 0 !important;
-  overflow: hidden !important;
-}
-
-.ezoic-ad {
-  min-height: 0 !important;
-}
-
-.ezoic-ad > [id^="ezoic-pub-ad-placeholder-"] {
-  min-height: 0 !important;
 }