Skip to content

Instantly share code, notes, and snippets.

Last active December 19, 2021 02:24
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
What would you like to do?
Optimize video for web ("Hint for Streaming"/"Faststart")


With: (brew install ffmpeg)

The command I used to strip the unused/silent audio channel + "hint for streaming" was:

ffmpeg -i my-video.mp4 -c copy -an -movflags faststart my-video-nosound-hint.mp4

This caused an 8MB video which was too big for web usage, to become a 10MB file that plays immediately while the video is still downloading.

  • Before: Lighthouse complained about the page and the video file (Rightly so).
  • After: Lighthouse greenlit the page and the video file (Above the fold).

To do the same without stripping audio channel it's:

ffmpeg -i my-video.mp4 -c copy -an -movflags faststart my-video-hint.mp4


Using mkclean... (Source)

mkclean --doctype 4 --keep-cues --optimize original.webm optimized.webm

Then embed them with

<video autoplay muted loop playsinline poster="/poster.jpg">
  <source src="/video.webm" type="video/webm">
  <source src="/video.mp4" type="video/mp4">
  Sorry, your browser doesn't support embedded videos.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment