In the previous section, we discussed product design. Now, let's talk about architecture design. But before that, let's first discuss how users can use the product.

Product Usage

Deployment

The product should be deployed within one minute, and subsequent maintenance costs should be extremely low.

Login to Dashboard

After the product is deployed, we will register an administrator user by default.

Users can log in to the dashboard with the administrator account and configure the SDK.

Configure SDK

In the dashboard, users can copy the SDK code and paste it into the frontend project. After that, the SDK will autonomously collect error, performance, and other logs. Users can view the data through the dashboard.

SDK Reporting

After the SDK is initialized, it will listen to events and report data automatically.

1. Every time the user visits the webpage, SDK will report it’s first data
2. After SDK’s first report, the server respond with a session cookie Set-cookie: session-metadata
3. After that, every time SDK report data, it include session metadata
4. When user close current webpage, the session cookie is removed
5. Next time the user visit, a new session cookie will be created

The session will store contextual information of the page, such as device information and anonymous IP, etc. You can also append your own metadata to the session.

You can also use the SDK to report custom data, such as user's critical path and critical interaction data.

Dashboard Management

Users are divided into administrators and regular users. Administrators can add and delete users in the backend.