cover-view随着时间增加,出现绑定事件延迟,而且延迟越来越大,如何解?
发布于 5 年前 作者 xyi 12478 次浏览 来自 官方Issues
<view class="page-body"
      style='top:{{body_top}}px;left:{{body_left}}px;width:{{body_width}}px; height:{{body_height}}px'>
    <camera class="camera-layer"></camera>
    <canvas class="canvas-3d-layer"
            type="webgl"
            id="3d-canvas"
            disable-scroll="true"
            bindtouchstart="fn_touch_start"
            bindtouchmove="fn_touch_move"
            bindtouchend="fn_touch_end"
    >
                <cover-view class="Announcement" catchtap="fn_click_test">
                    <cover-view style="background:{{mycolor}}">test :{{delta}}</cover-view>
                    <cover-view  bingtap="fn_click_test2"></cover-view>
                </cover-view>
    </canvas>
 
</view>

视图层级结构如上,对于cover-view上绑定的事件fn_click_test在IOS上,点击响应(延迟)会随着程序时间的增加而增加。但是canvas层上的事件却几乎感觉不到延迟(也就是表现正常),有人解答下吗?

实验:手机:IphoneXR / IphoneX

  1. 我注释掉<camera>标签,情况有所好转,仅仅是好转,过一会儿又不行了( fn_click_test 在IOS上,点击响应(延迟)会随着程序时间的增加而增加)。

  2. 打开<camera>标签,注释掉cavas下的threejs渲染逻辑,正常了。/** 从这里开始我怀疑是渲染效率的问题*/

  3. 新建代码片段,发现还是正常的,猜测渲染影响了整个程序。

  4. 打开所有threejs渲染代码,在<canvas>上添加事件,发现<cover-view>标签事件出现延迟(随应用启动时间增大而增大),但是<canvas>事件正常。

  5. 完全懵圈,来此询问关于<cover-view>层事件传输机制的问题。

希望贵司技术同学能帮忙解答下。

3 回复

你好,麻烦具体描述问题流程,提供出现问题的具体机型、微信版本号、系统版本号,以及能复现问题的代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html

这个问题我们已经在新版本上修复了。另外,作为临时的解决方案,你可以试试把绘制任务放进 Promise 或 setTimeout 内延后一点执行,类似这样:

canvas.requestAnimationFrame(() => {
  setTimeout(() => {    // render goes here     })
})

Mark:2019年11月28日

利用临时解决方案

canvas.requestAnimationFrame(() => {

  setTimeout(() => {   // render goes here     })

})

验证问题结果:成功解决。

多谢,@小程序技术专员-Eric

回到顶部