Skip to content

Improve layout recalculation performance for small scoped changes #917

@PPakalns

Description

@PPakalns

What problem does this solve or what need does it fill?

Taffy layout recalculation is very costly. It is observable in situations where deeply nested interactive widget changes internal layout that doesn't affect the layout outside node.

Currently, this small change invalidates all taffy layout cache until root node. It is costly to recalculate all these nodes, especially if such widget is inside grid. I think it requires visitation of all grid nodes that could be in hundreds / thousands.

What solution would you like?

Provide solutions where some kind of layout changes could be scoped.

From discussion (in bevy)

Discord comment by @nicoburns :

Improve the layout engine (Taffy) so that it avoids full layout recalculation when it is not necessary.

However, I also think this would be possible. There are two optimisations that come to mind as being relatively easy to implement:

  • Implement support for the CSS contain property. This is a CSS property specifically designed to create the sort of "isolation boundaries" we want. In particular I think contain: size which turns off "content-based sizing" for a node would help a lot here.
  • Scope dirty marking to position: absolute nodes, such that changes within the node don't escape out of it (so long as the position:absolute node has at least one left/right inset and at least one top/bottom inset specified).

Additional context

Perormance impact is very visible in bevy with interactive widgets, scrollbars, etc:
bevyengine/bevy#22909
bevyengine/bevy#22914

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions