Core Concepts

Taffy has a small API surface, but a consistent layout model. This section gives you the concepts to reason about any layout.

The Three Core Objects

Layout in Taffy is driven by three primary objects:

1. Style: Defines the layout rules for a node (e.g., "be a flex container", "have 10px padding").
2. TaffyTree: Manages the node hierarchy and serves as the entry point for calculations.
3. Layout: The output of the computation, containing final positions and sizes.

Style + Tree  -> computeLayout -> Layout

Fundamental Principles

Beyond the core objects, there are several key principles to understand:

• Size, Space, and Units: How Taffy handles fixed sizes, percentages, and content-based sizing.
• Measure Functions: Integrating custom sizing logic for text or platform-specific widgets.
• Tree Model: Every node can have children, and parents control their placement along axes.

Next Steps

• The Style Object
• Size, Space, and Units
• Layout Cookbook