A component function runs again for exactly three reasons: its own state changed, the component that rendered it ran again, or a context it reads was given a new value. Props changing is not on the list — a prop can only change because the parent re-rendered, and the parent re-rendering is what schedules the child. This is why the second reason surprises people: a child re-renders because of where it sits in the tree, not because anything it can see is different. A component that takes no props at all still runs every time its parent runs, and so does everything below it.
A re-render is not a DOM update. React 7,897 calls the function, gets a new tree of element objects, compares it with the previous tree, and sends only the differences to the DOM. A component that re-renders and returns identical output costs one function call and one diff, and nothing else. The cost becomes visible only when the function does real work — sorting ten thousand rows, formatting dates in a loop, building a chart's geometry — or when the subtree below it is large enough that the diff adds up.
Measure before you act. The React Developer Tools 7,897 Profiler (React Developer Tools) records every commit and colors each component by how long its render took. The demos that follow do the same thing crudely, by incrementing a module-level counter inside each component and printing it on the page — a deliberate impurity no real component may copy, but the only honest way to put render counts in front of you.