Loading external JS in NextJS

To load the external JS files, you can use "Script" component from 'next/script'

import Script from 'next/script'

<Script src="https://xyz.com/abc.js" strategy="lazyOnload" />

Loading strategies are mentioned below.
  • afterInteractive - load after page become interactive
  • beforeInteractive - load critical scripts before page is interactive - should be put in _document.js
  • lazyOnload - load during idle time
  • worker - load in a web worker
Complex problems, Simple Solutions