浏览器架构 主要架构模式介绍： 单进程架构：所有模块运行在同一个进程里，包含网络、插件、JavaScript运行环境等 多进程架构：主进程、网络进程、渲染进程、GPU进程、插件进程 面向服务架构：算是多进程架构的升级版。将原来的UI、数据库、文件、设备、网络等，作为一个独立的基础网络服务
为什么会有单进程架构？
早期受到硬件限制，为了节约资源。
面向服务架构是否会替代多进程架构？
有可能会被替代。
渲染进程
主要包含以下线程：
主线程（Main thread）(下载资源、执行js、计算样式、进行布局、绘制合成)
光栅线程（Raster thread）
合成线程（Compositor thread）
工作线程（Worker thread）
多线程工作流程
网络线程负责加载网页资源
JS引擎解析JS脚本并执行
JS解析引擎空闲时，渲染进程立即工作
用户交互、定时器操作等产生回调函数放入任务队列中
事件线程进行事件循环，将队列里的任务 取出交给JS引擎执行
为什么需要跨端
开发成本、效率
有哪些跨端方案
webview、小程序 RN 、Weex Lynx Flutter webview Webview，即网页视图，用于加载网页Url,并展示其内容的控件。
可以内嵌在移动端App内，实现前端混合开发，大多数混合框架都是基于Webview的二次开发：比如lonic、Cordova、uniapp。
优点：一次开发，处处使用，学习成本低 ，随时发布，即时更新，不用下载安装包， 移动设备性能不断提升，性能有保障 ，通过JSBridge和原生系统交互，实现复杂功能 Javascript调用Native：
API注入: Native获取Javascript环境上下文，对其挂载的对象或者方法进行拦截
使用Webview URL Scheme跳转拦截
IOS上window.webkit.messageHandler直接通信
Native调用Javascript：
直接通过webview暴露的API执行JS代码
Android方法：webview.evaluateJavascript
IOS方法：webview.stringByEvaluatingJavaScriptFromString
Webview 和 Native通信：
JS环境中提供通信的JSBridge
Native端提供SDK响应JSBridge发出的调用
前端和客户端分别实现对应功能模块
小程序
常见小程序：微信小程序、支付宝小程序、百度小程序、小米直达号
小程序架构：
渲染层-webview
双线程，多webview架构
数据通信，Native转发
React Native / Weex
原生组件渲染
React / Vue 框架
virtual dom
JSBridge
在安卓和IOS中展示是不一样的，因为底层还是调用的安卓或IOS的底层组件。
Lynx： 字节自研的一款跨端框架。（暂未开源，字节旗下使用较多）
Vue
JS Core / V8
JSBinding
Native UI / Skia
Flutter
wideget
dart vm
skia图形库
