如何在网站上轻松观看中等大小的视频？

Question

我的网站上有一个 63MB 的视频。它应该在打开网站后立即开始播放，但没有播放，而是挂了 20-30 秒。

我选择了最小分辨率 720p，H-264 编码。我还能做些什么来增加用户体验？

你可以在这里看到加载时间：

https://sendmade-portal-vercel.vercel.app/hu/product/zer-jewel-rez-gyertyatarto

这是video的用法：

<video
  ref={videoRef}
  width="100%"
  muted
  loop
  playsInline
  controls={props.isControlsVisible == true}
  autoPlay={props.isAutoplay == true}
  style={{
    width: "100%",
    height: "auto",
    zIndex: -1,
  }}

Answer 1

65 MB 对于使用视频作为背景来说太多了。您必须遵守以下规定：

您的视频必须静音（删除音频）
使用默认图片（无论你的视频多小，加载和显示都需要几秒钟）
删除移动尺寸的视频
您的视频应该很短（根据经验，最好的报价是 10 - 20 秒）

您可以使用 HandBrake 程序（它是免费的）以最小的质量降低来减小视频大小。在测试中，您的视频大小减小到 7 MB（我使用 Very Fast 720p30 选项并在视频选项卡中 select 24FPS）

如何在网站上轻松观看中等大小的视频？

How make middle size video watching painless in website?

html

javascript

video