const Button = React.memo(function Button({ id, onClick, children }) {
    console.log('Button rendu:', id);
    return <button onClick={() => onClick(id)}>{children}</button>;
});

function ButtonGroup() {
    const [clicked, setClicked] = useState(null);

    const handleClick = useCallback((id) => {
        setClicked(id);
        console.log('Bouton cliqué:', id);
    }, []);

    return (
        <div>
            <p>Dernier clic : {clicked}</p>
            <Button id="a" onClick={handleClick}>Bouton A</Button>
            <Button id="b" onClick={handleClick}>Bouton B</Button>
            <Button id="c" onClick={handleClick}>Bouton C</Button>
        </div>
    );
}