react-render-kit
← All tools

render-kitstable

Unified orchestration SDK — one install for all react-render-kit packages with a single config, pre-wired telemetry, replay, and intelligence pipeline.

Install: pnpm add @sapanmozammel/render-kit

render-kit — Minimal Integration
1. Install
npm install @sapanmozammel/render-kit
2. Init (resolved config)
{
  "enabled": false,
  "telemetry": {
    "enabled": false,
    "maxEvents": 1000
  },
  "replay": {
    "enabled": false,
    "maxFrames": 100,
    "pruningStrategy": "fifo"
  },
  "intelligence": {
    "enabled": false,
    "maxBottlenecks": 10,
    "confidenceThreshold": 0.3
  }
}
3. Event pushedbuffer.events = 0
4. Analysisrender-kit intelligence subsystem is disabled
How to use render-kit
import { createRenderKit, RenderKitProvider, useRenderKit } from '@sapanmozammel/render-kit';

// 1. Create a kit instance (one per app)
const kit = createRenderKit({
  telemetry: { maxEvents: 500 },
  replay:    { maxFrames: 50 },
  intelligence: { confidenceThreshold: 0.5 },
  plugins: [myPlugin],
});

// 2. Provide it via React context
<RenderKitProvider kit={kit}>
  <App />
</RenderKitProvider>

// 3. Use it anywhere inside the provider
const kit = useRenderKit();

// Telemetry
const session = kit.telemetry.createSession('MyComponent');
kit.telemetry.buffer.push(event);
const snapshot = kit.telemetry.snapshot();

// Replay
const sessions = kit.replay.fromBuffer();
const engine   = kit.replay.engine(source);

// Intelligence
const report = kit.analyze();                        // defaults to buffer snapshot
const report = kit.analyze({ type: 'events', events });  // explicit source

// Cleanup
kit.destroy();  // idempotent

One install pulls all 11 react-render-kit packages as dependencies. Every hook and component from the ecosystem is also re-exported from this single entry point.