Pre-fetching Data with Next.js Link Component

import Link from 'next/link';

// This function component contains a Next.js Link that pre-fetches the about page
function Navbar() {
  return (
    <nav>
      // The prefetch prop is set to true to enable pre-fetching
      <Link href="/about" prefetch>
        <a>About Us</a>
      </Link>
    </nav>
  );
}

This code imports the Link component from Next.js and creates a Navbar functional component containing the Link to an about page. The 'prefetch' prop on the Link component tells Next.js to preload the linked page when the link is visible in the viewport, enabling a faster page transition when the link is clicked.