Skip to content

Instantly share code, notes, and snippets.

@ardeshireshghi
Last active June 10, 2020 22:51
Show Gist options
  • Save ardeshireshghi/315034816ecf873162617db9f368ffd1 to your computer and use it in GitHub Desktop.
Save ardeshireshghi/315034816ecf873162617db9f368ffd1 to your computer and use it in GitHub Desktop.
Memoize very similar to `useMemo` in React
function isEqual(prevDeps = [], newDeps = []) {
if (prevDeps.length !== newDeps.length) {
return false;
}
for (const [ i, dep ] of newDeps.entries()) {
if (!Object.is(dep, prevDeps[i])) {
return false;
}
}
return true;
}
const createMemo = () => {
let memoizedState = null;
function memo(createFn, deps = []) {
const prevState = memoizedState;
let nextState;
if (prevState && isEqual(deps, prevState.deps)) {
console.log('Using memoised result');
return prevState.result;
} else {
console.log('Calculating again');
nextState = {
result: createFn(),
deps
};
memoizedState = nextState;
return memoizedState.result;
}
}
return memo;
};
// Example
const memo = createMemo();
let a = 40, b = 50;
let result = memo(() => a + b, [a, b]);
// Calculating: 90
let result = memo(() => a + b, [a, b]);
// Using memoized value: 90
a = 50;
let result = memo(() => a + b, [a, b]);
// Calculating: 100
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment