structure: state/CURRENT.md — 2-4 line session state (rewritten each session) events/ — json event bus (pull-based, optional context) persistent/ — important decisions (one doc per decision) emit — helper script for emitting events
564 B
564 B
| title | impact | impactDescription | tags |
|---|---|---|---|
| Use Activity Component for Show/Hide | MEDIUM | preserves state/DOM | rendering, activity, visibility, state-preservation |
Use Activity Component for Show/Hide
Use React's <Activity> to preserve state/DOM for expensive components that frequently toggle visibility.
Usage:
import { Activity } from 'react'
function Dropdown({ isOpen }: Props) {
return (
<Activity mode={isOpen ? 'visible' : 'hidden'}>
<ExpensiveMenu />
</Activity>
)
}
Avoids expensive re-renders and state loss.