Pattern: Synchronous script tag
Issue: -
Synchronous script tags block the page rendering and should be avoided in Next.js applications. Use the Script component from next/script instead for better performance and control over script loading.
Example of incorrect code:
<head>
<script src="/analytics.js" />
<script>{`console.log('inline')`}</script>
</head>
Example of correct code:
import Script from 'next/script'
export default function Page() {
return (
<>
<Script src="/analytics.js" strategy="afterInteractive" />
<Script id="inline">{`console.log('inline')`}</Script>
</>
)
}