SOURCE

const { memo, useState, useCallback, useMemo } = React

const Child = memo((props) => {
    const { name, onClick } = props
    console.log('Child Render')
    return (
        <div>
            <div>Child:{name}</div>
            <button onClick={onClick}>change name</button>
        </div>
    )
}, (preProps, nextProps) => {
    return true
})

function App() {
    const [title, setTitle] = useState('Hello World')
    console.log('App Render')
    const [name, setName] = useState('小明')
    const changeName = useCallback(() => setName('小强'), [])
    const me = useMemo(() => {
        console.log('useMemo')
        return ``
    }, [])
    return (
        <div>
            <h1>{title}</h1>
            <button onClick={() => setTitle(`Hello World ${Date.now()}`)}>change title</button>
            <Child name={name} onClick={changeName} me={me} />
        </div>
    )
}

ReactDOM.render(<App />, document.getElementById('root'))

<div id="root"></div>