针对小程序性能的优化建议,官方开发者们都来看一下!
发布于 5 年前 作者 yongcai 9103 次浏览 来自 问答

最近碰到一个__大数据大列表__渲染的性能问题,然后对微信小程序进行了一些学习研究,然后发现在其内部的 WebView 中部分代码的性能有比较严重的问题,希望小程序官方们再调研和研究一下,不要拼命做 feature ,性能不好怎么干得过 H5 呀。。。

下面举个简单的小例子:


真机上打开小程序,然后进行对比性能,发现如图:



然后顺藤摸瓜,发现了这一行的代码占用时间异常多




开发者肯定已经想到了,这个方法会被大量使用,所以用了位运算,做了优化。


但是,并不是位运算都一定快啊!


于是我抱着学习的态度,写了个简单的case,进行了一下小小的性能测试:  https://jsperf.com/hn-test


仅仅改动了


any |= x === '__value__';


这一行与位运算相关的代码,分别如下:




明显可以看到,仅仅改了一行代码,性能将近快了一倍啊,在我这个大数据大列表案例下,整个渲染时间就可以缩短 5s 😂😂😂


由于没开发小程序底层,也不知道我的建议对不对,但谁又知道不对呢,所以我在论坛提出来。


希望相关的官方开发者能看到我们开发者做的努力,然后不要忘了做一些相关的代码检查和更多性能优化。

5 回复

性能优化,利国利民!

非常感谢回复和相关的探讨!

我还是认为在此处的位操作不是最优的,我在您的基础上加了个 https://jsperf.com/hntest-special/2 测试 case。

此处的位或操作结果是 int ,直接判断全等的结果是 boolean ,在后面 return 时候的表达式中的意义是一样的,int 还额外经过了一次类型转化。

不知道其他细节,若有遗漏或错误,还烦请指出,感谢!

多谢反馈,很有用的建议!

不过我们仔细分析了下,这个性能差异,应该是 hasOwnProperty 的调用导致,在去掉 hasOwnProperty 调用后,性能确实是原来两倍;至于楼主提供的 2 倍的方案,实际上是由于 any 为 false 导致之后的 hasOwnProperty 不执行所带来的性能提升。

https://jsperf.com/hntest-special

我们会修复这个性能问题,欢迎继续交流!

回到顶部