2021-11-09-⛵︎数据到图像 （2）浏览器渲染

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简介