cleanRequestClassForHistory causes duplicate image loads

[ssendev]

cleanRequestClassForHistory() calls cloneNode(true) which causes images to be refetched. If the cleanup is instead moved to the restore phase the additional deep clone can be omitted which is a performance win especially on large documents or documents with lots of images.

One drawback is that if config.requestClass was changed between saving the history entry and restoring it the old class won't be cleaned up (which might be ok since the class was probably also removed from the css and is now a no-op). If that's a corner case that should also be handled it's possible to store the className which needs to be cleaned into the history state.

@@ -1647,13 +1647,11 @@ return (function () {
             return null;
         }
 
-        function cleanInnerHtmlForHistory(elt) {
+        function cleanRequestClassForHistory(elt) {
             var className = htmx.config.requestClass;
-            var clone = elt.cloneNode(true);
-            forEach(findAll(clone, "." + className), function(child){
+            forEach(findAll(elt, "." + className), function(child){
                 removeClassFromElement(child, className);
             });
-            return clone.innerHTML;
         }
 
         function saveHistory() {
@@ -1661,7 +1659,7 @@ return (function () {
             var path = currentPathForHistory || location.pathname+location.search;
             triggerEvent(getDocument().body, "htmx:beforeHistorySave", {path:path, historyElt:elt});
             if(htmx.config.historyEnabled) history.replaceState({htmx:true}, getDocument().title, window.location.href);
-            saveToHistoryCache(path, cleanInnerHtmlForHistory(elt), getDocument().title, window.scrollY);
+            saveToHistoryCache(path, elt.innerHTML, getDocument().title, window.scrollY);
         }
 
         function pushUrlIntoHistory(path) {
@@ -1707,6 +1705,7 @@ return (function () {
             var cached = getCachedHistory(path);
             if (cached) {
                 var fragment = makeFragment(cached.content);
+                cleanRequestClassForHistory(fragment);
                 var historyElement = getHistoryElement();
                 var settleInfo = makeSettleInfo(historyElement);
                 swapInnerHTML(historyElement, fragment, settleInfo)