perfectionist-plugins 2.0.0 → 2.4.1

package/better-client.js

@@ -1,5 +1,5 @@
 const PLUGIN_ID = "better-client";
-const version = "1.2.0";
+const version = "1.7.0";
 
 const MAX_CACHE_ENTRIES = 24;
 const MAX_CACHE_ENTRY_BYTES = 2 * 1024 * 1024;
@@ -7,17 +7,23 @@ const MAX_CACHE_BYTES = 16 * 1024 * 1024;
 const UNGATE_MS = 1000;
 const UNGATE_IDLE_MS = 5000;
 const UNGATE_BACKOFF_AFTER = 20;
-const PHASE_POLL_MS = 5000;
-const IMAGE_BATCH = 200;
-
+const PHASE_POLL_FALLBACK_MS = 15000;
+const IMAGE_BATCH = 160;
+const IMAGE_QUEUE_LIMIT = 4000;
+const DECISION_CACHE_LIMIT = 256;
 const TELEMETRY_HOST = /(^|\.)(telemetry|analytics|metrics|sentry|bugsnag|crash-?report(er)?|pulse|tracking|beacon|datadog|loggly)(\.|:|$)/i;
-const TELEMETRY_PATH = /(^|\/)(lol-telemetry|lol-analytics|lol-metrics|lol-rms|rms|lol-sentry|lol-crash|telemetry|analytics|metrics|sentry|bugsnag|crash-?report\w*|tracking|beacon)(\/|$)/i;
+const TELEMETRY_PATH = /(^|\/)(lol-telemetry|lol-analytics|lol-metrics|lol-rms|rms|lol-sentry|lol-crash|telemetry|analytics|metrics|sentry|bugsnag|crash-?report\w*|tracking|beacon|tracing)(\/|\?|$)/i;
 const ASSET_PATH = /^\/lol-game-data\/assets\//i;
 const LOCAL_HOSTS = new Set(["127.0.0.1", "localhost", "::1"]);
 
+const CHAMP_SELECT_DATA = /^\/lol-champ-select\/v1\/(session|all-grid-champions|pickable-champion-ids|bannable-champion-ids)$/i;
+const CHAMP_SELECT_RETRY_MS = [120, 260, 520];
+
 const STATIC_ENDPOINTS = [
   ["/lol-game-data/assets/", 60 * 60 * 1000],
   ["/lol-perks/v1/perks", 60 * 60 * 1000],
+  ["/riotclient/region-locale", 60 * 1000],
+  ["/lol-summoner/v1/current-summoner", 10 * 1000],
   ["/performance/v1/quickstats", 5000],
 ];
 
@@ -31,8 +37,33 @@ const UNGATE_SELECTORS = [
   ".lol-navigation-item",
   "[class*='friends-list']",
 ];
+const UNGATE_SELECTOR = UNGATE_SELECTORS.join(",");
 const BLOCK_MARKER = "[disabled], [aria-disabled='true'], [style*='pointer-events']";
 
+const PERF_STYLE_ID = "perfectionist-better-client-performance";
+const PERFORMANCE_CSS = `
+[class*="blur"], [class*="Blur"], [class*="backdrop"], [class*="Backdrop"] {
+  filter: none !important;
+  backdrop-filter: none !important;
+  -webkit-backdrop-filter: none !important;
+}
+[class*="particle"], [class*="Particle"], [class*="parallax"], [class*="Parallax"],
+[class*="animated-background"], [class*="animatedBackground"], [class*="glow"], [class*="Glow"] {
+  animation: none !important;
+  transition: none !important;
+}
+[class*="background"] video, [class*="Background"] video { display: none !important; }
+`;
+
+const OPTIONS = [
+  {
+    key: "performanceMode",
+    label: "Performance mode",
+    description: "Turns off background blur, decorative animation and looping background video to save GPU and CPU on weaker machines.",
+    default: false,
+  },
+];
+
 let api = null;
 let active = false;
 let phase = "None";
