Next.js app router: fetch data at build time in Dynamic rendering

Question

I am using [email protected] and App router. I use fetch with { cache: 'no-store' } and expect that data will not fetch at build time. Because if I set { cache: 'no-store' } rendering become to be Dynamic and

With Dynamic Rendering, routes are rendered for each user at the request time.

But the result is different, my console.logs triggered during build time. I can fix this problem with export const dynamic = 'force-dynamic';, but I want to understand, why my example doesn't work. Also, it works as expected in [email protected]

Appreciate your answers.

Example

How to reproduce:

1. start build
2. look in the console after the build

Main component app/page.js

const getPosts = async () => {
  const posts = await fetch("https://jsonplaceholder.typicode.com/posts", {
    cache: "no-store",
  }).then((res) => res.json());
  console.log(posts);
  for (const post of posts) {
    await fetch(`https://jsonplaceholder.typicode.com/posts/${post.id}`, {
      cache: "no-store",
    })
      .then((res) => res.json())
      .then(console.log);
  }
  console.log("fetched");
  return posts;
};

export default async function Home() {
  const posts = await getPosts();
  return <h1>The Starting Page</h1>;
}

Result: