wehub-skill-sync
913 B
913 B
title, impact, impactDescription, tags
| title | impact | impactDescription | tags |
|---|---|---|---|
| 延迟加载非关键第三方库 | MEDIUM | 在水合后加载 | bundle, third-party, analytics, defer |
延迟加载非关键第三方库
分析、日志记录和错误追踪不会阻塞用户交互。应在水合之后加载它们。
错误做法（阻塞初始包）：
import { Analytics } from '@vercel/analytics/react'
export default function RootLayout({ children }) {
return (
<html>
<body>
{children}
<Analytics />
</body>
</html>
)
}
正确做法（在水合后加载）：
import dynamic from 'next/dynamic'
const Analytics = dynamic(
() => import('@vercel/analytics/react').then(m => m.Analytics),
{ ssr: false }
)
export default function RootLayout({ children }) {
return (
<html>
<body>
{children}
<Analytics />
</body>
</html>
)
}