mirror of
https://github.com/bitsocialnet/5chan.git
synced 2026-08-03 07:41:04 +02:00
* chore(ai-workflow): track repo-managed review tooling * fix(ai-workflow): remove repo-specific path assumptions Make shared workflow hooks and APK testing guidance resolve paths from the repo and contributor environment so the tooling works for all contributors, not just one machine.
30 lines
728 B
Markdown
30 lines
728 B
Markdown
---
|
|
title: Subscribe to Derived State
|
|
impact: MEDIUM
|
|
impactDescription: reduces re-render frequency
|
|
tags: rerender, derived-state, media-query, optimization
|
|
---
|
|
|
|
## Subscribe to Derived State
|
|
|
|
Subscribe to derived boolean state instead of continuous values to reduce re-render frequency.
|
|
|
|
**Incorrect (re-renders on every pixel change):**
|
|
|
|
```tsx
|
|
function Sidebar() {
|
|
const width = useWindowWidth() // updates continuously
|
|
const isMobile = width < 768
|
|
return <nav className={isMobile ? 'mobile' : 'desktop'} />
|
|
}
|
|
```
|
|
|
|
**Correct (re-renders only when boolean changes):**
|
|
|
|
```tsx
|
|
function Sidebar() {
|
|
const isMobile = useMediaQuery('(max-width: 767px)')
|
|
return <nav className={isMobile ? 'mobile' : 'desktop'} />
|
|
}
|
|
```
|