每日整理真实提问 356 个问题 · 726 个回答 需要系统性的技术文档?看 Shopify 技术百科 1000 篇 → 400-873-8117
已解决 提问于 2 个月前

首页视频自动播放很卡

2 个回答 2,235 次浏览 性能与 Core Web Vitals 最后活跃 2 个月前
29

首页放了一个 8MB 的自动播放视频,移动端加载体验很差。

陈
陈工提问者
Shopify 认证开发者 · 专注主题与 Liquid
2 个月前提问 · 已收到 2 个回答

2 个回答

已采纳 · 提问者确认解决
23

先把判断放在前面:视频自动播放会抢占带宽与解码资源,移动端尤其明显。

1处理顺序

  1. 用静态首帧图作为封面,点击或进入视口后再加载视频。
  2. 视频压缩到 2MB 以内,用 WebM + MP4 双格式。
  3. 移动端直接不自动播放,改成点击播放。
  4. 用 preload="none",避免预加载整个文件。
  5. 监控播放率,如果多数人不看,直接去掉。
验收:移动端加载时间下降,视频仍可正常播放。
风 风格技术团队 回答于 2 个月前
7

首页视频的转化贡献往往被高估。用数据说话:如果播放率低于 20%,它只是在拖慢所有人。

L Lily · DTC 品牌独立站运营负责人 · 2 个月前

你的处理方式是什么?

写下你实际验证过的步骤,比「我也有这个问题」有用得多。当前版本为静态展示,提交后会由团队整理并回复。

描述你遇到的现象、店铺环境(主题 / 套餐 / 应用)、已经试过哪些操作……
我要单独提问 工作日 10 分钟内回复,可直接加微信 fenggejishu