Scenario:
I have one url like this one /posts/:id/edit
Using standard nextjs structure, file lies at
posts -> [id] -> edit.tsx
Inside this url, from the id we make AJAX call from react to get the post and show an edit form to the user.
We want to avoid the hassle of nextjs calling the server every time and running getStaticProps and getStaticPaths for every id.
It is enough to reuse getStaticProps for all different ids,
export async function getStaticProps({ locale }: GetStaticPropsContext): Promise<GetStaticPropsResult<SSRConfig>> {
return {
props: {
...(await serverSideTranslations(locale || DEFAULT_LOCALE, tNamespaces)),
},
};
}
and we don't need get getStaticPaths method at all, but next forces to use it.
Right now next generates under .next/static/pages one html,json pair for every possible id resulting in a lot of useless data.
All the different post ids have same props, basically for this particular page we want to return regardless of ids same js and html back, and stop next from creating so much pages and running getStaticPaths.
We cannot keep the page without the method, otherwise next build or start does not work.
Any idea how to optimise this use case ? We have a lot of such scenarios, also with email confirmation tokens etc where under .next/static/pages are generated hundred thousands of useless htmls for every id. We have cron jobs now deleting those but is not a proper solution