Urgent.News

What's breaking now, across thousands of outlets.

Tech

How We Built an On-Device PII Firewall in a 3.4KB Telemetry SDK

When building SnapTrace , our primary constraint was keeping the client telemetry footprint strictly under 5KB so it doesn't penalize Next.js Core Web Vitals (INP score). One of the most critical engineering hurdles was privacy and data sanitization : How do you strip sensitive user data (passwords, JWT bearer tokens, credit cards) without importing heavy 20KB–30KB third-party sanitization…

SnapTrace, the client telemetry SDK developed by the company, aimed to keep its footprint strictly under 5KB to avoid negatively impacting Next.js Core Web Vitals (INP score). A significant engineering challenge was ensuring privacy and data sanitization by stripping sensitive user data such as passwords, JWT bearer tokens, and credit cards without relying on large third-party packages that would bloat the client bundle.

The team implemented an in-browser regex scrubber for this purpose, ensuring raw customer secrets never reached the network or their ingestion servers.

The architecture of the zero-dependency client approach involves several key steps. First, an in-memory client-side regex scrubber is used to detect and redact unauthorized bearer & auth tokens, JWT patterns, credit card numbers, passwords, and keys before they are dispatched over the network. This process ensures that sensitive information is masked, with unauthorized data being replaced with placeholders like [REDACTED] and [REDACTED_CARD].

This in-memory scrubbing occurs entirely on the user's browser, preventing any raw sensitive information from being transmitted or stored on the company's servers.

Secondly, SnapTrace utilizes the browser's native asynchronous transport mechanism, navigator.sendBeacon, which dispatches events in the background without interfering with the main thread or causing delays in the application's UI. This approach allows the SDK to operate efficiently, maintaining smooth application performance while ensuring that sensitive user data is properly protected and not exposed during network transmission.

Written by urgent.news from Dev.to's reporting — not their text. Machine-written — may contain errors; check the original before relying on it.

Read the original at dev.to →

More in Tech

Statistical Tests in TypeScript Without a Separate Python Service

Imagine an internal tool that compares two variants of a workflow. The application already has: the measurements; filters; tables; charts; user interactions.

  • Columna library enables statistical tests in TypeScript without Python service.
  • Provides advanced tests like Welch's two-sample t-test directly in codebase.
  • Keeps analysis within app simplifies architecture, reduces HTTP requests.

More from Saturday 3 October →