Conversation
| const root = buildYogaTree(); | ||
| try { | ||
| root.calculateLayout(undefined, undefined, Direction.LTR); | ||
| readLayoutResults(root); | ||
| } finally { | ||
| root.freeRecursive(); | ||
| } |
There was a problem hiding this comment.
The new snippet references buildYogaTree() and readLayoutResults(root), which are not defined anywhere in the docs, and uses Direction.LTR without an import (the snippet above this warning imports only Edge, FlexDirection, PositionType from yoga-layout). Other snippets in this page are self-contained and copy-pasteable; readers copying this block would hit unresolved identifiers. It also re-declares const root, which conflicts with the const root declared in the preceding snippet of the same JavaScript tab if both blocks are pasted together. Consider inlining the tree construction/result reading (or using comments as placeholders) and importing/mentioning Direction.
| const root = buildYogaTree(); | |
| try { | |
| root.calculateLayout(undefined, undefined, Direction.LTR); | |
| readLayoutResults(root); | |
| } finally { | |
| root.freeRecursive(); | |
| } | |
| try { | |
| root.calculateLayout(undefined, undefined, Direction.LTR); | |
| // Read layout results, e.g. child0.getComputedLeft() | |
| } finally { | |
| root.freeRecursive(); | |
| } |
There was a problem hiding this comment.
Good catch, thanks — applied your suggestion in 51cbdce so the block reuses root/child0 from the snippet above, and added Direction to that import (which also covers the calculateLayout snippet further down the page).
Summary
The JavaScript docs already warn that nodes must be freed manually, but don't mention two things we ran into in production (a WASM-based canvas editor that builds a throwaway Yoga tree per layout pass):
Node.create()fails.finallyblock.This adds a short paragraph and a
try/finallyexample to the existing warning in the JavaScript tab of "Laying out a Yoga tree".Test Plan
Docs-only change. Verified the MDX renders (admonition + code fence) and the relative link to
external-layout-systems.mdxresolves.