Lazy initial state in React

React interview exercise on Performance, difficulty 2 of 3. Solve it in the editor beside a worked example; the tests run the moment you do.

Report receives `build()` (expensive; returns the report's lines) and a `ticks` counter button that re-renders it. Keep the lines in state initialized from build() so that build runs exactly once per mounted Report, and render a <li> per line.

Each exercise pairs a worked example with a twin problem to solve in a real editor; the tests run the moment you do. Progress is saved in your browser, and in your account if you sign in.

More Performance in React

All React exercises · Other languages and frameworks