Menu
What's the difference between next js <Script /> component rendering strategies (afterInteracive, beforeInteractive, lazyLoad) and using normal <script /> tag with async and defer?
465
asked May 29 '26 17:05
afterInteractive, beforeInteractive and lazyLoad handles script and decide when it's loaded (from docs). It also differ in 'place' where it loads the script. beforeInteractive loads your script in <head> of your project. afterInteractive loads your script in <body> of your project.
Basically, it's just Nextjs way to handle scripts in your app. Main difference is that you should not use script tag in head (in Nextjs) but place it anywhere else and use right strategy so Nextjs knows where to place it.
143
answered Jun 01 '26 07:06
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With