> ## Documentation Index
> Fetch the complete documentation index at: https://docs.flashcat.cloud/llms.txt
> Use this file to discover all available pages before exploring further.

# Compatibility

> Web RUM SDK supported browser versions, frameworks, and feature compatibility details

<Info>
  This document details the browsers, frameworks, build tools, and related limitations supported by Web RUM SDK, helping you evaluate SDK applicability in your target environment.
</Info>

## Supported Browsers

| Browser           | Desktop | Mobile | Min Version | Notes                             |
| ----------------- | ------- | ------ | ----------- | --------------------------------- |
| Chrome            | ✅       | ✅      | 63+         | Full feature support              |
| Firefox           | ✅       | -      | 67+         | Some features limited (see below) |
| Safari            | ✅       | ✅      | 12.1+       | Some features limited (see below) |
| Edge              | ✅       | -      | 79+         | Chromium-based version            |
| Opera             | ✅       | -      | 50+         | Full feature support              |
| Internet Explorer | ❌       | -      | -           | Not supported                     |

<Warning>
  Internet Explorer 11 and earlier versions are not supported.
</Warning>

## Browser Feature Compatibility

The following table details SDK feature support across browsers:

| Feature                        | Chrome | Firefox | Safari | Edge | Chrome Android | Safari iOS | Opera |
| ------------------------------ | ------ | ------- | ------ | ---- | -------------- | ---------- | ----- |
| SDK Loading                    | ✅      | ✅       | ✅      | ✅    | ✅              | ✅          | ✅     |
| SDK Initialization             | ✅      | ✅       | ✅      | ✅    | ✅              | ✅          | ✅     |
| RUM Data Reporting             | ✅      | ✅       | ✅      | ✅    | ✅              | ✅          | ✅     |
| Page Hidden Flush              | ✅      | ✅       | ✅      | ✅    | ✅              | ❌          | ✅     |
| Console Error Capture          | ✅      | ✅       | ✅      | ✅    | ✅              | ✅          | ✅     |
| Runtime Error Capture          | ✅      | ✅       | ✅      | ✅    | ✅              | ✅          | ✅     |
| CSP Violation Detection        | ✅      | ✅       | ✅      | ✅    | ✅              | ✅          | ✅     |
| Browser Intervention Detection | ✅      | ❌       | ❌      | ✅    | ✅              | ❌          | ✅     |
| Auto Action Tracking           | ✅      | ✅       | ✅      | ✅    | ✅              | ✅          | ✅     |
| Custom Action Tracking         | ✅      | ✅       | ✅      | ✅    | ✅              | ✅          | ✅     |
| Long Task Detection            | ✅      | ❌       | ❌      | ✅    | ✅              | ❌          | ✅     |
| Distributed Tracing            | ✅      | ✅       | ✅      | ✅    | ✅              | ✅          | ✅     |
| Route Change Tracking          | ✅      | ✅       | ✅      | ✅    | ✅              | ✅          | ✅     |
| Page Load Time                 | ✅      | ✅       | ✅      | ✅    | ✅              | ✅          | ✅     |
| Resource Performance           | ✅      | ✅       | ⚠️ (1) | ✅    | ✅              | ⚠️ (1)     | ✅     |
| Navigation Performance         | ✅      | ✅       | ✅      | ✅    | ✅              | ✅          | ✅     |
| Web Vitals                     | ✅      | ⚠️ (2)  | ⚠️ (2) | ✅    | ✅              | ⚠️ (2)     | ✅     |
| FCP (First Contentful Paint)   | ✅      | ✅       | ✅      | ✅    | ✅              | ✅          | ✅     |

**Notes**:

1. Resource size information unavailable
2. Only FID (First Input Delay) metric supported

## Framework Compatibility

### JavaScript Frameworks

<CardGroup cols={2}>
  <Card title="React" icon="react">
    Supports React 16.8+ (Hooks), auto tracking ✅
  </Card>

  <Card title="Vue.js" icon="vuejs">
    Supports Vue 2.x and Vue 3.x, auto tracking ✅
  </Card>

  <Card title="Angular" icon="angular">
    Supports Angular 12+, auto tracking ✅
  </Card>

  <Card title="Next.js" icon="code">
    Supports SSR and client-side rendering, auto tracking ✅
  </Card>

  <Card title="Nuxt.js" icon="code">
    Supports SSR and client-side rendering, auto tracking ✅
  </Card>

  <Card title="Svelte" icon="code">
    Requires additional configuration for auto tracking ⚠️
  </Card>
</CardGroup>

<Tip>
  Vanilla JavaScript fully supports manual tracking features.
</Tip>

### Build Tools

| Tool      | Support Status | Notes                                  |
| --------- | -------------- | -------------------------------------- |
| Webpack   | ✅              | Supports all major versions (4.x, 5.x) |
| Vite      | ✅              | Recommended                            |
| Rollup    | ✅              | Full support                           |
| Parcel    | ✅              | Full support                           |
| esbuild   | ✅              | Full support                           |
| Turbopack | ✅              | Experimental support                   |

### Module Systems

| Module System   | Support Status | Notes                              |
| --------------- | -------------- | ---------------------------------- |
| ES Module (ESM) | ✅              | Recommended                        |
| CommonJS (CJS)  | ✅              | Full support                       |
| UMD             | ✅              | Suitable for direct browser import |

## Network Request Library Compatibility

| Library/API    | Auto Tracking | Manual Tracking | Notes                                           |
| -------------- | ------------- | --------------- | ----------------------------------------------- |
| Fetch API      | ✅             | ✅               | Requires auto tracking configuration enabled    |
| XMLHttpRequest | ✅             | ✅               | Requires auto tracking configuration enabled    |
| Axios          | ✅             | ✅               | Auto tracking via interceptors                  |
| jQuery.ajax    | ⚠️            | ✅               | Based on XMLHttpRequest, requires configuration |

## Web API Dependencies

The SDK depends on the following Web APIs. Please ensure target browsers support them:

### Required APIs

| API                    | Purpose                  | Fallback       |
| ---------------------- | ------------------------ | -------------- |
| `navigator.sendBeacon` | Send data on page unload | Uses Fetch API |
| `fetch`                | Data reporting           | None           |
| `Promise`              | Async handling           | None           |
| `JSON`                 | Data serialization       | None           |

### Optional APIs

| API                           | Purpose                           | Impact When Missing                       |
| ----------------------------- | --------------------------------- | ----------------------------------------- |
| `PerformanceObserver`         | Performance monitoring            | Some performance metrics unavailable      |
| `PerformanceNavigationTiming` | Navigation performance data       | Cannot get navigation performance metrics |
| `PerformanceResourceTiming`   | Resource loading performance data | Cannot get resource performance metrics   |
| `IntersectionObserver`        | Element visibility detection      | Some user behavior tracking affected      |
| `MutationObserver`            | DOM change monitoring             | Some auto tracking features affected      |
| `PerformanceLongTaskTiming`   | Long task detection               | Cannot detect long tasks                  |
| `visibilitychange` event      | Page visibility change detection  | Some session tracking features affected   |

## TypeScript Support

| TypeScript Version | Support Status | Notes                              |
| ------------------ | -------------- | ---------------------------------- |
| 4.0+               | ✅              | Complete type definitions provided |
| 3.8 - 3.9          | ⚠️             | Basic support, some types limited  |
| \< 3.8             | ❌              | Not supported                      |

The SDK provides complete TypeScript type definition files (`.d.ts`), supporting IntelliSense and type checking.

## Content Security Policy (CSP)

If your website uses CSP, add the following to your CSP policy:

```http CSP Configuration theme={null}
Content-Security-Policy:
  connect-src 'self' https://rum-intake.flashcat.cloud;
  script-src 'self' 'unsafe-inline';
```

