groundcover browser SDK
groundcover’s Real User Monitoring (RUM) SDK allows you to capture front-end performance data, user events, and errors from your web applications.
See the dedicated groundcover documentation for more details.
``bash`
npm install @groundcover/browser
`ts
import groundcover from "@groundcover/browser";
groundcover.init({
apiKey: "your-api-key",
cluster: "your-cluster",
environment: "production",
dsn: "your-dsn",
appId: "your-app-id",
});
`
For micro-frontend architectures, you can synchronize sessions across different frontend applications by passing a shared sessionId:
`ts
// Main application generates a sessionId
const sharedSessionId = "session-12345";
// Initialize SDK in main app
groundcover.init({
apiKey: "your-api-key",
cluster: "your-cluster",
environment: "production",
dsn: "your-dsn",
appId: "your-app-id",
sessionId: sharedSessionId, // Use shared sessionId
});
// Initialize SDK in micro-frontend with same sessionId
groundcover.init({
apiKey: "your-api-key",
cluster: "your-cluster",
environment: "production",
dsn: "your-dsn",
appId: "micro-frontend-app-id",
sessionId: sharedSessionId, // Same sessionId for session continuity
});
`
Link RUM data to specific users:
`ts`
groundcover.identifyUser({
id: "John Doe",
email: "john@groundcover.com",
organization: "groundcover",
});
Send custom events to groundcover:
`ts`
groundcover.track("custom-event");
Capture errors from your web application:
`ts`
groundcover.captureException(new Error("Something went wrong"));
You can also attach metadata to provide additional context:
`ts`
groundcover.captureException(new Error("Payment failed"), {
userId: "123",
feature: "checkout",
cart: { items: 3, total: 99.99 },
});
You can customize SDK behavior (event sampling, data masking, enabled events). The following properties are customizable:
`typescript`
export interface SDKOptions {
batchSize: number;
batchTimeout: number;
eventSampleRate: number;
sessionSampleRate: number;
environment: string;
debug: boolean;
tracePropagationUrls: string[];
}
You can pass the values by calling the init function:
`typescript`
groundcover.init({
apiKey: "your-api-key",
cluster: "your-cluster",
environment: "production",
dsn: "your-dsn",
appId: "your-app-id",
sessionId: "optional-session-id", // For micro-frontend synchronization
options: {
batchSize: 50,
sessionSampleRate: 0.5, // 50% sessions sampled
eventSampleRate: 0.5,
},
});
Or via the updateConfig function:
`typescript``
groundcover.updateConfig({
batchSize: 20,
});