Javascript 使用视频代替 GIF 动画

阅读(477)

<img>播放视频,加载更快,耗电更低,性能更好。但,safari only.

GIFs can be up to 12 times as expensive in bandwidth and twice as expensive in energy use when compared to a modern video codec. Instead, use H.264-encoded MP4 files for animations; for example:

<img src="explosion.mp4" alt="An explosion of colors.">

By placing your videos in elements, the content loads faster, uses less battery power, and gets better performance.

To maintain compatibility with other web browsers, also include a fallback image:

<picture>
    <source srcset="explosion.mp4" type="video/mp4">
    <img src="explosion.jpg" alt="An image of an explosion.">
</picture>

via:https://developer.apple.com/documentation/webkit/delivering_video_content_for_safari/

Tags: