Scenario Questions

A product page shows an old price after the admin updated it. How do you fix it?

The page or its fetch is cached (ISR/force-cache/'use cache'). Tag the product data (product-42) and call revalidateTag('product-42') (or revalidatePath) in the admin Server Action or from a backend webhook. Also check the CDN and the client router cache (router.refresh()). Keep a short revalidate as a safety net.

Your build shows the home page as ƒ (dynamic) but it should be static. What do you check?

Look for dynamic APIs in the page, its layouts or components: cookies(), headers(), searchParams, no-store fetches, force-dynamic. Move the personalised bit into a Suspense-wrapped component (PPR) or a Client Component, and add export const dynamic = 'error' to catch regressions.

The product page is slow because reviews take 2 seconds. What do you do?

Do not await reviews at the top. Render product details first and move reviews into an async <Reviews/> inside <Suspense fallback={...}> so they stream. Fetch independent data in parallel, cache review summaries with a tag, and paginate reviews.

Users see a hydration mismatch error. What are common causes?

Rendering values that differ between server and client: Date.now(), Math.random(), toLocaleString() with a different locale/time zone.
Reading window/localStorage during render. Move it to useEffect or load the component with ssr: false.
Invalid HTML nesting (<div> inside <p>), or browser extensions changing the DOM.

How would you build a search page with filters that is shareable and SEO friendly?

Keep all filter state in the URL (?q=&brand=&sort=&page=). The page reads searchParams on the server, validates them into a typed object, and queries with pagination. Filter controls are small Client Components that update the URL with router.replace (debounced for text). Add canonical URLs and noindex for thin filter combinations.