There are two most popular tools for video optimization - Handbrake and ffmpeg. So, by clever combination of webm + VP9 and mp4 + H265 for our videos, we can achieve 94% global coverage. It is not a royalty-free codec - perhaps, that is why the adoption rate is much less than of WebM's. H265, a.k.a HEVC (High-Efficiency Video Coding), is a codec supported by Apple and shows the same 20-50% better efficiency than its H264 older brother. Apple brought WebM support since macOS Big Sur to Safari on desktops, but to this day failed to make any progress on its mobile version.ĭon’t be sad though, there is a solid alternative for iOS users.

Every modern browser on desktop and mobile supports it, except Safari on iOS. It can save up to 20-50% in size compared with H264 codecs retaining the same quality level.

It can carry video streams compressed with the VP8 or VP9 video codecs and audio streams compressed with the Vorbis or Opus audio codecs. WebM is an open, royalty-free media file format designed for the web. H264 is very popular but much less optimized than VP9 or H265. For WebM, it's VP8 and VP9, while in mp4 could be almost anything.įor example, the video above from Apple's new Macbook Air site uses mp4 format, but if we look deeper, it uses the H264 codec. Now that it is clear, the next important thing to learn is that not every codec is suitable for every video format. Some popular examples of video formats are mp4, WebM, or MKV. Video and audio streams inside these containers are multimedia data encoded with codec. Think of video format as a container that defines file structure for carrying video and audio streams. This topic can be confusing, so it's important to learn the difference. In this article, we will learn about codecs like VP9 and H265, and how we can optimize video using ffmpeg tool. Using video for animation with proper optimization is always better than GIF and sometimes outperforms native implementations. Modern video codecs can deliver excellent quality while preserving a very reasonable size. Unfortunately, the same can't be said about videos. When it comes to images, almost every framework, headless CMS, or CDN offers built-in optimization options.

Frameworks compete by optimizing network requests, images, and code to achieve a blazing-fast loading experience. Modern web development every year applies new standards for performance.

Ffmpeg h264 codec