mathiasbynens / small

Smallest possible syntactically valid files of different types
https://mathiasbynens.be/notes/minimal-html
1.9k stars 186 forks source link

MP4 + HTML5 = MEDIA_ERR_SRC_NOT_SUPPORTED #62

Open sampotts opened 8 years ago

sampotts commented 8 years ago

When trying to use the mp4 file in a HTML5 video player, it returns a MEDIA_ERR_SRC_NOT_SUPPORTED error. Here's a couple of test pages (check the console):

Using RawGit (which appears to use wrong Content Type): http://codepen.io/sampotts/pen/RRxwxZ

Then tried a different CDN with correct Content Type but same error: http://codepen.io/sampotts/pen/OXzJOG

Prinzhorn commented 7 years ago

FWIW in Firefox it's MEDIA_ERR_DECODE (3) and not MEDIA_ERR_SRC_NOT_SUPPORTED (4).

AMP (https://github.com/aghassemi/amphtml/blob/bc101c6a67f7ef882b4842e49853263feec0cbab/src/service/video-manager-impl.js#L366) uses a 909 bytes mp4 (the one in this repo is 843). So if anyone wants to study the mp4 spec and find out what makes the differences, go for it! Not that many bytes to compare :laughing:

I already have enough. The ffmpeg command mentioned in the AMP source comment gives me a 1562 byte file, not 909. What is software? How do computers work?

Also:

Does it need to be 2 seconds?

I tried with 1 second as well, difference in size was less than 30 bytes. Somewhat illogically and superficially I feel 2 seconds is a 'safer' choice for compatibility. There are enough off-by-one bugs in the world to scare me from using 1 as a value for anything :) I know this is not a satisfying answer, but I think 30 bytes is worth it.

Which would already get hella close to the 843 (879).

joeyhoer commented 4 years ago

A few comments on the MP4 file — I found that Mac OS Finder will only display an icon preview if there is a frame larger than 16px × 16px. I believe this requirement also applies to Mac OS Spotlight preview. I noticed that some services will not accept video uploads with a timestamp of 0s.

I've been using this command to generate small mp4s:

duration=1
convert -size 16x16 xc:black /tmp/a.png
ffmpeg -loop 1 -framerate 1 -i /tmp/a.png -pix_fmt yuv420p -t $duration -profile:v baseline -bsf:v 'filter_units=remove_types=6' small.mp4

Note: The -bsf:v 'filter_units=remove_types=6' removes the "Writing Library" metadata, including this filter decreases file size slightly. It also seems like the baseline profile -profile:v baseline produces slightly smaller files.

It's also possible to make a 0 second video using this:

ffmpeg -i /tmp/a.png -pix_fmt yuv420p -profile:v baseline -bsf:v 'filter_units=remove_types=6' small.mp4