目录
H5
介绍
通过webView加载h5页面
它的好处是技术栈成熟，社区资源丰富。动态化较好
缺点是复杂界面和动画体验不佳，系统能力不足，需要借助jsbridge
加载前拦截是否允许跳转 - 开始加载 - 重定向 - 收到响应头，可以拦截 - 内容返回 - 加载完成/失败
主要内容
Webview的内核是webkit，webkit有两个核心WebCore和JSCore
WebCore会解析html和css生成渲染树，呈现最终的web界面
JSCore提供JS环境，执行JS代码
iOS系统提供了JSCore相关的类，另外Webview中也内置了JSCore，核心概念有jsvm、jscontext、jsvalue、jsexport
jscontext提供了js的执行环境，我们可以从中读取内容，比如wkwebview.evaluatejs方法可以执行js代码。另外wkwebview.addscripthandle也可以向js环境中注册方法，让js调用
三方库
webviewjavascriptBridge，通过iframe加载url，原生端进行拦截url 进行的通讯
有哪些应用
获取UA/设置UA
webView.evaluateJavaScript("navigator.userAgent") { (result, error) in
if let userAgent = result as? String {
print("Default User-Agent: \(userAgent)")
}
}
webView.customUserAgent = "Your Custom User Agent"
监听进度条
[weView addObserver:self forKeyPath:@"estimatedProgress" options:NSKeyValueObservingOptionNew context:nil];
拦截url
邮件附件无法预览，需要下载后分享到其它APP
注入js实现图片长按保存
注入 监听touchstart 和 touchend 的代码，当时间大于1s的时候，判断当前标签是否是ima，
如果是通过jsbridge将它的src信息发送给原生,原生拿到url进行图片下载并保存
Weex
主要内容
原理是javascript+原生渲染
weex代码最终会编译成js代码，通过原生端的js引擎运行，然后映射成原生控件，达到跨平台的目的
好处
原生渲染比h5性能好，支持动态化
坏处
不同平台的控件需要单独维护，系统更新时可能滞后
不同平台的控件风格不统一
因为渲染需要和原生通讯，有些场景如拖动时因为通讯频繁可能产生卡顿
Flutter
介绍
自会引擎
用dart代码书写UI，编译成平台代码，flutter引擎运行编译后的代码并使用skia引擎自绘制和渲染，skia会调用系统自身的api绘制
主要内容
FlutterViewController 是一个 iOS 原生的视图控制器，绑定了 Flutter 引擎的实例。
并且FlutterViewController.view.layer为渲染好的Flutter UI提供入口点（CAMetalLayer 的 FrameBuffer，这就是帧缓冲区）。
好处
性能与原生接近，不同平台UI显示统一，不需要维护控件
坏处
动态化能力不足
行者常至，为者常成！