Next.js Discord

Discord Forum

[App Router] Dynamic Routes - Prefetch

Unanswered
Pacific thread herring posted this in #help-forum
Open in Discord
Pacific thread herringOP
Hi everyone,

Business Logic:

I need to have a page where matches are listed and have a page where I basically watch that match (just an iframe with a source URL).

Description:

I am new to NextJS and still learning. Faced this issue. I am using App router with SSG (no ISR). the export mode is set to output.


Issue

So I have a dynamic route for live page (the term 'live' refers to the page where you can watch matches). Since I alwaso wanted to increase the SEO score I have created a pretty URLs. So basicaly during the build time I am fetching data, creating a map from matchId to some human readable string (for example matchId: 123 --> URL: 'real-vs-barcelona'). I generating a URL based on that string.

In the main page (where all matches are listed). I am using Link component from next. And I wanted to prefetch all the URLs which are in the viewport of the user but no success.

Story Behind

Initially I had written this code with Page Router, then decided to switch to a newer routing version, that is, App Router and now I am trying to get the same UX as it was for page router.



I will appreciate any help. Let me know if you need more details or code snippets.

0 Replies