Improve next/script documentation

[housseindjirdeh]

Describe the feature you'd like to request

There has been feedback that the usage of next/script can be difficult to understand for Next.js developers looking to optimize loading of third-party scripts. This is a multi-step proposal to improve how the Script component is explained in the documentation.

Describe the solution you'd like

• Expand the Script Component page in the core documentation to (Expands next/script documentation #31063):
  • Include additional information on the different loading strategies available and when to use them
  • Explain other useful capabilities of next/script in more detail (onLoad, inline scripts, etc...)
• Add a next/script page to the API reference documentation (Expands next/script documentation #31063)
• Include "recipes" in the documentation to show how to use the Script component to load some of the most popular third-party scripts (GTM, Google Analytics, etc...)
• Include an example of how to use the Script component in nextjs.org/learn

Describe alternatives you've considered

N/A

[lafiosca]

Along these lines I think it would be nice to have clarity on certain behaviors. For example: what happens if you are using props as values in the dangerous innerHTML for a Script component? Will it re-render and run the code again? What happens if you need multiple scripts with the same strategy to load in a specific order? Etc.

[manovotny]

The Next.js Learn course now has a Third-Party JavaScript section that educates on next/script usage. There are also several examples for next/script usage, including with-google-analytics in the Next/.js repo.

Calling this ok for now.

[github-actions]

This closed issue has been automatically locked because it had no new activity for a month. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.