I have a question, if the fetch features here fail due to network reasons, the value calculated by useFeature is null, how to deal with this situation, thanks https://docs.growthbook.io/guide/nextjs-and-growthbook

Hi Xinzhe, if the feature payload is not loading, it will default the flags to off. You can set default values for non boolean flags with the getFeatureValue method:

getFeatureValue("my-feature", 123)

Thank you for your answer, My scene here is like this; The test component has re-render; if default-value is set,

getFeatureValue("my-feature", 123)

may return different values ​​in the two renderings of the test component; the UI of the page will also change accordingly. This is something we don't want to see.

ah, i see - there are some ways to avoid this flickering/changing state. @future-teacher-7046 do you have some tips?

Is there no solution to this problem?

Hi @cool-airline-75608, if there is a network failure when fetching features, you’ll have to handle the fallback yourself - I would suggest implementing a

catch

statement to handle that case.

fetch(FEATURES_ENDPOINT)
  .then((res) => res.json())
  .then((json) => {
    gb.setFeatures(json.features);
  })
  .catch((e) => {
    // notify error reporting e.g. sentry
  });

As for flickering UI, there are a couple ways to address this. The ideal way would be to have a server-side rendering (SSR) solution. Frameworks like Next.js provide this out of the box. With Next, you should be able to evaluate features on the server-side before sending a payload to the client. Let me know if you have any more questions about this!

Thank you @swift-helmet-3648, we use next's ssg rendering method; My current approach is to save a copy of fallbackFeatures in the code; FallbackFeatures is a copy of features:

fetch(FEATURES_ENDPOINT)
  .then((res) => res.json())
  .then((json) => {
    gb.setFeatures(json.features);
  })
  .catch((e) => {
    // notify error reporting e.g. sentry
    gb.setFeatures(FallbackFeatures);
  });

This scheme obviously has many disadvantages.

Hi @cool-airline-75608, we're working on an SDK update to be released this month that should help address your concern. The SDK will handle feature persistence, local caching, and updates. This feature repository works across backend and frontend implementations, and is Next.js SSR friendly (greatly reduces flickering and state-mismatch issues).