Lesson 15 / 25

Video optimization

Optimize video delivery through compression, format selection, and lazy loading strategies.

Video compression and codecs

Use VP9 or H.265 for best compression. Provide fallback (H.264). Compress with tools like FFmpeg: ffmpeg -i video.mp4 -c:v libx264 -crf 23 output.mp4. Target bitrate ~5Mbps for 1080p, 1.5Mbps for 480p.

Adaptive streaming and delivery

Use DASH or HLS for adaptive bitrate streaming. Serve multiple quality versions. Replace video with static image on slow connections. Add preload=none by default to avoid downloading video metadata.

Video as background alternative

Consider static image with video enhancement on load. Use small preview image while video loads. Disable autoplay on mobile. Animated GIF alternative uses 5-10x more data than optimized video.

Quick check

Quick check: What should preload be for videos?

  • preload=none by default
  • Always preload=auto
  • preload=metadata only
Answer