收藏
回答

css animation 带有 infinite 会导致耗电和发热极其高

问题模块 框架类型 问题类型 终端类型 微信版本 基础库版本
框架 小程序 Bug 客户端 6.7.4 2.4.1

当页面存在带循环动画(如 .some-node {animation: ani-name 2s infinite;})的 css 元素,手机(IOS 表现更为明显)会在一分钟之内快速耗电、发热(IOS 很烫手,而且每隔几秒掉 1% 的电),并且非常影响其他的交互(如 scroll-view 的在拖动时会上下调动、其他元素的动画没有中间态等)。


本人手上的 iphone 6s ios 12.1,测试人员用的 vivo、iphone 6p 等均会出现,但总体是 IOS 会更突出。



最后一次编辑于  2018-11-25  (未经腾讯允许,不得转载)
回答关注问题邀请回答
收藏

2 个回答

  • 娇华
    娇华
    2018-11-27

    你好,请提供一下出现问题的机型和微信版本,以及能复现问题的简单代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html)。

    2018-11-27
    赞同
    回复 2
    • aben
      aben
      2018-11-28

      https://developers.weixin.qq.com/s/VBINKgmh7f4z

      2018-11-28
      回复
    • 娇华
      娇华
      2018-11-29回复aben

      这边几台ios设备测试了下。没有复现说的会在一分钟之内快速耗电、发热(IOS 很烫手,而且每隔几秒掉 1% 的电)。

      也有可能是手机性能、内存等方面引起的

      2018-11-29
      回复
  • aben
    aben
    2018-12-11

    最后调试发现,infinite 的 animation 会引起快速掉电现象,全屏的 `image` 外加前面的 animation 会引起发热现象,mark 一个

    2018-12-11
    赞同
    回复 2
    • 时光不负
      时光不负
      08-13
      请问这种有全屏的‘image’加animation的情况怎么解决发热和优化图片呢 (手动谢谢)
      08-13
      回复
    • aben
      aben
      08-14回复时光不负
      用 view + background style 解决全屏 image,不过 url 要为远程地址
      08-14
      回复