Caching common data across pages at SSG build time

[nwatab]

I make a page with SSG in NextJS App router. At build, every page /foods/[id]/page.tsx accesses the common data on a disk. I want it to access the disk only ONCE during build, not each build of a page. I have code below. It does not cache across page builds as I expected. Does anyone know how to do it? Thanks.

page.tsx

export const generateStaticParams = async () => {

const foods = await loadFoodData();

return foods.map((food) => ({ id: food.id }));

};

export default async function FoodPage({

params,

}: {

params: Promise<{ id: string }>;

}) {

const { id } = await params;

const foods = await loadFoodData(); // every page does not need to do this, because data is always the same.

const food = foods.find((food) => [food.id](http://food.id/) === id); // the page needs only this food, but you need read whole data from disk as it is not indexed. There's no efficient loadFoodById.

load-food-data.tsx

let cachedData: FoodToOptimize[] | null = null;

export const loadFoodData = async (): Promise<Food[]> => {

if (cachedData) {

return cachedData;

}

console.log('Loading food data...'); // called at every page build

// heavy disk access, but it would be fast once loaded on memory.

return data