Performance significantly drops for nested HTML

[Xapphire13]

The rendering performance of interweave significantly drops as the number of nested elements increases. I noticed an exponential slowdown in rendering performance as the depth of HTML approaches 20. Performance is further reduced when a transform function is provided.

I've attached a sample app to demonstrate the issue with very simple HTML and an empty transform function
https://replit.com/@Xapphire13/Interweave-Transform-Bug#src/App.tsx

To render a depth of 15, it took ~90ms
To render a depth of 21, it took ~5s (55x longer)

Sample HTML for clarity/ease:

<div id="1">
  <div id="2">
    <div id="3">
      <div id="4">
        <div id="5">
          <div id="6">
            <div id="7">
              <div id="8">
                <div id="9">
                  <div id="10">
                    <div id="11">
                      <div id="12">
                        <div id="13">
                          <div id="14">
                            <div id="15">
                              <div id="16">
                                <div id="17">
                                  <div id="18">
                                    <div id="19">
                                      <div id="20">
                                        <div id="21">
                                          Test
                                        </div>
                                      </div>
                                    </div>
                                  </div>
                                </div>
                              </div>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

[overtureweb]

This is interesting, I copy/pasted your nested code example into my project that uses Interweave and I'm not seeing any performance issues. I'm running it locally (React-Typescript-Vite) and the compiled code on the my server (Cloudfront/S3 web server) and the load times are nearly identical to when I don't include that block of nested divs.

[iwan-uschka]

@overtureweb can you please provide some info about your configuration:

1. version of interweave
2. usage of transform

I just ran into the same problem using [email protected] and [email protected], a simple transform function and a string containing HTML with a nesting depth of 36. The increase in CPU usage without transform is not as bad as with it.

It crashed our infrastructure because the node application pods kept restarting over and over again 😱 And it was hard to debug 😵‍💫