I'd like to load and play a smaller HEVC-encoded video on web browsers with support for it.
I'm using this code on Safari 11 (macOS 10.13), which has support for the HEVC format.
Video not supported
In Web Inspector > Network Panel, I see that Safari loads both clip.mp4 and clip-hevc.mp4. If I inspect the video element, I see that clip.mp4 is playing, not clip-hevc.mp4. I see the same thing on iOS 11.
When I call HTMLMediaElement.canPlayType() on the types I specified, I get
maybe on video/mp4; codecs=hevc
probably on video/mp4; codecs=avc1
Nothing on variants of the HEVC codec I've seen (e.g., hvc1, hev1)
Something else I noticed: When I remove the clip.mp4 option, clip-hevc.mp4 downloads and plays just fine!
How can I make sure that only the best supported MP4 variant downloads and plays in the browser?