Modernize code and improve readability

Author: XhmikosR

src/chunks.mjs

@@ -32,9 +32,11 @@ const toPrefetch = new Set();
  * @return {Boolean}          If true, then it should be ignored
  */
 function isIgnored(node, filter) {
-  return Array.isArray(filter) ?
-    filter.some(x => isIgnored(node, x)) :
-    (filter.test || filter).call(filter, node.href, node);
+  if (Array.isArray(filter)) {
+    return filter.some(x => isIgnored(node, x));
+  }
+
+  return (filter.test || filter).call(filter, node.href, node);
 }
 
 /**
@@ -59,8 +61,8 @@ function isIgnored(node, filter) {
 export function listen(options = {}) {
   if (!window.IntersectionObserver) return;
 
-  const [toAdd, isDone] = throttle(options.throttle || 1 / 0);
-  const limit = options.limit || 1 / 0;
+  const [toAdd, isDone] = throttle(options.throttle || Number.Infinity);
+  const limit = options.limit || Number.Infinity;
 
   const allowed = options.origins || [location.hostname];
   const ignores = options.ignores || [];
@@ -79,36 +81,37 @@ export function listen(options = {}) {
   };
 
   const observer = new IntersectionObserver(entries => {
-    entries.forEach(entry => {
-      if (entry.isIntersecting) {
-        observer.unobserve(entry = entry.target);
-        // Do not prefetch if will match/exceed limit
-        if (toPrefetch.size < limit) {
-          toAdd(() => {
-            prefetchChunks ?
-              prefetchChunks(entry, prefetchHandler) :
-              prefetchHandler(entry.href);
-          });
-        }
+    for (const {isIntersecting, target} of entries) {
+      if (!isIntersecting) continue;
+
+      observer.unobserve(target);
+      // Do not prefetch if will match/exceed limit
+      if (toPrefetch.size < limit) {
+        toAdd(() => {
+          prefetchChunks ?
+            prefetchChunks(target, prefetchHandler) :
+            prefetchHandler(target.href);
+        });
       }
-    });
+    }
   });
 
   timeoutFn(() => {
     // Find all links & Connect them to IO if allowed
-    (options.el || document).querySelectorAll('a').forEach(link => {
+    const links = (options.el || document).querySelectorAll('a[href]');
+    for (const link of links) {
       // If the anchor matches a permitted origin
       // ~> A `[]` or `true` means everything is allowed
       if (!allowed.length || allowed.includes(link.hostname)) {
         // If there are any filters, the link must not match any of them
         if (!isIgnored(link, ignores)) observer.observe(link);
       }
-    });
+    }
   }, {
     timeout: options.timeout || 2000,
   });
 
-  return function () {
+  return () => {
     // wipe url list
     toPrefetch.clear();
     // detach IO entries
@@ -124,30 +127,27 @@ export function listen(options = {}) {
  */
 export function prefetch(url, isPriority) {
   const {connection} = navigator;
+  if (!connection) return Promise.resolve();
 
-  if (connection) {
-    // Don't prefetch if using 2G or if Save-Data is enabled.
-    if (connection.saveData) {
-      return Promise.reject(new Error('Cannot prefetch, Save-Data is enabled'));
-    }
+  // Don't prefetch if using 2G or if Save-Data is enabled.
+  if (connection.saveData) {
+    return Promise.reject(new Error('Cannot prefetch, Save-Data is enabled'));
+  }
 
-    if (/2g/.test(connection.effectiveType)) {
-      return Promise.reject(new Error('Cannot prefetch, network conditions are poor'));
-    }
+  if (/2g/.test(connection.effectiveType)) {
+    return Promise.reject(new Error('Cannot prefetch, network conditions are poor'));
   }
 
   // Dev must supply own catch()
   return Promise.all(
-      [].concat(url).map(str => {
+      [url].flat().map(str => {
         if (toPrefetch.has(str)) return [];
 
         // Add it now, regardless of its success
         // ~> so that we don't repeat broken links
         toPrefetch.add(str);
 
-        return (isPriority ? viaFetch : supported)(
-            new URL(str, location.href).toString(),
-        );
+        return (isPriority ? viaFetch : supported)(new URL(str, location.href).toString());
       }),
   );
 }

src/index.mjs

@@ -49,15 +49,17 @@ function isIgnored(node, filter) {
  * @return {Boolean|Object}  Error Object if the constrainsts are met or boolean otherwise
  */
 function checkConnection(conn) {
-  if (conn) {
-    // Don't pre* if using 2G or if Save-Data is enabled.
-    if (conn.saveData) {
-      return new Error('Save-Data is enabled');
-    }
+  // If no connection object, assume it's okay to prefetch
+  if (!conn) return true;
 
-    if (/2g/.test(conn.effectiveType)) {
-      return new Error('network conditions are poor');
-    }
+  // Don't prefetch if Save-Data is enabled.
+  if (conn.saveData) {
+    return new Error('Save-Data is enabled');
+  }
+
+  // Don't prefetch if using 2G connection.
+  if (/2g/.test(conn.effectiveType)) {
+    return new Error('network conditions are poor');
   }
 
   return true;
@@ -119,7 +121,7 @@ export function listen(options = {}) {
   };
 
   const observer = new IntersectionObserver(entries => {
-    entries.forEach(entry => {
+    for (let entry of entries) {
       // On enter
       if (entry.isIntersecting) {
         entry = entry.target;
@@ -165,37 +167,33 @@ export function listen(options = {}) {
       } else {
         entry = entry.target;
         const index = hrefsInViewport.indexOf(entry.href);
-        if (index > -1) {
+        if (index !== -1) {
           hrefsInViewport.splice(index);
         }
       }
-    });
+    }
   }, {
     threshold,
   });
 
   timeoutFn(() => {
     // Find all links & Connect them to IO if allowed
-    const elementsToListen = options.el &&
-      options.el.length &&
-      options.el.length > 0 &&
-      options.el[0].nodeName === 'A' ?
-      options.el :
-      (options.el || document).querySelectorAll('a');
-
-    elementsToListen.forEach(link => {
+    const isAnchorElement = options.el && options.el.length > 0 && options.el[0].nodeName === 'A';
+    const elementsToListen = isAnchorElement ? options.el : (options.el || document).querySelectorAll('a');
+
+    for (const link of elementsToListen) {
       // If the anchor matches a permitted origin
       // ~> A `[]` or `true` means everything is allowed
       if (!allowed.length || allowed.includes(link.hostname)) {
         // If there are any filters, the link must not match any of them
         if (!isIgnored(link, ignores)) observer.observe(link);
       }
-    });
+    }
   }, {
     timeout: options.timeout || 2000,
   });
 
-  return function () {
+  return () => {
     // wipe url list
     toPrefetch.clear();
     // detach IO entries
@@ -225,15 +223,21 @@ export function prefetch(urls, isPriority, checkAccessControlAllowOrigin, checkA
 
   // Dev must supply own catch()
   return Promise.all(
-      [].concat(urls).map(str => {
+      [urls].flat().map(str => {
         if (toPrefetch.has(str)) return [];
 
         // Add it now, regardless of its success
         // ~> so that we don't repeat broken links
         toPrefetch.add(str);
 
-        return prefetchOnHover((isPriority ? viaFetch : supported), new URL(str, location.href).toString(), onlyOnMouseover,
-            checkAccessControlAllowOrigin, checkAccessControlAllowCredentials, isPriority);
+        return prefetchOnHover(
+          isPriority ? viaFetch : supported,
+          new URL(str, location.href).toString(),
+          onlyOnMouseover,
+          checkAccessControlAllowOrigin,
+          checkAccessControlAllowCredentials,
+          isPriority,
+        );
       }),
   );
 }
@@ -258,7 +262,7 @@ export function prerender(urls, eagerness = 'immediate') {
     return Promise.reject(new Error('This browser does not support the speculation rules API. Falling back to prefetch.'));
   }
 
-  for (const url of [].concat(urls)) {
+  for (const url of [urls].flat()) {
     toPrerender.add(url);
   }
 

src/prefetch.mjs

@@ -46,7 +46,7 @@ function viaDOM(url, hasCrossorigin) {
     link.onload = resolve;
     link.onerror = reject;
 
-    document.head.appendChild(link);
+    document.head.append(link);
   });
 }
 
@@ -97,7 +97,7 @@ export function viaFetch(url, hasModeCors, hasCredentials, isPriority) {
   const options = {headers: {accept: '*/*'}};
   if (!hasModeCors) options.mode = 'no-cors';
   if (hasCredentials) options.credentials = 'include';
-  isPriority ? options.priority = 'high' : options.priority = 'low';
+  options.priority = isPriority ? 'high' : 'low';
   return window.fetch ? fetch(url, options) : viaXHR(url, hasCredentials);
 }
 
@@ -116,7 +116,7 @@ export function prefetchOnHover(callback, url, onlyOnMouseover, ...args) {
   const timerMap = new Map();
 
   for (const el of elements) {
-    const mouseenterListener = _ => {
+    const mouseenterListener = () => {
       const timer = setTimeout(() => {
         el.removeEventListener('mouseenter', mouseenterListener);
         el.removeEventListener('mouseleave', mouseleaveListener);
@@ -125,7 +125,7 @@ export function prefetchOnHover(callback, url, onlyOnMouseover, ...args) {
       timerMap.set(el, timer);
     };
 
-    const mouseleaveListener = _ => {
+    const mouseleaveListener = () => {
       const timer = timerMap.get(el);
       if (timer) {
         clearTimeout(timer);

src/prerender.mjs

@@ -26,11 +26,16 @@
 export function addSpeculationRules(urlsToPrerender, eagerness) {
   const specScript = document.createElement('script');
   specScript.type = 'speculationrules';
-  specScript.text = `{"prerender":[{"source": "list",
-                      "urls": ["${Array.from(urlsToPrerender).join('","')}"],
-                      "eagerness": "${eagerness}"}]}`;
+  specScript.text =
+    '{' +
+    '"prerender":[{' +
+    '"source":"list",' +
+    `"urls":["${[...urlsToPrerender].join('","')}"],` +
+    `"eagerness":"${eagerness}"` +
+    '}]}';
+
   try {
-    document.head.appendChild(specScript);
+    document.head.append(specScript);
   } catch (error) {
     return error;
   }

src/request-idle-callback.mjs

@@ -16,16 +16,14 @@
 
 // RIC and shim for browsers setTimeout() without it
 const requestIdleCallback = window.requestIdleCallback ||
-  function (cb) {
+  (cb => {
     const start = Date.now();
     return setTimeout(() => {
       cb({
         didTimeout: false,
-        timeRemaining() {
-          return Math.max(0, 50 - (Date.now() - start));
-        },
+        timeRemaining: () => Math.max(0, 50 - (Date.now() - start)),
       });
     }, 1);
-  };
+  });
 
 export default requestIdleCallback;