State Management and Time Travel Debugging

Reactime is an open source Chrome developer tool for time travel debugging and performance monitoring in React applications. Reactime enables developers to record snapshots of application state, jump between and inspect state snapshots, and monitor performance metrics such as component render time and render frequency.

Get started easily with npm and instantly start state debugging now!

1. Clone repo from Reactime GitHub
2. Install dependencies inside repository
3. Start Reactime's development environment

State SnapShot Display

See your application state in a stylized and intereactive format, for clear concise state management.

Time Travel Rendering

Simulate any state change from your DOM history, with a simple click of a button.

Action Comparison & Snapshot Series

Save a series of state snapshots and use it to analyze changes in component render performance between current and previous series of snapshots.

Additional Features

State Snapshot Text Display

See your application state in stylized, interactive JSON format

Time Travel Live Render

Simulate any state change from history in the DOM with a click of a button

Save Snapshot Series

Save a series of recorded state snapshots for analysis later on

Web Metrics

Improve user experience with insight into Web Metrics such as LCP, FCP, FID, TTFB

Snapshot History Display

Monitor history as you time-travel or make new changes to state

Components Map Display

Visualize relationships between components in a collapsible tree for a given snapshot

Atom and Selector Relationships

Visualize the mapping of Atoms and Selectors to components in Recoil Apps

Components Performance Display

Visualize the relative latency trends introduced by re-rendering each component on state change

Download, Upload, and Persist

Save your state history for future tests
Keep your state changes on app reload

Re-render Optimization

Improve performance by preventing unnecessary render cycles

Gatsby Support

Reactime offers full support for Gatsby applications

Next.js Support

Reactime offers debugging and performance tools for Next.js apps

* Some features not available with every state managment solution

Interested in contributing? Reactime is an open-source product. Help make debugging React state easier!