chrome渲染图像过程

过程:
-
普通HTML ➡ dom ➡ skia
-webGl ➡ OpenGL
问题:chrome怎么跨平台
chrome 在安卓,iOS,Mac,windows,linux都有安装包,chrome作为浏览器怎么做到兼容问题的呢。
解决方案:skia
Skia Graphics Library(SGL)是一个由C++编写的开放源代码图形库
Skia主要的类别是SkCanvas,所有的绘图功能都是实现于此类别。以下是SGL简单的代码:
SkCanvas* can = GraphicsJNI::getNativeCanvas(...);
SkPaint paint;
paint.setARGB(255, 0, 0, 255);
can->drawText("Hello, world", 12, 10, 10, paint);
计算机如何处理浏览器数据

从理论上,我可以用上图的这种键盘按照一定的编码敲出一长串0、1数字序列,再加一个jpg/png的后缀名保存。
打开文件时,是将这些数据送入内存,图片查看程序控制CPU,根据后缀名对数据进行解码、解压后得到图像本身的数据——每个像素的RGB等。
再历经前面所述的一大串过程,CPU的数据再经过显卡和显示器,最终我就能看到一张滑稽的照片

计算机怎么绘制系统UI的
windows图像绘制
操作系统有一套 GUI API ,提供给开发者调用
电脑不同应用,使用不同绘制模型,比如windows10 系统,同时运行 画布,有道云笔记,魔兽世界3D游戏

渲染过程:
application ➡ OpenGl(Direct) ➡ display driver ➡ screen
安卓系统图像绘制

一步一步解码 PNG 图片
《编码,隐藏在计算机软硬件背后的语言》
猴子也能看懂的渲染管线(Render Pipeline)
GPU 观察
一颗像素的诞生
Life of a pixe
skia简介
网友评论