Reactime – A time-travel state debugger for React apps

Reactime is a debugging tool for React developers. It records state whenever it is changed and allows the user to jump to any previously recorded state.

This dev tool is for React apps using stateful components and prop drilling, and has beta support for Context API, conditional state routing, Hooks (useState, useEffect) and functional components.

Here’s a demo of it in action:

Comes in two parts: a Chrome Extension and a NPM package that you need to install inside your project.

npm i reactime

You’ll also need perform some (upfront) code adjustments so that the package sends data over to the extension:

import reactime from 'reactime';

const rootContainer = document.getElementById('root');
ReactDOM.render(, rootContainer);

reactime(rootContainer);

To support concurrent mode, you’ll need this adjustment:

import reactime from 'reactime';

const rootContainer = ReactDOM.createRoot(document.getElementById('root'));
rootContainer.render();
reactime(rootContainer);

Reactime →