Skip to main content

Type Alias: BrowserInformation

@arolariu/website

@arolariu/website / types / BrowserInformation

Type Alias: BrowserInformation

BrowserInformation = object

Defined in: types/index.ts:539

Captures browser and device information for analytics and telemetry.

Remarks​

Purpose: Collects client-side environment data for:

  • User experience analytics (screen size, device type)
  • Error reporting context (browser version, OS)
  • Performance monitoring (hardware capabilities)
  • Responsive design validation (viewport dimensions)

Privacy Considerations:

  • Data is collected only with user consent (GDPR compliance)
  • No personally identifiable information (PII) is stored
  • User agents are anonymized in long-term storage
  • Data is encrypted in transit and at rest

Properties:

  • navigationInformation: Subset of Navigator API properties (browser, OS, language)
  • screenInformation: Subset of Screen API properties (dimensions, color depth)

Partial Records: Both properties use Partial<Record<>> to allow collecting only relevant data without requiring all possible properties.

Data Collection Strategy:

  1. Collect on initial page load
  2. Attach to OpenTelemetry spans as attributes
  3. Send to Application Insights for aggregation
  4. Use for device-specific optimizations and bug reproduction

Usage Context:

  • Telemetry initialization (see RFC 1001)
  • Error boundary context enrichment
  • Performance metric tagging
  • A/B testing segmentation

Example​

// Collecting browser information
const browserInfo: BrowserInformation = {
  navigationInformation: {
    userAgent: navigator.userAgent,
    language: navigator.language,
    platform: navigator.platform,
    hardwareConcurrency: navigator.hardwareConcurrency,
    maxTouchPoints: navigator.maxTouchPoints
  },
  screenInformation: {
    width: screen.width,
    height: screen.height,
    availWidth: screen.availWidth,
    availHeight: screen.availHeight,
    colorDepth: screen.colorDepth
  }
};

// Attaching to telemetry span
span.setAttributes({
  "browser.user_agent": browserInfo.navigationInformation.userAgent,
  "screen.width": browserInfo.screenInformation.width,
  "screen.height": browserInfo.screenInformation.height
});

See​

Properties​

navigationInformation: Partial<Record<NavigatorKeys, NavigatorValues>>

Defined in: types/index.ts:540

screenInformation​

screenInformation: Partial<Record<ScreenKeys, ScreenValues>>

Defined in: types/index.ts:541

// was this page useful?