本文全文字数： 3308
预计阅读时间： 10 分钟
本文篇幅较长，建议亲亲能够完成阅读，将会学到不少干货哦~❤️
本文目录
一虚拟机
->我们为何关闭了之前的虚拟机服务？
->是否有新的虚拟机计划？
二流量优化
->静态流量优化方案
静态流量：每个案例打开时，产生的流量
->动态流量优化方案
动态流量：从数据库或者后台返回的图片或视频等资源产生的流量
三常见的“巨”坑
->视频投票案例常见“巨坑”
->“巨坑”填平建议(强烈)
最近收到了很多同学的抱怨和顾虑，觉得iVX的云服务费用太高了，不可控，希望可以恢复之前的虚拟机服务，让运维费用完全可控。
我先来回复一下关于虚拟机服务的问题，然后教大家怎样优化案例的流量费用部分，读完这篇“秘籍”，大家可能就会觉得控制流量费用完全是可行的了。
一虚拟机
1 为何关闭了虚拟机服务？
平台的成本不可控
运行一个案例，除了需要计算服务器，还需要mysql数据库、redis、ES全文搜索数据库、对象存储、连接服务器、公共的网关/api服务等等资源，特别是我们用aws高保障可伸缩mysql数据库，成本非常高。
我们无法将这些服务成本公平的“平摊”给每个计算服务器，因此每个“虚拟机”只是收取了纯计算的成本，这个对于平台来说无法覆盖成本，因此，我们只能暂时暂停了这个服务；
运维不可控
虚拟机里的后台代码是不会自动更新的，因此，当平台更新了一些新功能，案例重新部署至虚拟机可能会出现问题，需要一个一个去维护更新，这个工作量非常大，如果要重新上线虚拟机，我们需要重新开发一套虚拟机管理系统。
2 是否有新的虚拟机计划？
这个我们已经在技术上测算过是可行的，但新的虚拟机(或者叫“虚拟系统”更为确切)，我们需要将所有的资源，特别是数据库部分，打包进虚拟资源。
如果用户购买一整套虚拟资源，其实就是我们帮你维护部署了一整套aws系统。这个系统我们测算过，最低的配置，每个月的硬成本大约是1800+。这个成本，我们认为对于个人用户来说还是偏高，因此这个方案还在内部讨论中。
二 流量优化
接下来，我们来详细讨论一下怎样在公共平台的投放上省钱。
由于最近收到很多关于流量扣费的问题，因此在这部分中我主要来讲一下流量的优化。
iVX的扣费项目主要是两项：
👉流量
👉后台服务器运算
本期我们主要讲流量部分的扣费。
iVX的流量扣费，包括两个部分，一个是静态流量，一个是动态流量。
静态流量
我们先来讲静态流量。
静态流量，即每个案例打开时，产生的流量，其计算方法为：案例静态大小*打开次数 (这里的打开次数，仅计算正式发布上架地址的打开次数，测试发布的，不计算在内)
所以，
案例静态大小 = 案例资源大小 + 案例JS包大小
案例的资源大小，我们可以在发布界面中看到：
案例的js包大小，需要发布，系统对代码进行编译之后，才能够知道，因此在未发布时，看不到。
JS包的大小，我们可以通过这个地址来查询：
https://v4rel.h5sys.cn/api/10328579/nodelookup?nid=xxx
其中，xxx，就是你的案例的nid；
但只要不是特别变态的案例，一个案例的JS包，通常不会超过2-3M，我们可以取2.5M来做一个预估。因此，我们的工作主要是优化素材资源的大小。
举个例子，
如果我们将整个案例的静态大小控制在5M，
那，播放1000次的流量成本是：5*1000/1024*0.3=1.46元，这个成本对于一个商业案例来说，基本可以忽略了。播放1w次，也是14.6元。
根据我们的经验，通常一个营销类型的活动投放，不太会超过5w次，中小型的，不会超过1w次。这个成本，可以提前和客户沟通好。
那接下来的问题是，我们怎样压缩素材资源：
图片，尽量小于100K
根据我们的经验，对于移动端的图片来说，无论舞台是375宽还是750宽，一个全屏的背景图，100k，足够清晰了。
如果发现不清晰，那可能是这个图片的编码格式问题，大家可以试试官方推荐的图片压缩工具：tinypng.com。
我这里上传一个ios的桌面背景图大家感受一下：
上面这个图片的大小是53k。即使你觉得不够清晰，那*2倍的清晰度，在手机上也足够了。
因此，千万不要被设计师误导，设计师们喜欢用尽量高清的图，因此他们的电脑也都是顶配的专用机器，否则根本都跑不起来他们的项目。
作为开发者，我们一点要把资源优化放在第一位，这不仅仅可以省钱，而且可以大大提高用户打开案例的速度，提高用户体验。
优化字体包
有一个常见的“坑爹”的操作是上传一个没有剪裁过的字体包。即在普通文本的字体里，选择自定义上传字体：
如果我们上传的是中文字体包，基本上都是超过1M的，超过10M也不奇怪。
大家可以尝试上传一个中文字体包，然后去发布界面看一下，通常，字体包就是排在第一个的资源：
为啥字体包那么大？
因为中文的字体包，要包含所有常见的中文字，尽管你可能只是用了100个，但这个包里，可能包含5000+个字，所以就很坑流量了。
针对这种情况，主要有两种优化的方法：
使用中文字体组件
中文字体，是服务器动态生成的字体，可能会消耗一点动态的计算和流量，但生成图片这个计算很有限，对比一个5M+的字体包，会省钱很多；
剪裁字体包
网上有很多剪裁字体包的工具，可以将我们需要的字，从一个大的字体包里“提取”出来。
比如，我们只用了100个字，就可以把这100个字从5000字的字体包里抽取出来，这样字体包的大小也可以变成之前的50分之一。
针对各种网上的字体包压缩工具，我还没有详细评测过，欢迎大家在论坛评论区推荐~~
但注意，剪裁字体包的方法，只能适用于静态的文本，如果是用户输入的文本，也要支持使用自定义字体，那只能使用中文字体了。
使用动态流量来代替静态流量
动态流量，即在案例加载完成之后再去加载的资源。
比如，我们有一个很大的视频，需要在案例里播放。这个时候，如果我们把视频直接在视频组件里上传，那视频就会作为静态资源，出现在发布界面的“素材列表”中，所有出现在这个列表中的资源，都会在案例打开的时候加载，计算入静态流量。
但如果这个视频，不需要初始化就自动播放，而是需要用户点击之后才播放的，那这个时候，我们完全可以上传视频并把视频的url地址记下来，然后在用户点击播放的时候，在事件里对视频组件进行赋值，再让它加载这个url。
这样，这个视频就只有在用户点击的时候，才会加载视频产生流量，而不是在初始化的时候就产生所有视频的加载流量。
由于并不是每个打开案例的用户都会点击视频(或者点击所有的视频)，因此，这个方法可以节省掉很多不必要的流量加载。
动态流量
接下来，我们来讲一下怎样优化动态流量。
动态流量，即从数据库或者后台返回的图片或视频等资源产生的流量。
这些资源，不包含在案例静态包中，因此，会根据实际的使用情况来计算流量。(注意，中文字体组件，也是一种动态产生的图片，也会计算在动态流量中，而不是静态流量)
我们有一个工具可以检查动态流量
在案例发布地址(不一定需要上架)后面添加URL参数 logsize=1
例，
https://www.ivx.cn/test/cdn?logsize=1
在每次加载动态资源的时候，会在控制台，把当前新增的动态流量，以及本次打开的所有动态流量显示出来。
实例链接案例中，点击两个文本，可以从后台输出两个图片，我们会在控制台看到两个记录：
01
02
每条记录包含两个值，第一个值代表当前总动态流量，第二个值代表当前额外新增的流量。
三 常见“巨”坑
针对动态流量的优化，除了以上提到的尽可能优化素材大小以外，还有一个常见的坑。
这个问题，我这边近期碰到过3个案例，都是做视频投票，都产生了巨大的流量。
视频投票的案例，产生大流量的原因主要有二：
原因之一：用户自主上传的视频很大
用户自主上传的视频很大，动不动就是100M，那这个时候，我们要在列表里显示这个视频，就会非常烧钱了。想象一下有20个候选人，每个人上传了一个100M的视频……
这个时候，我们可以首先考虑限制视频的大小或时长。
推荐解决方法
👉请用户自行压缩视频。
👉或者做一个候选人审核的功能。
即不是用户提交了申请就马上让他出现在候选人列表中，而是需要通过审核。在审核的时候，我们完全可以去压缩一下他的视频。
👉实在不行，我们可以定时去数据库里看一下资源，然后手动压缩视频之后，替换。
原因之二：在列表里直接显示视频
如果在候选人列表里直接显示视频，那只要用户进入候选人列表，视频就会开始加载，产生流量。
但注意，此时在列表阶段，用户并不会真的去一个一个视频点开来看。
因此，我们在这个阶段，浪费了非常多的资源。
另外，注意数据库设置分页输出，否则，用户一滑列表，加载一堆视频，我们就开始烧钱了。
此时，我们要优化候选人列表。
推荐解决方法
👉在列表里设置显示视频的封面图。
iVX的上传视频功能，可以直接获取到封面图，我们将这个封面图，存在另一个字段里，在列表里只显示图片，那就可以避免巨大的流量消耗了。
👉注意数据库分页输出。
就是每次加载只输出当前页面所需要的素材，比如10个，然后当用户滑到底部的时候，再去加载另外10个，这样也可以很好的节省动态资源。
以上，就是我们对流量部分的优化总结，欢迎大家在论坛评论区提出更多建议~~
总之，
在发布时查看素材大小，
尽量控制在10M以内，
并通过?logsize=1,
检查案例的动态资源加载，
学会这些技巧，
相信你也会觉得控制流量费用不是问题了~~
彩蛋
推荐一个字体裁剪工具
https://font-subset.disidu.com/
