lazyOnload

The ‘lazyOnload‘ strategy in NextJS ‘<Script/>’ component allows you to defer the loading and execution of a script until after all other resources (such as HTML , CSS, and other scripts) have finshed loading. It is benefical for improving page load perfomance.

JavaScript

import Script from 'next/script';

const MyPage = () => {
    return (
        <div>
            <h1>My Page</h1>

            {/* Script loaded with lazyOnload strategy */}
            <Script src="https://example.com/lazy-load-script.js"
                strategy="lazyOnload" />
        </div>
    );
};

export default MyPage;

Next.js Components : </h1></div>

Next JS is a React-based web framework that enables developers to build modern, dynamic web applications easily. Vercel developed it, and NextJS introduces a set of conventions and tools that streamline the developer process making it faster and more efficient.

This post will teach us about this project’s <Script> component.

lazyOnload

Next.js Components : </h1></div>

Similar Reads