minor refactoring

lib/lazy/content-lazy-loader.js

@@ -22,44 +22,39 @@
 
 this.lazyLoader = this.lazyLoader || (() => {
 
-	const LAZY_LOADING_TIMEOUT = 500;
+	const LAZY_LOADING_TIMEOUT = 1000;
 	const MAX_LAZY_LOADING_TIMEOUT = 30000;
 
 	return { process };
 
 	async function process() {
-		const scriptURL = browser.runtime.getURL("lib/lazy/lazy-loader-before.js");
+		const scriptURL = browser.runtime.getURL("lib/lazy/web-lazy-loader-before.js");
 		const scriptBeforeElement = document.createElement("script");
 		scriptBeforeElement.src = scriptURL;
 		document.body.appendChild(scriptBeforeElement);
-		let timeoutId;
+		let timeoutId, maxTimeoutId;
 		const promise = new Promise(resolve => {
 			scriptBeforeElement.onload = () => scriptBeforeElement.remove();
-			const observer = new MutationObserver(mutationsList => {
-				mutationsList.forEach(mutation => {
-					if (mutation.attributeName == "src" || mutation.attributeName == "srcset") {
-						timeoutId = deferLazyLoadEnd(timeoutId, observer, resolve);
-					}
-				});
-			});
-			observer.observe(document, { attributes: true, childList: true, subtree: true });
-			timeoutId = deferLazyLoadEnd(timeoutId, observer, resolve);
-			timeout.set(() => {
+			const observer = new MutationObserver(() => timeoutId = deferLazyLoadEnd(timeoutId, maxTimeoutId, observer, resolve));
+			observer.observe(document, { attributeFilter: ["src", "srcset"], subtree: true });
+			timeoutId = deferLazyLoadEnd(timeoutId, maxTimeoutId, observer, resolve);
+			maxTimeoutId = timeout.set(() => {
 				timeout.clear(timeoutId);
-				lazyLoadEnd(observer, resolve);
+				lazyLoadEnd(maxTimeoutId, observer, resolve);
 			}, MAX_LAZY_LOADING_TIMEOUT);
 		});
 		return promise;
 	}
 
-	function deferLazyLoadEnd(timeoutId, observer, resolve) {
+	function deferLazyLoadEnd(timeoutId, maxTimeoutId, observer, resolve) {
 		timeout.clear(timeoutId);
-		return timeout.set(() => lazyLoadEnd(observer, resolve), LAZY_LOADING_TIMEOUT);
+		return timeout.set(() => lazyLoadEnd(maxTimeoutId, observer, resolve), LAZY_LOADING_TIMEOUT);
 	}
 
-	function lazyLoadEnd(observer, resolve) {
-		resolve();
-		const scriptURL = browser.runtime.getURL("lib/lazy/lazy-loader-after.js");
+	function lazyLoadEnd(maxTimeoutId, observer, resolve) {
+		timeout.clear(maxTimeoutId);
+		timeout.set(resolve, LAZY_LOADING_TIMEOUT);
+		const scriptURL = browser.runtime.getURL("lib/lazy/web-lazy-loader-after.js");
 		const scriptAfterElement = document.createElement("script");
 		scriptAfterElement.src = scriptURL;
 		document.body.appendChild(scriptAfterElement);

lib/lazy/lazy-loader-before.js → lib/lazy/web-lazy-loader-before.js

@@ -31,6 +31,7 @@
 		const left = (boundingRect.left > 0 && boundingRect.left < screen.width) ? boundingRect.left : boundingRect.left > screen.width ? screen.width - quarterLeft : quarterLeft;
 		const bottom = top + boundingRect.height;
 		const right = left + boundingRect.width;
+		// console.log({ x: boundingRect.x, y: boundingRect.y, top, bottom, left, right, width: boundingRect.width, height: boundingRect.height });
 		return { x: boundingRect.x, y: boundingRect.y, top, bottom, left, right, width: boundingRect.width, height: boundingRect.height };
 	};
 	scrollBy(0, 1);

manifest.json

@@ -115,8 +115,8 @@
 	},
 	"incognito": "spanning",
 	"web_accessible_resources": [
-		"lib/lazy/lazy-loader-before.js",
-		"lib/lazy/lazy-loader-after.js"
+		"lib/lazy/web-lazy-loader-before.js",
+		"lib/lazy/web-lazy-loader-after.js"
 	],
 	"manifest_version": 2,
 	"default_locale": "en"