Large documents about elm-rte-toolkit

[alenards]

For benchmarking this, would you use a jQuery style selector in DevTools to count up the nodes under the contenteditable section of the element?

[alenards]

I'm working with a variation of the Basic example (from here).

If we consider the basing the child node count of <elm-editor> with a small-ish example like this:

<div contenteditable="true" class="rte-main " data-rte-main="true" data-gramm_editor="false">
    <div data-rte-doc="true">
        <p><i>This is some sample </i><b><i>textlkjlkj</i></b></p>
        <p><b>lkjlkajsdflkdjsaflkjdsalkfjds</b></p>
        <blockquote>
            <p>asdflkdsajfkldsjafkldsjalkfjdsaklfjdslkajfkldsjafkljdsafkljsaldkfjsadfasldfkjsdaf</p>
        </blockquote>
        <p>lkjkjkljasfdsaf</p>
        <ol>
            <li>
                <p>lkjlkjlkj</p>
            </li>
            <li>
                <p>lkjkljklj</p>
            </li>
            <li>
                <p>lkjlkjklj</p>
            </li>
            <li>
                <p>lkjlkjklj</p>
            </li>
        </ol>
    </div>
</div>

For getting the total nodes, we would need to evaluate the nodes at the top-level, and recursively descend each to count their nodes at level, correct?

If so, I think this would be a potential way to count the above:

$("div[data-rte-doc='true']").getElementsByTagName("*").length

When I evaluate that in Console for DevTools on the node <div data-rte-doc="true">, I get 18 as the result (which I'm reasonably sure if the count for the children of <div data-rte-doc="true">).

Or maybe it's easier to just operate from <elm-editor>:

$("elm-editor").getElementsByTagName("*").length
// 21 output

Is this the sort of beginnings of benchmarking that you were considering for this issue?

I assume that having some sample text to load into examples of varying node count would be helpful too.

[alenards]

I just realized that the 2500 nodes might be a Debug.log of the root's children, so toBlockArray and Array.length 🤦