use-inline-memo

usage.tsx

import * as React from 'react';
import useInlineMemo from './useInlineMemo';

function App() {
  const [value, setValue] = React.useState("");
  const memo = useInlineMemo();

  return (
    <input
      type="text"
      value={value}
      onChange={memo("change", ev => setValue(ev.target.value))}
    />
  );
}

useInlineMemo.tsx

export default function useInlineMemo() {
  const cache = React.useMemo(() => new Map<string, any>(), []);
  return function memo<T>(key: string, value: T): T {
    if (!cache.has(key)) {
      cache.set(key, value);
    }
    return cache.get(key);
  };
}