fix(cacheable-section): stable references to avoid loops [LIBS-642] #1385
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Implements LIBS-642
These hooks were implemented unoptimally, admittedly, and functions were getting recreated on each render. This caused issues if they were used as dependencies for
useEffect
hooks, like an infinite loop demoed belowI've updated the hooks to use best practices with
useCallback
anduseMemo
to make stable references and minimize unnecessary rerenders, and I added some automated tests to help verify the stability -- the tests look simplistic, but they were failing before the changes, and actually helped track down which hooks were still unstable in a TDD wayI also tested manually with the PWA example app in the App Platform, with some code that looks like an implementation in analytics plugins:
Demo of loop:
recording-loop-before.mov
After changes:
recording-loop-after.mov