标签：显存 10 Canvas WebGL 8MB 内存 占用

随笔～ 分析一下两者的内存使用。

按2048为基准，进行相关测试，现在移动设备基本都达到这个分辨率。

<canvas id="canvas" height="2048" width="2048"></canvas>

Canvas模式

如果是纯使用Canvas渲染，不涉及到WebGL,内存占用还是比较好计算的。

假设图片也是512大小，图片占用5125124= 1M。

Canvas宽高是2048，占用2048 * 2048 * 4 = 8MB 。

JavaScript堆栈占用看创建对象的情况而定，这里忽略不计。

最终整体的内存占用为9MB+。

WebGL模式

由于WebGL有中间层，本身的处理程序大小就占用4-10MB。

WebGL内存占用很大一部分是有浏览器决定，一般计算方式：

WebGL有抗锯齿（antialiased）设置，一般是2-16的范围，可以指定但最终还是有浏览器根据环境指定。下方以10为例：

渲染区（8MB * 10） + 副本缓存区（8MB * 10） + 图片（1MB）

Canvas(8MB) + （ GPU渲染区8MB）+ GPU缓存区（8MB * 10） + GPU处理堆栈(4-10MB) + JS堆栈 = 100MB以上。

常规情况下WebGL内存使用率是Canvas是10倍。 能力越大，消耗越大。 其实不需要太关注WebGL对内存的使用，在一般的低端模式下，会根据内存调节缓存区大小～

具体的数据就不贴了～ 自己记录一下～

标签：显存,10,Canvas,WebGL,8MB,内存,占用
来源： https://www.cnblogs.com/yangxiao/p/14704485.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。