【发布时间】：2022-01-28 11:08:52
【问题描述】：
我正在托管一个基于 github 页面上的 react 构建的页面，我的问题是我正在显示视频并且它会影响性能。我应该购买 CDN 来提供视频或图像，还是应该更换服务器并仍然提供静态内容？无论如何，cdn 会有所帮助还是 github 页面很慢？
【问题讨论】：
标签： reactjs github github-pages cdn
【发布时间】：2022-01-28 11:08:52
【问题描述】：
您如何嵌入视频？如果您通过 Youtube 嵌入视频，它应该选择足够低的质量以适应更快的加载时间，否则您可以在视频标签中尝试lazy-loading=true，如果您从其他来源拉取视频，则可能是异步的。否则，您会发现对性能影响最大的是通过压缩视频来限制客户端必须下载的数据量。
【讨论】：
-
我只是在导入它
import Video from '../../video/video2.mp4'; <StyledVideo src={Video} autoPlay muted loop />我会尝试延迟加载和异步谢谢。 -
我认为在您的情况下，您应该压缩视频，这将比异步和延迟加载相结合产生更大的影响。特别是如果视频出现在首屏（在页面顶部），无论如何都必须加载。尝试通过尽可能减小文件大小来压缩视频，同时保留大部分质量。有在线资源可以做到这一点，或者您可以使用 HandBrake 进行更多定制（尽管我更喜欢使用网站来播放小视频）。