react-use-smart-state v1.0.4

React useSmartState

useSmartState is just a useState on steroids.

For simple values like string, boolean, number works exactly the same as useState, but for objects it prevent from unnecessary updates

Getting started

yarn add react-use-smart-state

Usage

import React, { useState, useEffect } from 'react'
import { useSmartState } from 'react-use-smart-state'

interface IPerson {
    name: string
    lastname: string
    age: number
}

export const TestExample: React.FC<{}> = () => {
    const [value, setValue] = useSmartState<IPerson>({
        name: 'John',
        lastname: 'Doe',
        age: 50,
    })
    
    useEffect(() => {
        console.log('I am called only when really change')
        
        // calling this 10 times
        // setValue({ ...value, age: 52 })
        // will cause just one update
    }, [value])
    
    return (<div>
        Look how awsome it is!
        
        <div onClick={() => setValue({ ...value, age: 52 })}>Click Me</div>
    </div>)
}