canvas画图机能优化

2024年5月27日 179次阅读 来源: 别天

canvas机能优化的几个点

测试的几个点：

1、遍历图象数据；
2、对照drawImage()与putImageData()的画图效力；
3、运用drawImage()来绘制canvas，而非一般图象
4、在运用drawImage()画图时缩放图象；

测试神器：http://jsperf.com/

对照drawImage(HTMLImage)、putImageData(HTMLCanvas)与putImageData()的画图效力

drawImage()比putImageData要快一些，而且drawImage()能够把某个canvas绘制到另一个canvas上，绘制速率与绘制图象差不多；

遍历图象数据

·避在轮回体内直接接见对象属性，应当将其存放在局部变量中；
·用轮回计数器来遍历完全像素，而非像素重量；
·逆向遍历与移位的结果不好；
·频仍挪用getImageData()很斲丧机能；
关于<用轮回计数器来遍历完全像素，而非像素重量>,这个有点新鲜，用4为基准腾跃反而比悉数轮回要慢，事实如此？But why？

    原文作者：别天
    原文地址: https://segmentfault.com/a/1190000004076185
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