MP4 vs WebM cho web - khi nào dùng từng định dạng
freetoolonline.com Editorial Team
MP4 (H.264) và WebM (VP9/AV1) là hai định dạng video cho web. MP4 là tùy chọn mặc định chạy trên mọi trình duyệt; WebM tạo file nhỏ hơn 30-40% trên trình duyệt hiện đại với codec miễn phí bản quyền. Hướng dẫn này phân tích đánh đổi codec, hỗ trợ trình duyệt năm 2026 và ba quyết định sản xuất.
Container vs codec - mỗi tệp thực sự chứa gì
Container bọc video, audio và metadata vào một tệp duy nhất mà trình phát có thể đọc. MP4 (ISO base media) và WebM (một profile Matroska hạn chế) đều là container. Codec là cách pixel video và mẫu audio được nén. MP4 có thể, về lý thuyết, mang gần như bất kỳ codec nào, nhưng trong thực tế hệ sinh thái web coi MP4 là tệp H.264. WebM được xây dựng cho codec miễn phí bản quyền - VP8 (hiếm trong 2026), VP9 (chính thống), và AV1 (mới nhất, nén cao nhất).
Khi quyết định được đặt là "MP4 hoặc WebM", quyết định thực sự là H.264 vs VP9 vs AV1 - mã hóa codec nào. Container theo codec. H.264 đi trong MP4; VP9 và AV1 đi trong WebM trên web.
So sánh kích thước codec cho cùng chất lượng hình ảnh
| Kịch bản | H.264 (MP4) | VP9 (WebM) | AV1 (WebM) |
|---|---|---|---|
| Clip 60 giây 1080p 30fps | ~12 MB | ~7 MB | ~5 MB |
| Clip 60 giây 720p 30fps | ~6 MB | ~3.5 MB | ~2.5 MB |
| Tiết kiệm bitrate tương đối vs H.264 | 0% (chuẩn) | ~40% nhỏ hơn | ~55% nhỏ hơn |
| Thời gian mã hóa cho 1 phút 1080p | ~15 giây | ~2-3 phút | ~8-15 phút |
| CPU phát lại trên laptop tầm trung | Thấp (giải mã phần cứng) | Thấp (giải mã phần cứng) | Vừa (giải mã phần cứng không đều trên GPU trước 2023) |
Thực tế hỗ trợ trình duyệt năm 2026
MP4/H.264 phát ở 100% trình duyệt đang chạy - Chrome, Firefox, Safari, Edge, mọi WebView di động. Đã như vậy một thập kỷ. Nếu việc video phát được quan trọng hơn byte tiết kiệm, gửi H.264.
WebM/VP9 phát ở Chrome, Firefox, Edge, Opera, và Safari (từ Safari 14, macOS Big Sur, 2020). Safari di động trên iOS 14+ hỗ trợ VP9. Một khán giả còn lại rất nhỏ trên iPhone cũ dưới iOS 14 không thể giải mã VP9.
WebM/AV1 phát ở Chrome 70+, Firefox 67+, và Edge 75+. Safari thêm hỗ trợ AV1 trong 17.4 (2024). Giải mã AV1 phần cứng yêu cầu silicon tương đối mới - Intel gen 11 (Tiger Lake) trở lên, Apple M3 trở lên, AMD serie 6000 trở lên. Thiết bị trước 2022 chuyển về giải mã phần mềm, ngược pin và có thể mất khung trên nội dung 4K.
Mẫu fallback <source>
Mẫu HTML5 video chính tắc phục vụ một codec được khuyến nghị mà trình duyệt có thể giải mã và chuyển xuống danh sách:
<video controls preload="metadata" poster="cover.jpg">
<source src="clip.av1.webm" type="video/webm; codecs=av01.0.05M.08">
<source src="clip.vp9.webm" type="video/webm; codecs=vp9,opus">
<source src="clip.h264.mp4" type="video/mp4; codecs=avc1.4D401F,mp4a.40.2">
<p>Trinh duyet cua ban khong ho tro video HTML5.</p>
</video>Trình duyệt đi qua danh sách <source> từ trên xuống, chọn type đầu tiên nó nhận ra, và bỏ qua phần còn lại. Phục vụ AV1 trước bắt được ~60% thiết bị năm 2026 có giải mã AV1 phần cứng; VP9 bắt được phần lớn còn lại; H.264 đảm bảo fallback 100%.
Ba quyết định sản xuất thực tế
Ba quyết định sản xuất thực tế cho MP4 vs WebM cho web là autoplay hero, tương thích tải xuống và bản gốc lưu trữ - xuất MP4 H.264 để phủ sóng, thêm WebM khi tối ưu trọng lượng Chrome.
Quyết định 2 - Video hero nền trên trang marketing 1080p, loop 15 giây. → MP4 (H.264) + WebM (VP9). Tệp VP9 đi ở ~60% kích thước H.264, nghĩa là tải trang nhanh hơn cho khách có kết nối chậm. Tệp H.264 là fallback cho ai trình duyệt bỏ qua WebM. Thời gian mã hóa nhỏ (một lần, clip 15 giây).
Quyết định 3 - Thư viện streaming định dạng dài (dịch vụ VOD, nền tảng khóa học, video 30+ phút). → AV1 (WebM) + VP9 (WebM) + H.264 (MP4). Tệp AV1 tiết kiệm CDN egress đáng kể ở quy mô. Tệp VP9 phủ mọi trình duyệt hiện đại. Tệp H.264 là fallback phổ thông. Mã hóa trên phần cứng GPU hoặc pipeline batch; thời gian mã hóa AV1 10× quan trọng khi thư viện có hàng ngàn video.
Công thức mã hóa
Công thức mã hóa trên MP4 vs WebM cho web: giữ thẳng CRF ngắn cho MP4 H.264, xuất bản sao WebM VP9 khi trọng lượng trang quan trọng, và đừng bao giờ chỉ xuất WebM mà không có fallback MP4.
VP9 (WebM) - cân bằng nén/tương thích tốt nhất. Dùng mã hóa hai lượt cho chất lượng nhất quán ở bitrate mục tiêu. -c:v libvpx-vp9 -b:v 0 -crf 31 -row-mt 1 -c:a libopus -b:a 96k. Cờ -row-mt 1 kích hoạt multi-threading theo hàng cắt thời gian mã hóa khoảng một nửa trên CPU hiện đại.
AV1 (WebM) - nén tối đa. SVT-AV1 là encoder mà ngành công nghiệp đã chọn: -c:v libsvtav1 -crf 35 -preset 6 -c:a libopus -b:a 96k. Preset 6 là cân bằng mặc định giữa tốc độ và nén; preset thấp hơn (4, 5) ưu tiên chất lượng với giá mã hóa lâu hơn nhiều.
Khi nào tránh WebM hoàn toàn
Nếu khán giả chủ yếu là iOS < 14, Android WebView cũ, hoặc trình duyệt doanh nghiệp cũ, WebM không cung cấp lợi ích - các thiết bị đó sẽ chuyển xuống nguồn H.264 dù sao, và mã hóa WebM là công sức lãng phí. Nếu video là nội dung do người dùng tạo mà người xem thường lưu, chia sẻ lại, hoặc chỉnh sửa, H.264 MP4 là định dạng công cụ của họ mong đợi chấp nhận.
Các ứng dụng email hầu như không bao giờ render <video> bản địa. Nếu video ở trong bản tin email, xuất GIF động ngắn hoặc liên kết MP4 tới landing page - cả WebM lẫn tag video HTML5 inline đều không giúp.
Chuyển đổi giữa các định dạng
Chuyển đổi giữa các định dạng cho MP4 vs WebM cho web: mở Video Converter, chọn container đích, và kiểm tra lại âm thanh - WebM cạm vẫn cần bản sao MP4 cho người dùng Safari.
Công cụ liên quan
- Video Converter - chuyển đổi MP4, WebM, MOV trong trình duyệt.
- FFmpeg Online - FFmpeg dòng lệnh trong trình duyệt.
- Video Maker - ghép ảnh thành clip video.
- Compress Image - giảm kích thước tệp ảnh bìa.
Hướng dẫn liên quan
- MP4 vs MOV vs MKV - which container when - Chọn giữa ba container phổ biến cho các pipeline sản xuất khác nhau.
- Before a video call - which tools to run - Danh sách kiểm tra trước cuộc gọi cho tính sẵn sàng màn hình, camera và micro.