No strict mode – Why does my React component render three times when I click a button multiple times?

I have a simple React component that uses a state hook. The initial state is false, and when a button is clicked, the state is set to true. I have a console.log statement in the component to log when it renders.

Here is my code:

import { useState } from 'react';

function App() {
  const [value, setValue] = useState(false);

  function changeState() {
    setValue(true);
  }

  return (
    <>
      {console.log('rendered!')}
      <button onClick={changeState}>Click</button>
    </>
  );
}

export default App;

When I click the button multiple times, I see the message “rendered!” logged three times in the console. I expected it to be logged twice – once for the initial render, and once for the re-render after the state change. Can anyone explain why it’s being logged an extra time?