客户端容器
浏览器框架
浏览器架构对比
多进程分工
单进程架构：节约资源，受到早期硬件内存影响
面向服务架构可能会替代多进程架构
渲染进程
常见浏览器内核
chorme运行原理
浏览器地址输入URL后会发生什么
输入处理
判断输入的是url还是query查询，如果是URl，直接请求站点发送资源；如果是query，将输入发送给搜索引擎
开始导航
用户按下回车后，UI线程通知网络线程发起一个网络请求，来获取站点信息，请求过程，tab处于loading状态
读取响应
- 网络线程接收到http响应后，先检查响应头的媒体类型（MIME Type）
- 如果响应主体是一个HTML文件。浏览器将内容交给渲染进程处理
- 如果拿到的是其他类型的文件，如zip、exe等，交给下载管理器处理
寻找渲染进程
- 网络线程做完检查后，会告知主进程数据已准备完毕，主进程确认后为这个站点寻找一个渲染进程
- 主进程通过IPC消息告知渲染进程去处理本次导航
- 渲染进程开始接受数据并告知主进程自己已开始处理进程，导航结束，进入文档加载阶段
资源加载
页面布局
页面绘制
首屏优化
- 压缩、分包、删除无用代码
- 静态资源分离
- js脚本非阻塞加载
- 缓存策略
- SSR
- 预置loading、骨架屏
渲染优化
- GPU加速
- 减少回流，重绘
- 离屏渲染
- 懒加载
js优化
- 防止内存泄漏
- 循环尽早break
- 合理使用闭包
- 减少DOM访问
- 防抖，节流
- Web Workers
跨端容器
跨端，开发成本低，效率高，一致性体验强，前端开发生态好
WebvView
网页视图，用于加载网页url，展示内容的控件 内嵌在移动短的APP内，实现前端混合开发，大多数混和框架都是基于WebView的二次开发 优势：
- 一次开发，处处使用，学习成本低
- 随时发布，即时更新，不用下载安装包
- 移动设备性能不断提高，性能有保障
- 通过JSBridge和原生系统交互，实现复杂的功能
总结
标题：客户端容器 - 掘金
