客户端容器笔记 | 青训营笔记

48 阅读2分钟

客户端容器笔记

浏览器架构

架构演进

1.jpg 莫名联想刚了解到的微服务,感觉各种各样的东西都在从单一运行走向多线运行,为了效率、可维护性等等。这年头还有什么是单一运行的吗?

各架构对比

2.jpg

多进程分工

3.jpg

“为什么会有单进程架构?
面向服务架构是否会替代多进程架构?”

受硬件所限制,占用系统资源较少。时代之泪
也许会,本身就是对标升级版,而且能适应不同环境性能,对优秀机器提供更好选择。

渲染进程

常见浏览器内核

4.jpg 内核: 浏览器最核心的部分,其渲染引擎。决定了浏览器如何解释网页编写语法。难怪部分时候会要求使用指定浏览器。...虽然还是很像广告。

多线程架构

5.jpg

JS引擎与渲染引擎

6.jpg

多线程工作流程

7.jpg

Chrome运行原理

如何展示网页

8.jpg 输入处理->query/url->输入发送给搜索引擎/请求站点资源
那站点能接受query吗?搜索引擎又跟站点有什么不同?它是否会是一个站点,揣着一个超大数据库?
丢,去查了查,还真是,这数据库使用也太猛了吧

网络线程(准备数据)->渲染线程(转化)
浏览器不理解CSS...这里的浏览器具体指什么?内核部分?CSS是比较新的技术吗?有能够直接识别的吗?这是类似于高级语言和机器语言的差别感觉?

首屏优化

9、.jpg

渲染优化

看来领域之间共通之处还挺多的,这缓存策略联想到计网概论讲到的站点了。

10.jpg 离屏渲染和懒加载也是感觉在其他地方也见到过的思想了,能不能整个自定义加载哪部分?反正都已经开始分离渲染了。...有点偏离开发该有的想法了也许,这算是“逃课”了。

JS优化

11.jpg

跨端容器

为什么需要跨端

12.jpg

WebView

用于加载网页Url并展示内容的控件
优点: 学习成本低; 不需要安装包,发布即可更新 ; 移动设备性能不断提升,支撑得起webview; 通过JSBrideg和原生系统交互,实现复杂功能。
简就是棒!

13.jpg

跨端方案对比

15.jpg