加快多媒体资源的加载

前两天有被问到一个网站媒体资源加载速度优化的问题，今天这里单独分享一下。

情况是这样的，张三在网站的顶部放了一个视频，主要内容便是工厂的全景视频介绍，看起来非常的高大上。

不同于传统的使用第三方分享链接的做法，张三是直接将这个视频放在自己的网站上的。

这就导致一个问题，网站页面在加载的过程中会非常耗时，单单这个视频的加载就需要十多秒钟，外加页面上其他内容的加载肯定就需要比较长时间了。

怎么解决现在的问题？

首先肯定是要解决这个视频大小的问题了，不改变既定方案的话，最佳的做法肯定是使用 GIF 动效图片去替代这个视频。

视觉效果上没什么影响，可以的话加点图片文字的效果进去，感官体验上可能会更好，且更关键的是页面的加载速度能提升得非常明显。

其次就需要一些常规的页面优化技巧了。

比如页面的内容的懒加载、图片资源的压缩等等之类的，这部分内容使用缓存插件基本都能实现出来。

上述这样的措施做完，页面的加载速度大概率能回到正常范围，可能因为这种大图的缘故还是需要 4-5 秒左右的加载时间。

如果想这类媒体资源的加载速度更快一些，就需要使用 CDN 技术了。

其实 CDN 并不是什么高大上的技术，通俗点讲就是相关服务商把你的媒体资源拷贝很多很多份，然后放在全世界不同地域的服务器上。

有了这样的操作之后，当地用户肯定就能从物理位置最近的服务器上获取到你的网站内容，访问速度自然也就上去了。

要想实现这样的效果，基本的方案有两种。

第一种是购买付费版本的缓存插件，然后选择对应的 CDN 服务，缓存插件自然就会将后续的所有操作自动处理好了。

如果你只有一两个网站，且懒得折腾技术这块内容，这类付费方案肯定是最合适的。

第二种则是我们自己手动托管网站的多媒体资源，然后借助这类免费服务的能力来实现 CDN 托管的目的。

目前的免费方案，我肯定是推荐 Cloudflare 平台了，不仅有 10G 的免费空间大，而且每天的流量请求额度也异常大。

具体的做法就是三步，先去平台创建一个图片服务，然后将自己需要托管的媒体资源上传上去并生成访问链接，最后将这个访问链接填写到我们的网站上。

具体的搭建教程，可以搜索下「Cloudflare 图床搭建」这样的关键词，能找到非常多资源。

注：最好用英文搜索，老外做的一些教程真的非常细致，老奶奶看完都可以上手操作。

这里再补充一个开源的图床管理软件，有了这款软件的帮助我们便可以实现类似图片网盘那样的功能，于是就可以非常方便的管理我们的线上托管资源了。

这种方案是我接触下来，属于新手友好类型的那一类吧。