question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

useMemo does not guarantee value will not be recreated

See original GitHub issue

From the React Hooks docs:

You may rely on useMemo as a performance optimization, not as a semantic guarantee. In the future, React may choose to “forget” some previously memoized values and recalculate them on next render, e.g. to free memory for offscreen components. Write your code so that it still works without useMemo — and then add it to optimize performance.

I think a ref would be more suitable for holding the machine instance - useMemo could break this hook in future!

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:1
  • Comments:5 (4 by maintainers)

github_iconTop GitHub Comments

3reactions
cdomigancommented, Feb 22, 2019

A ref is where you should store the service. You will want to follow the lazy instantiation example for useRef from https://reactjs.org/docs/hooks-faq.html#how-to-create-expensive-objects-lazily

eg

const serviceRef = useRef(null);

// ✅ Service is created lazily once
function getService() {
  let service = serviceRef.current;
  if (service !== null) {
    return service;
  }
  let newService = interpret(machine);
  serviceRef.current = newService;
  return newService;
}

// When you need it, call getService()
0reactions
carloslfucommented, Feb 26, 2019
Read more comments on GitHub >

github_iconTop Results From Across the Web

You can't create a constant using useMemo in React
There is no guarantee that the returned value of useMemo is always the same even when the dependencies didn't change.
Read more >
React.useMemo does not work to prevent re-renders
Pass a “create” function and an array of dependencies. useMemo will only recompute the memoized value when one of the dependencies has changed....
Read more >
`useMemo` and Stable Values - Kyle Shevlin
It is made clear in the docs that this is not a guarantee, but for all intents and purposes, we can treat it...
Read more >
How To Avoid Performance Pitfalls in React with memo ...
This will ensure that the value you pass to the CharacterMap component is always a string even if the user has not yet...
Read more >
How to useMemo and useCallback: you can remove most of ...
During the initial render, they are not only useless but even harmful: they make React do some additional work. This means that your...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found