Using transition on "all" properties with that amount of styles causes geometry to be regenerated each frame. Because the previous geometry may still be used by the render thread, we cannot touch it right away, and we allocate the geometry to another range in memory.

Having an "out of order" section in a render buffer is not breaking a batch in itself, but with the provided examples, the two first pages are close to be full to begin with. A third page is allocated for the geometry, and draw calls between pages do break batches as they are changing the GPU configuration and are way more expensive.

We intend on exposing control over the pages sizes and some allocation/defragmentation behaviors on the long run, as this would allow optimizing situation such as the one encountered.

For the time being, the allocations could be omitted if the transition occurs only on some properties. The transform (translate, rotate, scale) and colors usually are accelerated and don't need any geometry changes. Every changes that would affect the layout would guarantee some allocation at this moment (width, flex values, text size).