mirror of
https://github.com/bitsocialnet/5chan.git
synced 2026-08-03 07:41:04 +02:00
Tommaso CasaburiandGitHub
a92b185a66
* 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.
32 lines
949 B
Markdown
32 lines
949 B
Markdown
---
|
|
title: Conditional Module Loading
|
|
impact: HIGH
|
|
impactDescription: loads large data only when needed
|
|
tags: bundle, conditional-loading, lazy-loading
|
|
---
|
|
|
|
## Conditional Module Loading
|
|
|
|
Load large data or modules only when a feature is activated.
|
|
|
|
**Example (lazy-load animation frames):**
|
|
|
|
```tsx
|
|
function AnimationPlayer({ enabled, setEnabled }: { enabled: boolean; setEnabled: React.Dispatch<React.SetStateAction<boolean>> }) {
|
|
const [frames, setFrames] = useState<Frame[] | null>(null)
|
|
|
|
useEffect(() => {
|
|
if (enabled && !frames && typeof window !== 'undefined') {
|
|
import('./animation-frames.js')
|
|
.then(mod => setFrames(mod.frames))
|
|
.catch(() => setEnabled(false))
|
|
}
|
|
}, [enabled, frames, setEnabled])
|
|
|
|
if (!frames) return <Skeleton />
|
|
return <Canvas frames={frames} />
|
|
}
|
|
```
|
|
|
|
The `typeof window !== 'undefined'` check prevents bundling this module for SSR, optimizing server bundle size and build speed.
|