From 96f3984dfa63fea76bac53f1c476c1d1f6f24830 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Viliam=20Mih=C3=A1lik?= Date: Sun, 26 Nov 2023 21:48:27 +0100 Subject: [PATCH 1/5] perf: prevent initialization of all links on page --- src/htmx.js | 15 +++++++++++---- 1 file changed, 11 insertions(+), 4 deletions(-) diff --git a/src/htmx.js b/src/htmx.js index e458665f0..9f8352e18 100644 --- a/src/htmx.js +++ b/src/htmx.js @@ -1894,7 +1894,7 @@ return (function () { }); } - function hasChanceOfBeingBoosted() { + function getBoostedWrappers() { return document.querySelector("[hx-boost], [data-hx-boost]"); } @@ -1934,10 +1934,17 @@ return (function () { function findElementsToProcess(elt) { if (elt.querySelectorAll) { - var boostedElts = hasChanceOfBeingBoosted() ? ", a" : ""; - var results = elt.querySelectorAll(VERB_SELECTOR + boostedElts + ", form, [type='submit'], [hx-sse], [data-hx-sse], [hx-ws]," + + var boostedWrappers = getBoostedWrappers(); + var boostedElts = []; + boostedWrappers.forEach(boostWrapper => { + boostedElts.push(...boostWrapper.querySelectorAll('a')) + }); + var results = elt.querySelectorAll(VERB_SELECTOR + ", form, [type='submit'], [hx-sse], [data-hx-sse], [hx-ws]," + " [data-hx-ws], [hx-ext], [data-hx-ext], [hx-trigger], [data-hx-trigger], [hx-on], [data-hx-on]"); - return results; + return [ + ...results, + ...boostedElts, + ]; } else { return []; } From cc3cb02093bcc0aee5a9447c9047dc1838fa24f2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Viliam=20Mih=C3=A1lik?= Date: Sun, 26 Nov 2023 21:59:57 +0100 Subject: [PATCH 2/5] perf: changed loop to queryselector --- src/htmx.js | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/src/htmx.js b/src/htmx.js index 9f8352e18..ff8078fbf 100644 --- a/src/htmx.js +++ b/src/htmx.js @@ -1934,11 +1934,7 @@ return (function () { function findElementsToProcess(elt) { if (elt.querySelectorAll) { - var boostedWrappers = getBoostedWrappers(); - var boostedElts = []; - boostedWrappers.forEach(boostWrapper => { - boostedElts.push(...boostWrapper.querySelectorAll('a')) - }); + var boostedElts = document.querySelectorAll("[hx-boost] a, [data-hx-boost] a"); var results = elt.querySelectorAll(VERB_SELECTOR + ", form, [type='submit'], [hx-sse], [data-hx-sse], [hx-ws]," + " [data-hx-ws], [hx-ext], [data-hx-ext], [hx-trigger], [data-hx-trigger], [hx-on], [data-hx-on]"); return [ From 46f360c8be498573e69820771ae79bc6500c11c0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Viliam=20Mih=C3=A1lik?= Date: Mon, 27 Nov 2023 20:56:35 +0100 Subject: [PATCH 3/5] removed spread operator --- src/htmx.js | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/src/htmx.js b/src/htmx.js index ff8078fbf..d80264906 100644 --- a/src/htmx.js +++ b/src/htmx.js @@ -1934,13 +1934,10 @@ return (function () { function findElementsToProcess(elt) { if (elt.querySelectorAll) { - var boostedElts = document.querySelectorAll("[hx-boost] a, [data-hx-boost] a"); + var boostedElts = document.querySelectorAll("[hx-boost] a, [data-hx-boost] a, [hx-boost]a, [data-hx-boost]a"); var results = elt.querySelectorAll(VERB_SELECTOR + ", form, [type='submit'], [hx-sse], [data-hx-sse], [hx-ws]," + " [data-hx-ws], [hx-ext], [data-hx-ext], [hx-trigger], [data-hx-trigger], [hx-on], [data-hx-on]"); - return [ - ...results, - ...boostedElts, - ]; + return toArray(results).concat(toArray(boostedElts)); } else { return []; } From e422aeca18d2263ff3d637639bbdf2be72558715 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Viliam=20Mih=C3=A1lik?= Date: Mon, 27 Nov 2023 21:27:32 +0100 Subject: [PATCH 4/5] fixed selector --- src/htmx.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/htmx.js b/src/htmx.js index d80264906..fa7e5057a 100644 --- a/src/htmx.js +++ b/src/htmx.js @@ -1934,7 +1934,7 @@ return (function () { function findElementsToProcess(elt) { if (elt.querySelectorAll) { - var boostedElts = document.querySelectorAll("[hx-boost] a, [data-hx-boost] a, [hx-boost]a, [data-hx-boost]a"); + var boostedElts = document.querySelectorAll("[hx-boost] a, [data-hx-boost] a, a[hx-boost], a[data-hx-boost]"); var results = elt.querySelectorAll(VERB_SELECTOR + ", form, [type='submit'], [hx-sse], [data-hx-sse], [hx-ws]," + " [data-hx-ws], [hx-ext], [data-hx-ext], [hx-trigger], [data-hx-trigger], [hx-on], [data-hx-on]"); return toArray(results).concat(toArray(boostedElts)); From f95bc07f3a35a24ab4b8afa64c90d1f3a86c0a50 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Viliam=20Mih=C3=A1lik?= Date: Tue, 28 Nov 2023 15:30:02 +0100 Subject: [PATCH 5/5] use only one query to retrieve elements --- src/htmx.js | 10 +++------- 1 file changed, 3 insertions(+), 7 deletions(-) diff --git a/src/htmx.js b/src/htmx.js index fa7e5057a..93209b181 100644 --- a/src/htmx.js +++ b/src/htmx.js @@ -1894,10 +1894,6 @@ return (function () { }); } - function getBoostedWrappers() { - return document.querySelector("[hx-boost], [data-hx-boost]"); - } - function shouldProcessHxOn(elt) { var attributes = elt.attributes for (var j = 0; j < attributes.length; j++) { @@ -1934,10 +1930,10 @@ return (function () { function findElementsToProcess(elt) { if (elt.querySelectorAll) { - var boostedElts = document.querySelectorAll("[hx-boost] a, [data-hx-boost] a, a[hx-boost], a[data-hx-boost]"); - var results = elt.querySelectorAll(VERB_SELECTOR + ", form, [type='submit'], [hx-sse], [data-hx-sse], [hx-ws]," + + var boostedSelector = ", [hx-boost] a, [data-hx-boost] a, a[hx-boost], a[data-hx-boost]"; + var results = elt.querySelectorAll(VERB_SELECTOR + boostedSelector + ", form, [type='submit'], [hx-sse], [data-hx-sse], [hx-ws]," + " [data-hx-ws], [hx-ext], [data-hx-ext], [hx-trigger], [data-hx-trigger], [hx-on], [data-hx-on]"); - return toArray(results).concat(toArray(boostedElts)); + return results; } else { return []; }