@@ -41,10 +72,14 @@ let restores = [];
 let ungateTimer = null;
 let ungateIdle = 0;
 let phaseTimer = null;
+let phaseWatchListener = null;
+let performanceMode = false;
+let removePerformanceStyle = null;
 let cacheBytes = 0;
 
 const cache = new Map();
 const inflight = new Map();
+const blockDecisions = new Map();
 
 function baseHref() {
   try {
@@ -67,11 +102,24 @@ function isLocalHost(host) {
 }
 
 function isTelemetryUrl(raw, base) {
-  const url = resolveUrl(raw, base);
-  if (!url || url.protocol === "data:" || url.protocol === "blob:") return false;
-  if (ASSET_PATH.test(url.pathname)) return false;
-  if (isLocalHost(url.hostname)) return TELEMETRY_PATH.test(url.pathname);
-  return TELEMETRY_HOST.test(url.hostname) || TELEMETRY_PATH.test(url.pathname);
+  const text = typeof raw === "string" ? raw : urlOf(raw);
+  const memo = blockDecisions.get(text);
+  if (memo !== undefined) return memo;
+
+  let verdict;
+  if (text.startsWith("/") && !text.startsWith("//")) {
+    verdict = !ASSET_PATH.test(text) && TELEMETRY_PATH.test(text);
+  } else {
+    const url = resolveUrl(text, base);
+    if (!url || url.protocol === "data:" || url.protocol === "blob:") verdict = false;
+    else if (ASSET_PATH.test(url.pathname)) verdict = false;
+    else if (isLocalHost(url.hostname)) verdict = TELEMETRY_PATH.test(url.pathname);
+    else verdict = TELEMETRY_HOST.test(url.hostname) || TELEMETRY_PATH.test(url.pathname);
+  }
+
+  if (blockDecisions.size >= DECISION_CACHE_LIMIT) blockDecisions.clear();
+  blockDecisions.set(text, verdict);
+  return verdict;
 }
 
 function shouldBlockUrl(raw, base) {
@@ -140,54 +188,111 @@ function clearVolatileCache() {
   }
 }
 
+function champSelectDataPath(url) {
+  if (!url) return null;
+  return CHAMP_SELECT_DATA.test(url.pathname) ? url.pathname.toLowerCase() : null;
+}
+
+function isEmptyChampSelect(path, json) {
+  if (path.endsWith("/session")) {
+    if (!json || typeof json !== "object") return true;
+    return !Array.isArray(json.myTeam) || json.myTeam.length === 0;
+  }
+  return Array.isArray(json) && json.length === 0;
+}
+
+function champSelectPathOf(rawUrl) {
+  return champSelectDataPath(resolveUrl(rawUrl));
+}
+
+async function primeChampSelect(raw, path) {
+  for (const wait of [0, 120, 240]) {
+    if (wait > 0) await new Promise((resolve) => setTimeout(resolve, wait));
+    try {
+      const response = await raw(path);
+      if (!response?.ok) continue;
+      const json = await response.json();
+      if (!isEmptyChampSelect(path, json)) return;
+    } catch {}
+  }
+}
+
 function createFetch(env) {
   const native = env.fetch.bind(env);
 
+  function repairChampSelect(input, init, request, path) {
+    let attempt = 0;
+    const step = (current) =>
+      current.then((response) => {
+        if (!active || phase !== "ChampSelect" || attempt >= CHAMP_SELECT_RETRY_MS.length) return response;
+        if (!response || !response.ok || !response.clone) return response;
+        return response.clone().json().then(
+          (json) => {
+            if (!isEmptyChampSelect(path, json)) return response;
+            const wait = CHAMP_SELECT_RETRY_MS[attempt];
+            attempt += 1;
+            return new Promise((resolve) => setTimeout(resolve, wait)).then(() => step(native(input, init)));
+          },
+          () => response,
+        );
+      });
+    return step(request);
+  }
+
   function betterFetch(input, init) {
     const raw = urlOf(input);
-    const method = methodOf(input, init);
 
     if (active && shouldBlockUrl(raw)) {
       return Promise.resolve(emptyJsonResponse(env));
     }
 
+    const method = methodOf(input, init);
+    if (method !== "GET" && method !== "HEAD") {
+      return native(input, init);
+    }
+
     const url = resolveUrl(raw);
-    const local = url ? isLocalHost(url.hostname) : false;
-    const cacheable = local && method === "GET";
-    const key = `${method} ${url ? url.origin + url.pathname + url.search : raw}`;
-
-    if (cacheable && active) {
-      const pending = inflight.get(key);
-      if (pending) {
-        return pending.then((response) => (response?.clone ? response.clone() : response));
-      }
+    if (!url || !isLocalHost(url.hostname)) {
+      return native(input, init);
+    }
+
+    const key = `${method} ${url.pathname}${url.search}`;
+    const pending = inflight.get(key);
+    if (pending) {
+      return pending.then((response) => (response?.clone ? response.clone() : response));
     }
 
-    if (cacheable && active) {
-      const ttl = staticTtl(url?.pathname);
-      const hit = ttl ? cache.get(key) : null;
+    const ttl = active ? staticTtl(url.pathname) : 0;
+    if (ttl) {
+      const hit = cache.get(key);
       if (hit && Date.now() - hit.at < hit.ttl) {
         return Promise.resolve(hit.res.clone());
       }
     }
 
-    const request = native(input, init);
-    if (local && (method === "GET" || method === "HEAD")) {
-      inflight.set(key, request);
-      const done = () => inflight.delete(key);
-      request.then(done, done);
-      if (cacheable) {
-        request.then((response) => {
-          const ttl = staticTtl(url?.pathname);
-          if (!response?.ok || !ttl || !active) return;
-          storeInCache(key, ttl, response);
-        }, () => {});
-      }
+    let request = native(input, init);
+    const dataPath = champSelectDataPath(url);
+    if (dataPath && active && phase === "ChampSelect") {
+      request = repairChampSelect(input, init, request, dataPath);
+    }
+
+    inflight.set(key, request);
+    const done = () => inflight.delete(key);
+    request.then(done, done);
+
+    if (ttl) {
+      request.then((response) => {
+        if (!response?.ok || !active) return;
+        storeInCache(key, ttl, response);
+      }, () => {});
     }
-    return request;
+    // Every caller gets its own clone; the original response stays unread so
+    // concurrent callers can clone it after one caller consumes the body.
+    return request.then((response) => (response?.clone ? response.clone() : response));
   }
 
   betterFetch.__better = true;
+  betterFetch.raw = native;
   return betterFetch;
 }
 
@@ -224,6 +329,17 @@ function installXhr(env) {
       emitBlockedXhr(this, env);
       return undefined;
     }
+    const path = champSelectPathOf(this.__betterUrl);
+    const raw = env.fetch?.raw;
+    if (path && raw && active && phase === "ChampSelect" && !this.__betterPrimed) {
+      this.__betterPrimed = true;
+      primeChampSelect(raw, path).finally(() => {
+        try {
+          nativeSend.call(this, body);
+        } catch {}
+      });
+      return undefined;
+    }
     return nativeSend.call(this, body);
   };
   proto.__better = true;
@@ -249,9 +365,16 @@ function installBeacon(env) {
   };
 }
 
+let mediaObserver = null;
+let mediaScanObserver = null;
+let mediaVisibilityListener = null;
+let mediaPaused = new WeakSet();
+
 let imageObserver = null;
 let imageQueue = [];
 let imageFlushTimer = null;
+let imageFlushIdle = false;
+let imageVisibilityListener = null;
 
 function markAsyncDecode(img) {
   if (!img || img.tagName !== "IMG" || img.decoding === "async") return 0;
@@ -263,38 +386,144 @@ function markAsyncDecode(img) {
   }
 }
 
-function flushImageQueue() {
-  imageFlushTimer = null;
-  const batch = imageQueue.splice(0, IMAGE_BATCH);
-  for (const img of batch) markAsyncDecode(img);
-  if (imageQueue.length > 0) scheduleImageFlush();
+function documentView() {
+  try {
+    return document.defaultView ?? null;
+  } catch {
+    return null;
+  }
+}
+
+function pageHidden() {
+  try {
+    return document.hidden === true;
+  } catch {
+    return false;
+  }
 }
 
 function scheduleImageFlush() {
   if (imageFlushTimer !== null) return;
-  imageFlushTimer = setTimeout(flushImageQueue, 150);
+  const view = documentView();
+  if (typeof view?.requestIdleCallback === "function") {
+    imageFlushIdle = true;
+    imageFlushTimer = view.requestIdleCallback(flushImageQueue, { timeout: 600 });
+  } else {
+    imageFlushIdle = false;
+    imageFlushTimer = setTimeout(flushImageQueue, 150);
+  }
 }
 
-function enqueueImages(root) {
-  if (!root || root.nodeType !== 1) return 0;
-  let added = 0;
-  if (root.tagName === "IMG") {
-    imageQueue.push(root);
-    added += 1;
-  }
-  let list = [];
+function cancelImageFlush() {
+  if (imageFlushTimer === null) return;
+  const view = documentView();
+  if (imageFlushIdle && typeof view?.cancelIdleCallback === "function") view.cancelIdleCallback(imageFlushTimer);
+  else clearTimeout(imageFlushTimer);
+  imageFlushTimer = null;
+}
+
+function scanImages(root) {
+  let found;
   try {
-    list = root.querySelectorAll("img:not([decoding='async'])");
+    found = root.querySelectorAll("img[src]:not([decoding='async'])");
   } catch {
-    list = [];
+    return 0;
   }
-  for (const img of list) {
-    imageQueue.push(img);
-    added += 1;
+  let marked = 0;
+  for (const img of found) marked += markAsyncDecode(img);
+  return marked;
+}
+
+function flushImageQueue() {
+  imageFlushTimer = null;
+  if (pageHidden()) {
+    scheduleImageFlush();
+    return;
   }
-  if (imageQueue.length > 6000) imageQueue.splice(0, imageQueue.length - 6000);
-  if (added > 0) scheduleImageFlush();
-  return added;
+  const batch = imageQueue.splice(0, IMAGE_BATCH);
+  for (const root of batch) {
+    if (!root?.isConnected) continue;
+    markAsyncDecode(root);
+    scanImages(root);
+  }
+  if (imageQueue.length > 0) scheduleImageFlush();
+}
+
+function enqueueImages(root) {
+  if (!root || root.nodeType !== 1) return 0;
+  if (imageQueue.length >= IMAGE_QUEUE_LIMIT) return 0;
+  if (root.tagName !== "IMG" && root.childElementCount === 0) return 0;
+  imageQueue.push(root);
+  scheduleImageFlush();
+  return 1;
+}
+
+function pauseDecorativeVideo(video) {
+  if (!video || video.tagName !== "VIDEO" || video.paused) return;
+  if (!video.autoplay && !video.muted) return;
+  try {
+    video.pause();
+    mediaPaused.add(video);
+  } catch {}
+}
+
+function resumeDecorativeVideo(video) {
+  if (!video || !mediaPaused.has(video)) return;
+  mediaPaused.delete(video);
+  try {
+    const play = video.play?.();
+    if (play?.catch) play.catch(() => {});
+  } catch {}
+}
+
+function installMediaIdle() {
+  if (typeof document === "undefined" || !document.documentElement) return () => {};
+  const Obs = document.defaultView?.IntersectionObserver ?? IntersectionObserver;
+  const Mut = document.defaultView?.MutationObserver ?? MutationObserver;
+  if (!Obs || !Mut) return () => {};
+  mediaObserver = new Obs(
+    (entries) => {
+      for (const entry of entries) {
+        if (entry.isIntersecting) resumeDecorativeVideo(entry.target);
+        else pauseDecorativeVideo(entry.target);
+      }
+    },
+    { rootMargin: "240px" },
+  );
+  const scan = () => {
+    for (const video of document.querySelectorAll("video")) {
+      if (video.__betterMedia) continue;
+      video.__betterMedia = true;
+      try {
+        mediaObserver.observe(video);
+      } catch {}
+    }
+  };
+  scan();
+  mediaScanObserver = new Mut(scan);
+  try {
+    mediaScanObserver.observe(document.documentElement, { childList: true, subtree: true });
+  } catch {}
+  mediaVisibilityListener = () => {
+    if (pageHidden()) {
+      for (const video of document.querySelectorAll("video")) pauseDecorativeVideo(video);
+      return;
+    }
+    scan();
+    for (const video of document.querySelectorAll("video")) {
+      if (video.getClientRects().length > 0) resumeDecorativeVideo(video);
+    }
+  };
+  document.addEventListener("visibilitychange", mediaVisibilityListener);
+  return () => {
+    document.removeEventListener("visibilitychange", mediaVisibilityListener);
+    mediaVisibilityListener = null;
+    mediaScanObserver?.disconnect();
+    mediaScanObserver = null;
+    mediaObserver?.disconnect();
+    mediaObserver = null;
+    mediaPaused = new WeakSet();
+  };
 }
 
 function installImageDecode() {
@@ -302,31 +531,37 @@ function installImageDecode() {
   const Obs = document.defaultView?.MutationObserver ?? MutationObserver;
   if (imageObserver || !Obs) return () => {};
   imageObserver = new Obs((records) => {
-    let queued = false;
+    let queued = 0;
     for (const record of records) {
       if (record.type === "attributes") {
-        if (enqueueImages(record.target) > 0) queued = true;
+        if (record.target?.tagName === "IMG") queued += enqueueImages(record.target);
         continue;
       }
-      for (const node of record.addedNodes) {
-        if (node?.nodeType !== 1) continue;
-        if (enqueueImages(node) > 0) queued = true;
+      const nodes = record.addedNodes;
+      for (let index = 0; index < nodes.length; index++) {
+        const node = nodes[index];
+        if (node?.nodeType === 1) queued += enqueueImages(node);
       }
+      if (queued > 400) break;
     }
-    if (queued) scheduleImageFlush();
   });
   try {
-    imageObserver.observe(document.documentElement, { childList: true, subtree: true, attributes: true, attributeFilter: ["src"] });
+    imageObserver.observe(document.documentElement, { childList: true, subtree: true });
   } catch {
     imageObserver = null;
     return () => {};
   }
   enqueueImages(document.documentElement);
-  const sweep = setInterval(() => enqueueImages(document.documentElement), 30000);
+  imageVisibilityListener = () => {
+    if (pageHidden()) return;
+    enqueueImages(document.documentElement);
+    scheduleImageFlush();
+  };
+  document.addEventListener("visibilitychange", imageVisibilityListener);
   return () => {
-    clearInterval(sweep);
-    clearTimeout(imageFlushTimer);
-    imageFlushTimer = null;
+    document.removeEventListener("visibilitychange", imageVisibilityListener);
+    imageVisibilityListener = null;
+    cancelImageFlush();
     imageQueue = [];
     imageObserver?.disconnect();
     imageObserver = null;
@@ -366,16 +601,14 @@ function ungateNode(node) {
 
 function ungatePass() {
   if (!active || phase !== "InProgress") return 0;
-  let changed = 0;
-  for (const selector of UNGATE_SELECTORS) {
-    let nodes = [];
-    try {
-      nodes = document.querySelectorAll(selector);
-    } catch {
-      nodes = [];
-    }
-    for (const node of nodes) changed += ungateNode(node);
+  let nodes;
+  try {
+    nodes = document.querySelectorAll(UNGATE_SELECTOR);
+  } catch {
+    return 0;
   }
+  let changed = 0;
+  for (const node of nodes) changed += ungateNode(node);
   return changed;
 }
 
@@ -386,6 +619,10 @@ function ungateDelay() {
 function ungateTick() {
   ungateTimer = null;
   if (!active || phase !== "InProgress") return;
+  if (pageHidden()) {
+    ungateTimer = setTimeout(ungateTick, UNGATE_IDLE_MS);
+    return;
+  }
   const changed = ungatePass();
   ungateIdle = changed > 0 ? 0 : ungateIdle + 1;
   ungateTimer = setTimeout(ungateTick, ungateDelay());
@@ -416,14 +653,47 @@ function onPhase(next) {
 }
 
 async function refreshPhase() {
-  if (!active) return;
-  if (typeof document !== "undefined" && document.hidden) return;
+  if (!active || pageHidden()) return;
   try {
     const current = await api?.lcu?.get?.("/lol-gameflow/v1/gameflow-phase");
     if (current) onPhase(current);
   } catch {}
 }
 
+function startPhaseWatch() {
+  stopPhaseWatch();
+  if (unsubscribes.length === 0) {
+    phaseTimer = setInterval(() => {
+      if (!pageHidden()) refreshPhase();
+    }, PHASE_POLL_FALLBACK_MS);
+  }
+  phaseWatchListener = () => {
+    if (!pageHidden()) refreshPhase();
+  };
+  document.addEventListener("visibilitychange", phaseWatchListener);
+}
+
+function stopPhaseWatch() {
+  clearInterval(phaseTimer);
+  phaseTimer = null;
+  if (phaseWatchListener) {
+    document.removeEventListener("visibilitychange", phaseWatchListener);
+    phaseWatchListener = null;
+  }
+}
+
+function applyPerformanceMode() {
+  if (!api) return;
+  if (performanceMode) {
+    if (!removePerformanceStyle) removePerformanceStyle = api.addStyle(PERF_STYLE_ID, PERFORMANCE_CSS);
+    return;
+  }
+  if (removePerformanceStyle) {
+    removePerformanceStyle();
+    removePerformanceStyle = null;
+  }
+}
+
 function installNetwork(env) {
   const installed = [];
   try {
@@ -449,7 +719,7 @@ function installNetwork(env) {
 function onEnable(utils) {
   api = utils;
   active = true;
-  restores = [installNetwork(window), installImageDecode()];
+  restores = [installNetwork(window), installImageDecode(), installMediaIdle()];
   unsubscribes = [];
   try {
     const off = api.subscribe("/lol-gameflow/v1/gameflow-phase", onPhase);
@@ -461,16 +731,15 @@ function onEnable(utils) {
       .then((value) => onPhase(value))
       .catch(() => {});
   } catch {}
-  refreshPhase();
-  clearInterval(phaseTimer);
-  phaseTimer = setInterval(refreshPhase, PHASE_POLL_MS);
+  startPhaseWatch();
+  performanceMode = api.getOption?.(PLUGIN_ID, "performanceMode") === true;
+  applyPerformanceMode();
   if (phase === "InProgress") startUngate();
 }
 
 function onDisable() {
   active = false;
-  clearInterval(phaseTimer);
-  phaseTimer = null;
+  stopPhaseWatch();
   stopUngate();
   for (const off of unsubscribes) {
     try {
@@ -484,12 +753,25 @@ function onDisable() {
     } catch {}
   }
   restores = [];
+  if (removePerformanceStyle) {
+    removePerformanceStyle();
+    removePerformanceStyle = null;
+  }
+  performanceMode = false;
   inflight.clear();
+  blockDecisions.clear();
   for (const key of [...cache.keys()]) evictOne(key);
   cacheBytes = 0;
   api = null;
 }
 
+function onOptionChange(key, value) {
+  if (key === "performanceMode") {
+    performanceMode = value === true;
+    applyPerformanceMode();
+  }
+}
+
 export function init() {
   const registerWith = (utils) => {
     utils.registerPlugin({
@@ -499,8 +781,10 @@ export function init() {
         "Debloats the client: blocks telemetry and analytics calls, merges duplicate requests, caches static client data, decodes images asynchronously and keeps settings, chat and friend requests usable during a game.",
       version,
       defaultEnabled: true,
+      options: OPTIONS,
       onEnable,
       onDisable,
+      onOptionChange,
     });
   };