美文网首页
2021-11-09-⛵︎数据到图像 (2)浏览器渲染

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

作者: 沐深 | 来源:发表于2021-11-08 16:52 被阅读0次

    chrome渲染图像过程


    过程:

    • 普通HTMLdomskia
      -webGlOpenGL

    问题: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简介

    相关文章

      网友评论

          本文标题:2021-11-09-⛵︎数据到图像 (2)浏览器渲染

          本文链接:https://www.haomeiwen.com/subject/extpzltx.html