100*100的 canvas 占多少内存?

栏目: Html5 · 发布时间: 7年前

内容简介:100*100的 canvas 占多少内存?在三年前端,面试思考 中提到了一个题目,非常有新意,这里分享一下当时面试的思考过程。其实真正的答案是多少我并不清楚,面试过程中面试官也不期待一个准确的答案,而是看你的思考过程。

100*100的 canvas 占多少内存?

在三年前端,面试思考 中提到了一个题目,非常有新意,这里分享一下当时面试的思考过程。

解题思路

其实真正的答案是多少我并不清楚,面试过程中面试官也不期待一个准确的答案,而是看你的思考过程。

如果了解过 Canvas 且做过滤镜相关的工作,可能调用过 imageData = ctx.getImageData(sx, sy, sw, sh); 这个 API。我记得这个 API 返回的是一个 ImageData 数组,包含了 sx, sy, sw, sh 表示的矩形的像素数据。

而且这个数组是 Uint8 类型的,且四位表示一个像素。

我在面试的时候只能想起来这些信息。猜想一下,我们在定义颜色的时候就是使用 rgba(r,g,b,a) 四个维度来表示,而且每个像素值就是用十六位 00-ff 表示,即每个维度的范围是 0~255,即 2^8 位,即 1 byte, 也就是 Uint8 能表示的范围。

所以 100 * 100 canvas 占的内存是 100 * 100 * 4 bytes = 40,000 bytes。


以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

任性

任性

电子工业出版社 / 2015-10-1 / 49.00

《任性:互联网语言表达的调性和技巧》是一本深度介绍互联网调性的书,也是从社会化媒体运作的角度较为系统地讲解互联网语言表达的书,它以独特的视角,从技术、需求和表现形式三种驱动力展开,从理论、策略、方法、技巧、实践等角度详细解析了互联网表达的变化和社会媒体的运营。《任性:互联网语言表达的调性和技巧》适合互联网从业人员阅读。一起来看看 《任性》 这本书的介绍吧!

JS 压缩/解压工具
JS 压缩/解压工具

在线压缩/解压 JS 代码

html转js在线工具
html转js在线工具

html转js在线工具

RGB CMYK 转换工具
RGB CMYK 转换工具

RGB CMYK 互转工具