Safari taking much, much longer to generate image than FF or Chrome

[rbruckheimer]

Please make sure you are testing with the latest release of html2canvas. Old versions are not supported and issues reported for them will be closed.

Please follow the general troubleshooting steps first:

• [x] You are using the latest version
• [x] You are testing using the non-minified version of html2canvas and checked any potential issues reported in the console

Bug reports:

I have a page with about 3000 DOM nodes and Safari needs about 30 seconds to walk through and clone them all in DocumentCloner.prototype.cloneNode() function. FF and Chrome take about 3 seconds. The more nodes there are, the slower Safari gets. I think we can greatly optimize the cloneNode recursion by not cloning nodes with style.display === "none". I propose this change within the function; please let me know if I am missing something:

            if (window && isElementNode(node) && (isHTMLElementNode(node) || isSVGElementNode(node))) {
                var clone = this.createElementClone(node);
                clone.style.transitionProperty = 'none';
                var style = window.getComputedStyle(node);
                if(style.display === "none") return clone;   // ADD THIS LINE HERE
                var styleBefore = window.getComputedStyle(node, ':before');
                var styleAfter = window.getComputedStyle(node, ':after');
                if (this.referenceElement === node && isHTMLElementNode(clone)) {
                    this.clonedReferenceElement = clone;
                }

Specifications:

• html2canvas version tested with: 1.4.1
• Browser & version: Safari 16.5.2
• Operating system: MacOS 13.4.1