;

达人】提问: 苹果 ios plus手机中案例不断重刷(闪退)要怎么办

有时候是一打开就reload,有时候是到第3页,预加载怎么设也没有用。


2 个回答

小圈圈

image.png

现在版本可以发布作品的时候对作品进行完美优化、超强优化和不进行优化,用户也可以根据具体情况进行个别图片的优化(推荐网站:https://tinypng.com/ 

另外案例加载速度优化请参考:http://help.ih5.cn/question/387.html

may

苹果plus手机reload,是因为显存溢出,由于plus手机本身的分辨率比较高,所以一个H5所占用的显存相对其他手机也会比较高,同时,在新版中,由于我们默认打开了动画加速,所以会相对旧版更加占用显存,如果处理不当,就会造成plus手机的不断reload


解决方法:


1、尽量不要在同一个页面中,放太多的大图(多个页面不影响),主要,所谓的大图,是指图片在屏幕上的尺寸,比如,一张图片是640*1040尺寸,占满了全屏,但其实其中只有一小块地方是有图的,其他地方都是透明的,这个图片依然会被当成全屏的图片来处理并占用显存,因此,我们建议大家尽量避免使用这种尺寸很大但实际显示部分很小的图,尽量剪裁后再使用;


举两个例子:


image.png

以上这个图,只有中间很小的内容,但实际大小确是全屏的,如果这样的图一多,就会造成闪退,因为手机在计算显存的时候,会把整个透明的大区域都计算进行;


image.png


上图,看起来没有问题,但是其实际大小是11883*2480像素,这个图实际上是一个logo,在案例里面只有不到200px的宽,但是由于其素材如此巨大,会占用非常多的显存。


另外,在画布中的webgl模式,部分手机支持的最大的图的尺寸是4096*4096像素,因此,强烈建议大家在准备素材的时候好好检查。


当发现闪退现象,可以通过控制台的network,来逐一查看素材大小,对特别大的素材单个检查:


image.png

比如,以上例子中,我们发现一个图片的大小是1.1M,这个就是一个可疑的图片,可以检查一下,一般可以用tinypng.com 这个网站来压缩一下,大多数全屏的图片,可以压缩到300K以下;

这里,再录一个视频补充一下怎样使用控制台工具来查看资源大小:


2、尽量用图片序列代替gif,因为图片序列我们是专门处理过,每次只会占用一张图片的显存,而gif是系统自动处理的,会占用更多的显存;


3、使用画布(canvas),把原来放在舞台或页面上元素放到canvas里,因为画布使用了硬件设备的webgl加速,其中内部元素所占用的显存会明显小于外部元素;(注意,画布中,部分手机支持的最大图片尺寸是4196*4196px,如果不得不使用非常大的图片,可以将图片切片);


4、使用3D世界来代替全景容器,来制作一些图片非常多的一镜到底或全景效果,因为3D世界的原理和画布类似,也是使用了webgl硬件加速,对显存的消耗会比全景容器更低;


5、如果以上四种方法都无法解决问题,那我们可以关掉舞台的“动画加速”属性,这个属性关掉之后,显存的消耗会明显降低,但动画在安卓手机上播放的流畅程度,可能会受到一些影响。

这里,补充一个动画加速和画布来解决iphone plus手机图片显示的案例教学:


学习地图