[ PROMPT_NODE_25198 ]
bundle-preload
[ SKILL_DOCUMENTATION ]
## 根据用户意图进行预加载
在需要大型包之前进行预加载,以减少感知延迟。
**示例(在悬停/聚焦时预加载):**
tsx
function EditorButton({ onClick }: { onClick: () => void }) {
const preload = () => {
if (typeof window !== 'undefined') {
void import('./monaco-editor')
}
}
return (
)
}
**示例(在功能标志开启时预加载):**
tsx
function FlagsProvider({ children, flags }: Props) {
useEffect(() => {
if (flags.editorEnabled && typeof window !== 'undefined') {
void import('./monaco-editor').then(mod => mod.init())
}
}, [flags.editorEnabled])
return
{children}
}
`typeof window !== 'undefined'` 的检查可以防止在服务端渲染(SSR)中打包预加载模块,从而优化服务端包体积和构建速度。