需求:在进行复杂程序操作的同时,毫秒级计时。
方案流程:
1. 使用setData进行毫秒级计时,以10s为例,代码很简单:
Ok,搞定了,测试一下,ios正常,android性能欠佳的机型、在没有执行复杂运算的情况居然差了几秒。。。?(有的甚至更多)
我们再稍微加点东西:
结果:10s的计时跑到了20多秒
原因:主线程中有其他任务在执行导致setInterval延迟执行。
2. 既然这样,我们减去延迟带来的时间差
结果:达到效果,只存在了毫秒级的误差了。
完美解决?我们来搞点事情
页面渲染出现了卡顿,会看到计时不会连续的变化,出现跳跃减少。
原因分析:数据的setData通信,造成的延迟。
3. 既然setData会有延迟,那么还有什么办法可以更新页面?——canvas
马上动手写个:
完美决绝!!,requestAnimationFrame小程序之前不支持,若支持可替代,实现方案有多种。
降级版的 requestAnimationFrame
牛逼plus
哈斯ki