963 markdown files reformatted with the repository's pinned prettier so pnpm format:check covers the folded tree like every other repo file. The formatter's embedded-language pass also normalized code fences (TS semicolons, closed HTML tags in examples, lowercased CSS hex colors, one renumbered list that skipped an index). Alphanumeric token deltas vs the fold commit were audited file-by-file; all are formatter-equivalent markup normalizations plus the four sanitized skills.
1.3 KiB
1.3 KiB
title, impact, impactDescription, tags
| title | impact | impactDescription | tags |
|---|---|---|---|
| Use contentInset for Dynamic ScrollView Spacing | LOW | smoother updates, no layout recalculation | scrollview, layout, contentInset, performance |
Use contentInset for Dynamic ScrollView Spacing
When adding space to the top or bottom of a ScrollView that may change
(keyboard, toolbars, dynamic content), use contentInset instead of padding.
Changing contentInset doesn't trigger layout recalculation—it adjusts the
scroll area without re-rendering content.
Incorrect (padding causes layout recalculation):
function Feed({ bottomOffset }: { bottomOffset: number }) {
return (
<ScrollView contentContainerStyle={{ paddingBottom: bottomOffset }}>{children}</ScrollView>
);
}
// Changing bottomOffset triggers full layout recalculation
Correct (contentInset for dynamic spacing):
function Feed({ bottomOffset }: { bottomOffset: number }) {
return (
<ScrollView
contentInset={{ bottom: bottomOffset }}
scrollIndicatorInsets={{ bottom: bottomOffset }}
>
{children}
</ScrollView>
);
}
// Changing bottomOffset only adjusts scroll bounds
Use scrollIndicatorInsets alongside contentInset to keep the scroll
indicator aligned. For static spacing that never changes, padding is fine.