Cách các PWA, WebAssembly và ChromeOS giúp trình chỉnh sửa video dựa trên nền tảng web mang lại hiệu suất tốt hơn và trải nghiệm hấp dẫn hơn cho 12 triệu người dùng.
97%
Mức tăng trưởng hằng tháng về số lượt cài đặt PWA
2,3x
Cải thiện hiệu suất
9%
Tỷ lệ giữ chân người dùng PWA cao hơn
Clipchamp là trình chỉnh sửa video trực tuyến trong trình duyệt, cho phép mọi người kể những câu chuyện đáng chia sẻ thông qua video. Trên khắp thế giới, hơn 12 triệu nhà sáng tạo sử dụng Clipchamp để dễ dàng chỉnh sửa video. Chúng tôi cung cấp các giải pháp đơn giản để tạo video, từ các công cụ trực quan như cắt và cắt, cho đến các tính năng thiết thực như trình ghi màn hình và thậm chí là trình tạo meme.
Ai sử dụng Clipchamp?
Người dùng của chúng tôi (hay những biên tập viên thường ngày như chúng tôi gọi) rất đa dạng. Bạn không cần có kiến thức chuyên môn để trở thành biên tập video bằng Clipchamp. Cụ thể, chúng tôi hiện đang nhận thấy các nhóm bán hàng, hỗ trợ đào tạo và tiếp thị sản phẩm đang sử dụng webcam và trình ghi màn hình để cung cấp nội dung giải thích nhanh có thêm văn bản và ảnh GIF giúp nội dung trở nên hấp dẫn. Chúng tôi cũng quan sát thấy nhiều doanh nghiệp nhỏ chỉnh sửa và đăng video trên mạng xã hội trong khi đang di chuyển.
Họ phải đối mặt với những thách thức nào?
Chúng tôi nhận ra rằng việc biên tập video lúc đầu có thể đáng sợ. Giả định đặt ra là việc này rất khó, có thể là do những trải nghiệm khó chịu trước đây với phần mềm chỉnh sửa phức tạp. Ngược lại, Clipchamp chú trọng vào sự dễ dàng và đơn giản, hỗ trợ lớp phủ văn bản, video và nhạc có sẵn, mẫu và nhiều tính năng khác.
Chúng tôi nhận thấy hầu hết các biên tập viên thường ngày không muốn tạo ra những kiệt tác phim chuyển động. Chúng tôi trò chuyện với người dùng rất nhiều và liên tục được nhắc nhở rằng họ đang bận rộn và chỉ muốn đưa câu chuyện của mình ra thế giới một cách nhanh chóng và dễ dàng nhất có thể. Vì vậy, đây là trọng tâm của chúng tôi.
Phát triển một ứng dụng web tiến bộ (PWA) Clipchamp
Tại Clipchamp, tất cả đều mong muốn mọi người có thể kể câu chuyện của họ qua video. Để hiện thực hoá tầm nhìn này, chúng tôi sớm nhận ra rằng việc cho phép người dùng sử dụng cảnh quay của riêng họ khi tập hợp dự án video là rất quan trọng.
Thông tin chi tiết đó đã tạo áp lực cho nhóm kỹ thuật của Clipchamp phải tìm ra một công nghệ có thể xử lý hiệu quả các tệp nội dung nghe nhìn ở quy mô Gigabyte trong ứng dụng web. Khi lưu ý đến những hạn chế về băng thông mạng, chúng tôi đã nhanh chóng loại bỏ giải pháp dựa trên đám mây truyền thống. Việc tải các tệp nội dung nghe nhìn có dung lượng lớn lên từ kết nối Internet bán lẻ thường sẽ khiến người dùng phải chờ rất nhiều trước khi chỉnh sửa, thậm chí có thể dẫn đến trải nghiệm kém hiệu quả cho người dùng.
Điều đó khiến chúng tôi chuyển sang một giải pháp hoàn toàn trong trình duyệt, trong đó tất cả hoạt động xử lý video "càng lớn" được thực hiện trên máy bằng tài nguyên phần cứng có sẵn trên thiết bị của người dùng cuối. Chúng tôi đặt cược một cách có chiến lược vào trình duyệt Chrome và nền tảng ChromeOS để giúp chúng tôi vượt qua những thách thức không thể tránh khỏi khi xây dựng một nền tảng tạo video trong trình duyệt.
Việc xử lý video rất đói tài nguyên, ảnh hưởng như nhau đến các tài nguyên của máy tính và bộ nhớ. Chúng tôi đã bắt đầu xây dựng phiên bản đầu tiên của Clipchamp ngoài Ứng dụng gốc (Di động) của Google (PNaCl). Mặc dù sau khi ngừng hoạt động, PNaCl là một lời xác nhận tuyệt vời cho nhóm chúng tôi rằng các ứng dụng web có thể có độ trễ nhanh và thấp, trong khi vẫn chạy trên phần cứng của người dùng cuối.
Sau này, khi chuyển sang WebAssembly, chúng tôi rất vui khi thấy Chrome dẫn đầu trong việc kết hợp các tính năng hậu MVP như thao tác bộ nhớ hàng loạt, tạo luồng và gần đây nhất là: thao tác vectơ có chiều rộng cố định. Nhóm kỹ thuật của chúng tôi đã rất mong chờ tính năng mới này, mang đến cho chúng tôi khả năng tối ưu hoá ngăn xếp xử lý video để tận dụng các thao tác SIMD, vốn phổ biến trên các CPU hiện đại. Tận dụng tính năng hỗ trợ SIMD WebAssembly của Chrome, chúng tôi đã có thể tăng tốc một số khối lượng công việc đặc biệt đòi hỏi như giải mã video 4K và mã hoá video.
Với ít kinh nghiệm trước đó và chưa đầy một tháng nỗ lực của một trong các kỹ sư, chúng tôi đã cải thiện hiệu suất lên gấp 2,3 lần. Mặc dù vẫn chỉ giới hạn ở bản dùng thử theo nguyên gốc của Chrome, nhưng chúng tôi đã có thể triển khai các cải tiến SIMD này cho phần lớn người dùng. Mặc dù người dùng của chúng tôi chạy các chế độ thiết lập phần cứng rất khác nhau, nhưng chúng tôi có thể xác nhận mức tăng hiệu suất phù hợp trong phiên bản chính thức mà không thấy bất kỳ tác động xấu nào đến tỷ lệ lỗi.
Gần đây hơn, chúng tôi đã tích hợp API WebCodecs mới xuất hiện, hiện có trong một bản dùng thử khác theo nguyên gốc của Chrome. Bằng cách sử dụng tính năng mới này, chúng tôi có thể cải thiện hơn nữa hiệu suất giải mã video trên phần cứng có thông số kỹ thuật thấp như trong nhiều Chromebook phổ biến.
Sau khi tạo một PWA, bạn cần khuyến khích người dùng sử dụng PWA. Giống như nhiều ứng dụng web, chúng tôi đã tập trung vào việc dễ dàng truy cập, chẳng hạn như đăng nhập bằng mạng xã hội, kể cả việc đăng nhập bằng Google, nhanh chóng đưa người dùng đến nơi họ có thể chỉnh sửa video và sau đó giúp xuất video dễ dàng. Ngoài ra, chúng tôi đã quảng bá lời nhắc cài đặt PWA trên thanh công cụ và dưới dạng thông báo bật lên trong bảng điều hướng của trình đơn.
Kết quả
PWA Chrome có thể cài đặt của chúng tôi đang hoạt động rất tốt. Chúng tôi rất vui mừng khi thấy tỷ lệ giữ chân người dùng PWA cao hơn 9% so với người dùng máy tính tiêu chuẩn. Số lượt cài đặt PWA đã rất lớn, tăng với tốc độ 97% mỗi tháng kể từ khi chúng tôi ra mắt 5 tháng trước. Như đã đề cập trước đó, các tính năng nâng cao của WebAssembly SIMD đã cải thiện hiệu suất lên gấp 2, 3 lần.
Hồ sơ
Chúng tôi rất ngạc nhiên trước mức độ tương tác và mức sử dụng PWA. Chúng tôi cho rằng tỷ lệ giữ chân người dùng Clipchamp có lợi vì PWA đã được cài đặt và dễ truy cập hơn. Chúng tôi cũng nhận thấy rằng PWA hoạt động tốt hơn cho trình chỉnh sửa, giúp ứng dụng trở nên hấp dẫn hơn và thu hút mọi người quay lại.
Hướng tới tương lai, chúng tôi rất hào hứng về cơ hội mà ChromeOS mang đến cho nhiều người dùng hơn nữa để hoàn thành nhiều công việc hơn mà không tốn nhiều công sức. Cụ thể, chúng tôi rất hào hứng về một số tính năng tích hợp tiện lợi với hệ điều hành cục bộ khi làm việc với các tệp. Chúng tôi cho rằng điều này sẽ giúp đẩy nhanh quy trình làm việc cho các biên tập viên bận rộn hằng ngày của chúng tôi và đó là một trong những ưu tiên hàng đầu của chúng tôi.