最近 Hooks を触って思ったことを綴ります。よく見る useState の increment 例です。 const [count, setCount] = useState(0) const handleClick = () => { setCount(count + 1) } return ( <div className={props.className}> <p>count: {count}</p> <button onClick={handleClick}>+1</button> </div> ) これはアンチパターンで、handleClick は render毎に再定義されます。この再定義を skip するため、useCallback による関数memoizeを行います。 アンチパターン集