Next.js - pre-fetch data for big amount of dynamic pages

Question

I have created really big project with page that have over 800,000 variants. In my current React project I just access the url parameter on www.mywebsite.com/my_page/:id and I use useEffect. Here is simplified example:

  url= `${apiAddress}/my_route?id=${props.match.params.id}`
  useEffect(() => {
    axios({
      method: "get",
      url: url,
      timeout: 60 * 4 * 1000, // Let's say you want to wait at least 4 mins
      headers: {
        Authorization:......,
        "Access-Control-Allow-Origin": "*",
      },
    })
      .then((res) => {
        setResults(res.data);
      })
      .catch((err) => {
       //some error handling....
      });
  }, [url]);

So this is working pretty fine. The situation is that I fetch here the response every time I open the pages but the information for every single ID is the same for at least one year. So there aren't any changes for at least for a year. It usually takes 5-6 seconds to load the page with the info and I am wondering is it possible with Next.js pre-fetching to pre-build all the pages and to take nothing to load them? I know number 800,000 is quite big so that's why I am asking. If I use getStaticProps I am able to do similar stuff for much less number of ids but if it tooks 5 seconds to fetch data for 1 page and they are 800,000 does this mean that I would have to wait for build 800,000x5 = 46 days?

Thanks in advance!