收藏
回答

带动画的 canvas 页面内存一直暴涨,10 分钟微信自己退出

问题模块
API和组件

下面是改编的官方的 小程序示例 中的 画布 -》canvas 弹小球的代码:


Page({

  onLoad: function() {

    this.context = wx.createContext();

  },

  onReady: function () {

    this.position = {

      x: 150,

      y: 150,

      vx: 2,

      vy: 2

    }

    this.drawBall()

    this.interval = setInterval(this.drawBall, 17)

  },

  drawBall: function () {

    var p = this.position

    p.x += p.vx

    p.y += p.vy

    if (p.x >= 300) {

      p.vx = -2

    }

    if (p.x <= 7) {

      p.vx = 2

    }

    if (p.y >= 300) {

      p.vy = -2

    }

    if (p.y <= 7) {

      p.vy = 2

    }


    var context = this.context;


    function ball(x, y) {

      context.beginPath(0)

      context.arc(x, y, 5, 0, Math.PI * 2)

      context.setFillStyle('#1aad19')

      context.setStrokeStyle('rgba(1,1,1,0)')

      context.fill()

      context.stroke()

    }


    ball(p.x, 150)

    ball(150, p.y)

    ball(300 - p.x, 150)

    ball(150, 300 - p.y)

    ball(p.x, p.y)

    ball(300 - p.x, 300 - p.y)

    ball(p.x, 300 - p.y)

    ball(300 - p.x, p.y)


    wx.drawCanvas({

      canvasId: 'canvas',

      actions: context.getActions()

    })

  },

  onUnload: function () {

    clearInterval(this.interval)

  }

})


在小米 MAX 上, android 6.0.1, 4G 内存

用小程序基础库所有版本上均做了测试,大概都是这种现象:


该页面 10 几分钟后, 在调试窗口性能数据中查看到,内存涨到近 700 M后微信直接退出!


麻烦 @胡浩 @梁天智|Albie @smoothieli @帮忙看看。


我们的程序与这个结构类似,马上要申请上线了,出现这样问题,很是无奈啊。。。


最后一次编辑于  2017-07-19
回答关注问题邀请回答
收藏

12 个回答

  • 清风一笑
    清风一笑
    09-23

    canvas动画确实有问题,我最近也遇到了,只要加了动画,瞬间内存暴涨,小程序奔溃

    09-23
    赞同
    回复
  • Albie
    Albie
    2017-07-25

    加下我微信吧~


    AlbieLeung

    2017-07-25
    赞同
    回复
  • 易水寒
    易水寒
    2017-07-24

    系统信息:


    2017-07-24
    赞同
    回复
  • 易水寒
    易水寒
    2017-07-24

    运行截图:


    2017-07-24
    赞同
    回复
  • 易水寒
    易水寒
    2017-07-24

    用这种型号的手机,在


    https://mp.weixin.qq.com/debug/wxadoc/dev/demo.html


    扫码 小程序示例 就能问题重新。


    如果你没有这种手机,麻烦给个地址,我快递给你。

    2017-07-24
    赞同
    回复
  • 易水寒
    易水寒
    2017-07-24

    我手机型号是:


    2017-07-24
    赞同
    回复
  • Albie
    Albie
    2017-07-24

    我这边重现不了你的问题,能否提供下你的微信号,和重新问题的时间点,我拉下log看看?

    2017-07-24
    赞同
    回复
  • 易水寒
    易水寒
    2017-07-23

    关掉性能面板,用 小程序示例 -> 画布 -> canvas 做测试。


    错误仍然出现。10 多分钟 小程序示例 还是退出。


    这个程序没有使用上面说的  setData 来更新页面数据,而是将下面这段代码以每  17 ms 一次的频率执行:


    function ball(x, y) {

          context.beginPath(0)

          context.arc(x, y, 5, 0, Math.PI * 2)

          context.setFillStyle('#1aad19')

          context.setStrokeStyle('rgba(1,1,1,0)')

          context.fill()

          context.stroke()

        }



    2017-07-23
    赞同
    回复
  • Special
    Special
    2017-07-23

    也许和另外一个问题有关系 https://developers.weixin.qq.com/blogdetail?action=get_post_info&docid=d8fc518be594c9102072e5d7ae16a63e&token=1559416888&lang=zh_CN


    你关掉性能面板后运行 10 分钟看下是否还会 crash?

    2017-07-23
    赞同
    回复
  • 易水寒
    易水寒
    2017-07-19

    微信 6.5.10


    UA: Chrome/53.0.2785.49 Mobile MQQBrowser/6.2 TBS/043408


    WebChatLib: 1.4.2 (2017.7.18 19:40:26)

    2017-07-19
    赞同
    回复

正在加载...