# Video optimization — Web Performance Optimization

Source: https://www.geekswithgeeks.com/en/web-performance/web-perf-15

> 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

**Quiz:** What should preload be for videos?

- [ ] preload=none by default
- [ ] Always preload=auto
- [ ] preload=metadata only