Tôi hiện đang làm việc trên một dự án có yêu cầu tổng hợp linh hoạt nhiều nguồn video được đồng bộ hóa trên một khung vẽ. Nguyên mẫu ban đầu tôi ghép lại đã tải video vào HTMLVideoElements và sau đó sử dụng requestAnimFrame (thông qua shim của Paul Irish ) để vẽ chúng lên một khung vẽ duy nhất và duy trì đồng bộ hóa giữa các yếu tố khác nhau.
Mặc dù đây là chức năng và hệ thống có thể giữ đồng bộ hóa khá tốt (dung sai +/- 80ms) nhưng có vẻ không hiệu quả để nói. Tôi đã suy nghĩ về việc tối ưu hóa và một cách tiếp cận có vẻ khá đơn giản là kết hợp tất cả các phương tiện truyền thông thành một "video sprite" lớn hơn và phục vụ điều này. Điều này sẽ cho phép nó được tải vào một thành phần video duy nhất có thể được sử dụng trích xuất và hiển thị các khu vực phía khách hàng quan tâm bằng cách sử dụng drawImage()
và loại bỏ nhu cầu quản lý đồng bộ giữa các nguồn.
Có ai khác thực hiện một cái gì đó tương tự trong quá khứ? Nếu vậy phương pháp nào làm việc tốt cho bạn?