sampotts/plyr

🎬 Plyr: Trình phát đa phương tiện đa nền tảng đẹp, nhẹ và tiếp cận

Một bộ trình phát đa phương tiện hiện đại hỗ trợ HTML5, YouTube và Vimeo với thiết kế sạch, tuân thủ tiêu chuẩn truy cập và hỗ trợ streaming.

Plyr là một thư viện JavaScript "vanilla" ES6 nhẹ, không phụ thuộc vào bất kỳ framework nào, cung cấp trải nghiệm phát lại đa phương tiện nhất quán và có thể tùy biến hoàn toàn trên mọi nền tảng như video/audio HTML5, YouTube và Vimeo. Dự án được thiết kế để dễ dàng tích hợp và mở rộng, phù hợp với mọi dự án web hiện đại.

✨ Điểm nổi bật

• Hỗ trợ đa định dạng: HTML5 Video & Audio, YouTube và Vimeo.
• Tiếp cận (Accessible): Hỗ trợ đầy đủ VTT captions và trình đọc màn hình.
• Tùy biến hoàn toàn: Dễ dàng thay đổi giao diện bằng markup và CSS.
• HTML sạch: Sử dụng các phần tử đúng như <input type="range">, <progress> và <button>.
• Đáp ứng mọi kích thước màn hình: Responsive với mọi thiết bị.
• Hỗ trợ streaming: Tích hợp hls.js, Shaka và dash.js.
• API chuẩn hóa: Điều khiển phát lại, âm lượng, tua nhanh qua API thống nhất.
• Sự kiện đồng nhất: Tất cả sự kiện được chuẩn hóa giữa các định dạng.
• Hỗ trợ toàn màn hình: Native fullscreen với phương án dự phòng "full window".
• Phím tắt bàn phím: Hỗ trợ điều khiển bằng phím tắt.
• Picture-in-Picture: Hỗ trợ chế độ phát lại PiP.
• Playsinline: Hỗ trợ thuộc tính playsinline trên thiết bị di động.
• Điều chỉnh tốc độ: Thay đổi tốc độ phát linh hoạt.
• Nhiều dòng phụ đề: Hỗ trợ nhiều track phụ đề.
• Đa ngôn ngữ (i18n): Dễ dàng quốc tế hóa giao diện.
• Ảnh thu nhỏ xem trước: Hiển thị thumbnail khi di chuyển thanh thời gian.
• Không cần framework: Chỉ sử dụng ES6 thuần, không cần jQuery.
• Sass đi kèm: Dễ dàng tích hợp vào quy trình build.

💡 Vì sao đáng chú ý

Plyr khác biệt so với các bộ trình phát khác bởi sự tập trung vào sự đơn giản, hiệu suất và khả năng tiếp cận. Thay vì dựa vào các thành phần tùy chỉnh phức tạp, Plyr sử dụng các phần tử HTML5 chuẩn, giúp giảm kích thước và tăng tính bảo trì. Đặc biệt, API và sự kiện được chuẩn hóa đồng nhất giữa HTML5, YouTube và Vimeo, giúp nhà phát triển dễ dàng quản lý logic phát lại mà không cần viết mã riêng cho từng nền tảng.

#HTML5 #YouTube #Vimeo #JavaScript #OpenSource #TiniX