[ PROMPT_NODE_27930 ]
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 时打包预加载的模块,从而优化服务端包体积和构建速度。