应公司要求，使用混合开发app，背景动画使用的是js+h5，但是在app运行时，高耗电，弹出耗电高弹框，这样很不友好；
没办法，谁让咱们是苦逼的攻城狮，只能去分析原因：
首先搭建docker + battery historian环境（不了解的可以去度娘一下，有时间我会弄一篇环境搭建的）；
工具准备好了开始撸了；
adb shell
top -m 5
运行后 发现 耗电前五名 app高举榜首（汗颜）；
分析数据发现 在H5动画运行界面。CPU占用率始终是在30%左右，大家都知道 CPU运行时很耗电的，所以大致原因已发下；
接着导出adb bugreport > bugreport.txt
分析bugreport报告，发现传感器和屏幕 耗电比较多；其他暂时无发现；
暂时感觉再无其他 ；最终分析高耗电原因结果是：H5动画占用CPU过高、传感器调用频繁、视屏播放时长、屏幕常亮这几个原因造成；
原因已经查到，那就解决吧：
1.H5动画 占用CPU过高
原因是因为H5动画重绘，造成webview重绘，也就造成界面重绘，这样是很让费CPU和GPU 造成高耗电的；
解决办法：
方法一：把H5动画换成gif，然后放在服务器上，不让H5重绘；（不是太建议，因为很多逻辑都是js开发，所有小伙伴不太想采用方法二）
方法二：把H5动画换成gif，直接设为界面背景图（个人感觉这是最好的方式，当然需要注意GIF的大小，最好不要超过1M）
通过上述方法，发现CPU 占用率下降了原来的1/3，这样耗电就会减少了
2.传感器调用频繁
原因是传感频繁调用造成软硬件交互，这会造成高耗电
解决办法：
优化采集参数，降低传感器调用频次等；
3.视频播放+屏幕常亮
这个 因为app性质决定，本来就是播放视频的app,这是没法降低的，所以小编就放弃向这个方向优化的目标；
总上处理后，耗电量明显降低；
嘿嘿：有不当之处，欢迎交流指正，谢谢！