背景: 最近项目中使用到
movable-view
来做一个拖拽排序的功能,等到功能都实现完成后到真机测试发现,拖拽动画在Android端存在严重的卡顿掉帧,及其不跟手,但是在IOS端却挺流畅。查阅Google发现也有相同的小伙伴有类似问题:小程序的移动拖动图片安卓太过卡顿如何解决
导致卡顿掉帧的原因
例如页面有 2 个元素 A 和 B,用户在 A 上做 touchmove 手势,要求 B 也跟随移动,movable-view
就是一个典型的例子。一次 touchmove 事件的响应过程为:
a、touchmove 事件从视图层(Webview)抛到逻辑层(App Service)
b、逻辑层(App Service)处理 touchmove 事件,再通过 setData 来改变 B 的位置
一次 touchmove
的响应需要经过2 次的逻辑层和渲染层的通信 以及一