useCreation

Creates a memoized value with a stable instance until deps change.

Import

import { useCreation } from '@kamod-ch/hooks'

Live demo

Basic demo

Creates a memoized value with a stable instance until deps change.

{
  "seed": 1,
  "createdAt": 1782289929026
}

import { useState } from 'preact/hooks'
import { useCreation } from '@kamod-ch/hooks'

export default function UseCreationDemo() {
  const [seed, setSeed] = useState(1)
  const value = useCreation(() => ({ seed, createdAt: Date.now() }), [seed])

  return (
    <div>
      <pre>{JSON.stringify(value, null, 2)}</pre>
      <button type="button" onClick={() => setSeed((current) => current + 1)}>Recreate with new dep</button>
    </div>
  )
}

API

TypeScript signature

import type { DependencyList } from '../utils/types-compat.js';
declare const useCreation: <T>(factory: () => T, deps: DependencyList) => T;
export default useCreation;
/

SSR considerations

This hook is safe to import during SSR. If your effect body touches the DOM, keep that work inside the effect callback.

Browser compatibility

Works in any modern browser supported by Preact.