Skip to content
Karan Gupta edited this page Apr 8, 2023 · 4 revisions

Welcome to the react-dynamics wiki!

Welcome to Dynamics, A simple way for collection Component level usage metrics and errors for a React application. The implementation is inspired by AppDynamics agent which does something similar for java applications.

Key Terminologies

Dynamics HOC - As the name suggests the higher order component is one of the key pieces in the capture of telemetry from components. It wraps around your component and hooks into the lifecycle methods as well as event handlers to capture various events into the Dynamics system.

Configuration Service - This service setups all the metadata of the application alongside configs which are required for collating the telemetries of all components into a single place.

Local Storage - It is a key value store built into Chrome itself which stores the data with no expiration date. The data will not be deleted when the browser is closed, and will be available the next day, week, or year.

Indexed DB - It is a JavaScript-based object-oriented database built into Chrome itself which can store large amounts of structured data. IndexedDB lets you store and retrieve objects that are indexed with a key. We use a wrapper built around it to interact with it called localForage.

Service Worker - A service worker is a script that runs independently in the browser background. On the user side, it can intercept its network requests and decide what to load. We use the service worker to dispatch the telemetry stored in Chrome to your choice of destination.

Emerald

Clone this wiki locally