next/script strategies
The Next.js Script component, next/script, is an extension of the HTML <script>
element. It enables developers to set the loading priority of third-party scripts anywhere in their application without needing to append directly to next/head, saving developer time while improving loading performance.
With next/script, you decide when to load your third-party script by using the strategy property:
<Script src="https://connect.facebook.net/en_US/sdk.js" strategy="lazyOnload" />
There are three different loading strategies that can be used:
beforeInteractive
: Load before the page is interactive.afterInteractive
(default) : Load immediately after the page becomes interactive.lazyOnload
: Load during idle time.
To see how to implement the script component reffer to its documentation or if you want to know more information on how to handle scripts, look here.