Next.js Discord

Discord Forum

[app router] How to make sure a variable exists as s singleton

Unanswered
Cape lion posted this in #help-forum
Open in Discord
Cape lionOP
What is the right pattern for creating a variable that lives on the server (or on the server during build time) that truely only exists once?

20 Replies

Holland Lop
good question, would like to know this as well
@Cape lion What is the right pattern for creating a variable that lives on the server (or on the server during build time) that truely only exists once?
joulev
if i understand this correctly, you want to compute a value during build time and reuse that value everywhere?
Cape lionOP
@joulev yes exactly!
@Cape lion <@484037068239142956> yes exactly!
joulev
You can use a script to generate a json file at build time then import that json file to use everywhere in your app. Example [here](https://github.com/joulev/debug/tree/nextjs-pages-router-global-static-data-example) was written in the pages router but the same thing applies to the app router too
You could also leverage unstable_cache to globally cache the data, though since it’s unstable I’d discourage that unless you know what you are doing. Simple ways with a prebuild script is still the simplest and it can’t go wrong
Cape lionOP
@joulev Probably will have to go with the json file... Thanks for your answer. Do you know if unstable_cache will also only work on something like a per_request basis or if it caches the data for e.g. the whole build time?
Because I've used cache together with firebase-admin and it didnt even cache the requests through build time...
Cape lionOP
Thank you! I will try it out later and let you know
Cape lionOP
So e.g. for the dev server unstable_cache is not working
The api call is triggered over and over again even tought the function is wrapped in unstable_cache
Cape lionOP
But for the build it actually works
Thank you!
Cape lionOP
This is a bit of clowning but I just changed the code a slight bit and now it's not even cached through build time anymore.
export const getSubjects = unstable_cache(async (lang: ApplicationLanguage) => {
  const { data: subjects} = await fetchSubjects();

  const c = (s: I18nCategory) => {
    return convertI18nCategory(s, lang)
  }

  return {
    data: subjects.map(c)
  };
}, ['getSubjects']);

export const fetchSubjects = unstable_cache(() => {
  return adminApi.subjects();
}, ['fetchSubjects']);
// from adminApi
subjects: async () => {
  console.log('Calling subjects');
  const snapshot = await subjectsRef.get();
  return {
    data: snapshot.docs.map(doc => doc.data())
  }
},
Cape lionOP
I removed the unstable_cache from the other function an now it's better but the subjects are somehow still fetched 3 times (once for every language). Even tough I applythe lang filter locally
@Cape lion This is a bit of clowning but I just changed the code a slight bit and now it's not even cached through build time anymore.
Satin
In my experience, unstable_cache works across builds on local but not on Vercel.
joulev
unstable_cache is still very unstable to be honest. i use it extensively in my personal apps and i notice the behaviour always changes slightly whenever i update dependencies. since those apps are for my personal use only that's fine but i wouldn't use unstable_cache for user-facing content for now