Cách hoạt động: công nghệ, độ phân giải & giới hạn

1. Vì sao chúng tôi không ghi video

Một hiểu lầm phổ biến là công cụ phân tích trực quan ghi các tệp video tiêu chuẩn (như MP4 hoặc WebM) của màn hình khách. Làm vậy sẽ tiêu tốn băng thông khổng lồ, làm trang web chậm đáng kể và tạo văn bản mờ, khó đọc.

Thay vào đó, MousePlayer sử dụng công nghệ nhẹ gọi là đo lường từ xa bằng ảnh chụp DOM. Đây là cách hoạt động ở cấp cơ bản:

Ảnh chụp bản thiết kế

Khi khách mở trang, tập lệnh chụp một “bản thiết kế” dạng văn bản của HTML và cấu trúc kiểu định dạng. Tập lệnh ghi vị trí các phần tử mà không sao chép tệp hình ảnh hoặc video của trang; trình phát tải hình ảnh từ địa chỉ gốc khi phát lại. Ngoại lệ là các phần tử canvas có nội dung được truyền dưới dạng hình ảnh (xem bên dưới).

Đo lường từ xa bằng tọa độ

Khi người dùng tương tác, chúng tôi ghi một luồng sự kiện: vị trí chuột, độ sâu cuộn, đích nhấp và thay đổi kích thước trình duyệt, cùng các thay đổi của chính trang và, tùy cài đặt, thông báo bảng điều khiển, yêu cầu thất bại hoặc chậm và số đo thời gian tải (Web Vitals). Di chuyển và nhấp có kích thước nhỏ; ảnh chụp trang và thay đổi trang có thể lớn hơn đáng kể tùy trang và được truyền dưới dạng nén.

Phát lại ở chế độ rạp

Khi bạn xem phiên trong bảng điều khiển, trình phát dựng lại trang bằng bản thiết kế đã ghi và di chuyển con trỏ ảo trên trang theo thời gian thực, giữ văn bản sắc nét.

Được thiết kế để nhẹ: tập lệnh tải bất đồng bộ và truyền các điểm dữ liệu số nhỏ thay vì video, giúp giảm tài nguyên sử dụng của chính nó. Ảnh hưởng đến Core Web Vitals phụ thuộc vào trang, dịch vụ lưu trữ và mạng của khách, vì vậy hãy đo trên trang web của bạn thay vì dùng số liệu từ chúng tôi. Không bảo đảm tốc độ tải cụ thể nào – xem mục 20 của Điều khoản dịch vụ.

2. Xử lý độ phân giải màn hình & thiết bị di động

Người dùng ngày nay duyệt web trên mọi thiết bị, từ điện thoại thông minh nhỏ gọn đến màn hình máy tính 4K siêu rộng. Trang web tự động dịch chuyển, thu gọn và sắp xếp lại bố cục để phù hợp với các chiều rộng màn hình khác nhau—khái niệm này được gọi là thiết kế web đáp ứng.

Cách khớp chính xác vùng nhìn của khách

Để bản phát lại không bị méo, MousePlayer ghi chính xác kích thước vùng nhìn của khách (ví dụ: 390x844 cho điện thoại thông minh hoặc 1920x1080 cho màn hình máy tính). Khi bạn mở trình phát ở chế độ rạp, công cụ tạo một môi trường cách ly được điều chỉnh tỷ lệ để phản ánh chính xác tỷ lệ màn hình ban đầu của khách.

Màn hình máy tính & máy tính xách tay

Trên máy tính tiêu chuẩn, chúng tôi ghi di chuyển chuột liên tục và điều hướng qua nhiều thẻ trong cùng một phiên trình duyệt. Menu mở khi di chuột xuất hiện trong bản phát lại nếu thao tác đó làm thay đổi tài liệu của trang; hiệu ứng di chuột thuần CSS không hiển thị trong tài liệu và không được tái hiện trong bản phát lại.

Điện thoại thông minh & máy tính bảng

Màn hình cảm ứng không có con trỏ chuột lơ lửng. MousePlayer tự thích ứng bằng cách ghi thao tác chạm, vuốt để cuộn và thay đổi hướng màn hình (dọc hoặc ngang).

Thách thức khi thay đổi kích thước giữa phiên

Nếu khách xoay máy tính bảng hoặc đổi kích thước cửa sổ trình duyệt máy tính giữa phiên, bố cục trang thay đổi linh hoạt. MousePlayer ghi các sự kiện đổi kích thước cửa sổ này và điều chỉnh khung phát lại liền mạch ngay lập tức để giữ nguyên bối cảnh tương tác.

3. Giới hạn hệ thống & ranh giới kỹ thuật

Để tôn trọng quyền riêng tư, duy trì bảo mật trình duyệt và xử lý dữ liệu nhanh, MousePlayer hoạt động trong các ranh giới kỹ thuật xác định:

Ranh giới hệ thống	Cách MousePlayer xử lý
iFrame	iframe cùng nguồn với trang của bạn được ghi cùng nội dung và tương tác bên trong. Không thể ghi nội dung nhúng từ nguồn khác (ví dụ: trình phát YouTube, biểu mẫu thanh toán Stripe) từ bên trong do chính sách bảo mật trình duyệt (chính sách cùng nguồn); nội dung này xuất hiện dưới dạng phần giữ chỗ trong bản phát lại và không được tải tại đó.
Trường nhập nhạy cảm (PII)	Trường mật khẩu và thanh toán được che trên thiết bị của khách ở mọi mức che dữ liệu, và che toàn bộ dữ liệu nhập biểu mẫu là mặc định cho mọi thuộc tính. Bạn thấy có nhập liệu, không thấy nội dung đã nhập. Có hai giới hạn: hai mức che yếu hơn chỉ được bật khi có chấp thuận bằng văn bản của chúng tôi, và việc che không bao giờ áp dụng đến những gì chính trang của bạn đưa vào tài liệu – trang xác nhận hiển thị địa chỉ là một phần của ảnh chụp. Cả hai được nêu trong Thỏa thuận xử lý dữ liệu.
Phần tử canvas & WebGL	Nội dung canvas được ghi dưới dạng hình ảnh: một lần cùng ảnh chụp trang và sau đó mỗi khi thay đổi, tối đa khoảng một lần mỗi giây và có giới hạn kích thước. Vì vậy hoạt ảnh mượt xuất hiện như một chuỗi khung hình. Không truyền hình ảnh trong vùng bị che hoặc với phần tử canvas chứa hình ảnh từ nguồn khác; nội dung WebGL có thể để trống.
Web Components (Shadow DOM)	Các shadow root mở được ghi cùng nội dung. Tập lệnh không thể truy cập shadow root đóng; nội dung đó không có trong bản phát lại.
Truyền dữ liệu & lưu trữ trình duyệt	Dữ liệu được gửi qua kết nối WebSocket mã hóa (HTTPS/WSS). Nếu không thể thiết lập, ví dụ do proxy, tập lệnh chuyển sang tuyến HTTP mã hóa dự phòng; ảnh chụp trang rất lớn được tải lên riêng qua HTTPS. MousePlayer không đặt cookie; sử dụng bộ nhớ cục bộ và bộ nhớ phiên của trình duyệt trên trang web của bạn.
Khoảng thời gian AFK không hoạt động	Nếu khách để thẻ trình duyệt mở và rời đi trong 20 phút, công cụ tự phát hiện trạng thái không hoạt động và rút ngắn khoảng trống đó khi phát lại để bạn không mất thời gian xem màn hình tĩnh.

Chúng tôi có thể giúp gì?