Skip to content

v0.1.0 — Initial Official Release (@tracex-dev/*)

Latest

Choose a tag to compare

@KareemAdelAwwad KareemAdelAwwad released this 18 Oct 10:06
· 3 commits to main since this release

🚀 TraceX JavaScript & TypeScript SDK v0.1.0 — Initial Official Release

We are thrilled to announce the official v0.1.0 release of the TraceX JavaScript & TypeScript SDK Suite, now live and available on npm under the @tracex-dev organization scope!

TraceX provides production-grade crash telemetry, automatic breadcrumb tracking, client-side PII scrubbing, and real-time incident intelligence across server, client, and full-stack environments.


📦 Packages Included in this Release

All packages are published with dual ESM and CommonJS exports, full TypeScript declarations (.d.ts / .d.mts), and external sourcemaps:

Package Version NPM Registry Link Description
@tracex-dev/core 0.1.0 @tracex-dev/core Shared core engine: 0 external dependencies, constant-memory ring buffer, PII scrubber, resilient dispatcher
@tracex-dev/node 0.1.0 @tracex-dev/node Server SDK: Zero-config Bun & Node detection, uncaught error listeners, outgoing HTTP breadcrumbs
@tracex-dev/react 0.1.0 @tracex-dev/react Client SDK: <TraceXErrorBoundary>, DOM click tracking, SPA navigation, browser forensics
@tracex-dev/nextjs 0.1.0 @tracex-dev/nextjs Full-stack SDK: Server Action wrapper (withTraceXServerAction), Route Handlers (withTraceXRoute), Root Error

⚡ Quickstart

Node.js & Bun

npm install @tracex-dev/node
# or
bun add @tracex-dev/node
import { initTraceXNode } from '@tracex-dev/node';

initTraceXNode({
  apiKey: process.env.TRACEX_API_KEY!,
  projectId: 'my-backend-service',
  environment: 'production',
});

React & Browser

npm install @tracex-dev/react
import { TraceXProvider, TraceXErrorBoundary } from '@tracex-dev/react';

export function App() {
  return (
    <TraceXProvider apiKey="client-key" projectId="my-web-app">
      <TraceXErrorBoundary fallback={<div>Something went wrong</div>}>
        <MainContent />
      </TraceXErrorBoundary>
    </TraceXProvider>
  );
}

Next.js App Router (14 / 15 / 16)

npm install @tracex-dev/nextjs

In app/layout.tsx:

import { TraceXClientProvider } from '@tracex-dev/nextjs/client';

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html>
      <body>
        <TraceXClientProvider apiKey={process.env.NEXT_PUBLIC_TRACEX_API_KEY!} projectId="my-app">
          {children}
        </TraceXClientProvider>
      </body>
    </html>
  );
}

In Server Actions:

'use server';
import { withTraceXServerAction } from '@tracex-dev/nextjs/server';

export const handleCheckout = withTraceXServerAction('checkout', async (formData: FormData) => {
  // Logic here
});

🛡️ Key Architectural Highlights

  • Zero Dependencies in @tracex-dev/core: Completely self-contained to eliminate diamond dependency conflicts and supply chain vulnerabilities.
  • Constant-Memory Breadcrumb Ring Buffer: Fixed-capacity circular buffer with $O(1)$ amortized insertion, preventing memory leaks in high-throughput servers.
  • Client-Side Data Privacy: Automatic Luhn credit-card masking, JWT redaction, Bearer token scrubbing, and WeakSet circular reference protection.
  • Resilient Network Dispatcher: Full-jitter exponential backoff, rate-limit awareness (HTTP 429 Retry-After), and AbortController timeouts.
  • Next.js Control-Flow Safe: Specially detects and rethrows NEXT_REDIRECT and NEXT_NOT_FOUND control-flow exceptions.

🧪 Verification & Release Artifacts

  • 181 Unit & E2E Tests Passing: Tested with Bun test runner.
  • Isolated Sandbox Verified: Tested in clean external directory via test/sandbox-verify.ts.
  • Release Tarballs: Attached below as standalone distribution packages.