real-memo-callback
TypeScript icon, indicating that this package has built-in type declarations

0.0.6 • Public • Published

real memo callback

useRealMemoCallback - is a React Hook that allows you to cache the definition of a function 1 time, regardless of changing dependencies

The hook ensures that the function reference between renderers is unchanged. At the same time, all dependencies will be available in the passed function and have an up-to-date value.

Installation

npm install real-memo-callback

Using

import {useRealMemoCallback} from "real-memo-callback"

const HeavyComponentMemo = memo(HeavyComponent);

export const FormComponent = () => {
    const [value, setValue] = useState("");

    const submit = useRealMemoCallback(() => {
        console.log(value);
    }); // the same function reference even when changing dependencies

    return (
            <>
                <input
                    type="text"
                    value={value}
                    onChange={(e) => setValue(e.target.value)}
                />

                <HeavyComponentMemo onClick={submit} />
            </>
    );
};

Package Sidebar

Install

npm i real-memo-callback

Weekly Downloads

0

Version

0.0.6

License

MIT

Unpacked Size

4.63 kB

Total Files

6

Last publish

Collaborators

  • eskeykl
  • shvartem