I am using the Link component as well as the Suspense component with a fallback for loading, and I am still getting a delay of several seconds when navigating to certain pages. People say there is a delay in development mode, but it still takes several seconds in the deployed site.
If you visit this page https://vgdc.club/ and click on "About" or "FAQ", you will notice the delay. This was not a problem when the site was created with React + Vite (the pages loaded instantly), but after migrating to Next.js I've been noticing this issue.

example code from the About page:
page.tsx

import { Suspense } from "react";
import Loading from "./loading";
import About from "./About";

export default async function Page() {
  return (
    <Suspense fallback={<Loading />}>
      <About />
    </Suspense>
  );
}

About.tsx

import { documentToReactComponents } from "@contentful/rich-text-react-renderer";
import styles from "../_components/basicPage.module.scss";
import ContentfulData from "../_components/ContentfulData";

const query = `
  {
    aboutPage(id: "6gI50sekVnS2dEVzgl4001") {
      about {
        json
      }
    }
  }
`

export default async function About() {
  const data = (await ContentfulData(query, "about"))
  const about = data.aboutPage.about;

  return <main className={styles.basicPage}>{documentToReactComponents(about.json)}</main>;
}

loading.tsx

import Loader from "@/app/_components/Loader";

export default function Loading() {
  return (
    <div className="flex h-screen w-screen items-center justify-center opacity-30">
      <Loader />
    </div>
  );
}

the code is the same for the FAQ page