<Note>
  If using CDN integration, also add `https://static.flashcat.cloud` to `script-src`.
</Note>

## Privacy and Security

### Cookie Usage

The SDK may use the following storage types:

| Storage Type   | Purpose                            | Required |
| -------------- | ---------------------------------- | -------- |
| localStorage   | Session state persistence          | Optional |
| sessionStorage | Temporary session data             | Optional |
| Cookie         | User identification (configurable) | Optional |

Cookies and local storage can be disabled via configuration to use pure memory mode.

### SameSite Cookie

The SDK uses `SameSite=Lax` policy by default, compatible with modern browser privacy requirements.

## Known Limitations

<AccordionGroup>
  <Accordion title="Safari Limitations">
    | Limitation                    | Description                                                         |
    | ----------------------------- | ------------------------------------------------------------------- |
    | **Long Task Detection**       | Safari doesn't support Long Tasks API                               |
    | **Web Vitals**                | Only FID supported, CLS and LCP full measurement not supported      |
    | **Resource Size Information** | Some resource size information may be inaccurate                    |
    | **Data Send on Page Hidden**  | iOS Safari cannot guarantee immediate data send when page is hidden |
  </Accordion>

  <Accordion title="Firefox Limitations">
    | Limitation                         | Description                              |
    | ---------------------------------- | ---------------------------------------- |
    | **Long Task Detection**            | Firefox doesn't support Long Tasks API   |
    | **Browser Intervention Detection** | Firefox doesn't support Intervention API |
    | **Web Vitals**                     | Only FID supported                       |
  </Accordion>

  <Accordion title="Mobile Browser Limitations">
    * **Background Running Restrictions** - Mobile browsers may pause JavaScript execution when in background
    * **Memory Limitations** - Mobile device memory constraints may affect data caching capability
    * **Network Limitations** - Unstable mobile networks may cause data reporting delays
  </Accordion>

  <Accordion title="Single Page Applications (SPA)">
    * Route change tracking configuration needs to be enabled
    * Some framework routing libraries require additional configuration
    * Recommend manually calling `startView` method to track route changes

    <Tip>
      See [Advanced Configuration](/en/rum/sdk/web/advanced-config#override-default-rum-view-names) for detailed SPA route tracking configuration.
    </Tip>
  </Accordion>
</AccordionGroup>

## Performance Impact

FlashCat Web SDK is designed to be lightweight with minimal impact on webpage performance:

* **SDK Size**: \~30 KB (\~10 KB gzipped)
* **Runtime Memory Usage**: \< 2 MB
* **CPU Usage**: \< 1%
* **First Load Impact**: \< 50ms

## Update Strategy

* **Major Version Updates**: May contain breaking changes, code adjustments required
* **Minor Version Updates**: New features, backward compatible
* **Patch Version Updates**: Bug fixes, fully backward compatible

We recommend regularly updating the SDK to the latest stable version for best performance and security.

## Minimum Deployment Requirements

To ensure the SDK works properly, please ensure:

1. **Browser Versions**:

   * Chrome 63+
   * Firefox 67+
   * Safari 12.1+
   * Edge 79+

2. **JavaScript Support**: ES6+ (ES2015)

3. **Required Web APIs**:

   * `fetch` API
   * `Promise`
   * `JSON`

4. **Network Access**: Application needs to access `https://rum-intake.flashcat.cloud` for data reporting

5. **HTTPS**: Recommended to use in HTTPS environment for full feature support

## Related Documentation

<CardGroup cols={3}>
  <Card title="SDK Integration Guide" icon="plug" href="/en/rum/sdk/web/sdk-integration">
    Learn how to integrate the SDK
  </Card>

  <Card title="Advanced Configuration" icon="sliders" href="/en/rum/sdk/web/advanced-config">
    Learn about advanced SDK configuration options
  </Card>

  <Card title="Data Collection" icon="database" href="/en/rum/sdk/web/data-collection">
    Learn what data the SDK collects
  </Card>
</CardGroup>