33600 位用户此时在线
24小时点击排行 Top 10：
- 本站自动实时分享网络热点
- 24小时实时更新
- 所有言论不代表本站态度
- 欢迎对信息踊跃评论评分
- 评分越高，信息越新，排列越靠前
2
1
0
我在翻译这篇Sora的技术报告的时候，发现一个网页得有一百多个视频，如果打开网页就很卡，因为video标签没有lazy…
IT技术
(
twitter.com
)
由
宝玉
提交
我在翻译这篇Sora的技术报告的时候，发现一个网页得有一百多个视频，如果打开网页就很卡，因为video标签没有lazy load功能。要么preload设置为none，默认不下载视频，但是就什么也不显示了，看不出来啥视频。如果preload设置为auto，那么就意味着加载网页的时候，会去请求所有网页中的视频，这会导致网页很卡顿，并且很费流量。
我的博客是基于 https://t.co/6j9CI7y3oH 搭建的，博客内容支持Markdown和HTML还有React，所以我做了一点优化，默认设置所有视频的preload为none，然后增加了网页可见区域的检测，如果当前可见区域有视频，就将相应的视频的preload属性设置为auto，这样就只会加载可见区域内的视频，网页不会卡顿，加载速度也会更快更省流量。
代码见截图，前端同学应该不陌生。
点击图片查看原图
1
2
1
1
2
2
1
1
3
2
1
1
4
2
1
1
6
2
1
1
7
2
1
1
8
2
1
1
9
2
1
1
10
2
1
1
11
2
1
1
12
2
1
1
15
2
1
1
16
2
1
1
17
2
1
1
18
2
1
1
19
3
2
2
20
2
1
1
22
2
1
1
23
2
1
1