export const dynamic = 'force-dynamic';
export default async function Home() {
  const response = await fetch(
    `https://www.randomnumberapi.com/api/v1.0/random`
  );

  const data = await response.json();
  return (
    <div>
      <p>{Math.random()}</p>
      <p>{data[0]}</p>
    </div>
  );
}

vs

export default async function Home() {
  const response = await fetch(
    `https://www.randomnumberapi.com/api/v1.0/random`,
    { cache: 'no-store' }
  );

  const data = await response.json();
  return (
    <div>
      <p>{Math.random()}</p>
      <p>{data[0]}</p>
    </div>
  );
}

in the force dynamic version when I refresh the data received from the API doesn't get the new version even I refresh many times, it need a hard refresh to get the new data. While using the cache:no-store it only needs normal refresh to get new data no need for hard refresh

the code I'm running is in dev build, the docs did say that using force-dynamic is the same as Setting the option of every fetch() request in a layout or page to { cache: 'no-store', next: { revalidate: 0 } }. so the 1st block of code is technically the same as the 2nd block. I'm still confused