PWA Plus
flutter 版的 Cordova
目的:让 WebApp 运行在所有平台,是一套完整跨平台 App 开发方案。虽然,PWA 已经解决了一些问题,比如通知,安装到主屏幕,但是暂时还不能和操作系统以及其他 APP 完美集成。PWA Plus 可以扩充 WebAPI,让 WebApp 也能使用一些只有 Native App 才有的功能。
类似 Xcode 的开发工具
特点:
- 开发者不需要接触原生平台的开发,只需要关注 Web App
好处:
- 你只需要招 Web 前端工程师
- 你也许只需要开发一款 WebApp
- 你做的任一种优化将快速的应用到所有平台
你的 App 将自动更新(App Store 不允许这样的 App)
调研:
- 国外
- PWABuilder
- 使用 Cordova 跨平台 // 不支持小程序
- 支持插件
- 支持自定义增强功能
- Cordova
- 国内
- 跨平台
- 有独立的一套增强 API
桌面端: Electron App = Nodejs API + Electron API + Web API
- File System
- 协议处理 // http url 只能在浏览器中打开
// 像 Lantern 一样直接在浏览器中显示 UI 也是可行的
移动端/小程序:原生平台代码 + WebView
- Splash Screen(使用 web manifest)
- 支付(AliPay,Weixin)
- 第三方登陆(QQ,Weixin,Weibo,Facebook)
- 分享(源/目标)(QQ,Weixin,Weibo,Facebook)
- 解决部分兼容性问题,Chrome <-> Safari(如 IOS 下的 vibrate,状态栏占位)
- 读取 SMS
- Contacts API
- File System?
- Clipboard 访问?
- GPS 定位(Web 好像是 IP 地址定位)?
- Notification?
小程序可能不能隐藏 Host App UI(?),所以小程序中的 WebApp 很可能需要重新设计
// 多分支+平台文件区分隔离处理平台间的交互差异
移动端使用已有框架调用 WebView 的问题:
- React Native 启动速度慢,Android 多实例请求的 Bug
- Flutter 虽然统一了 Android 和 IOS 代码,但是插件生态环境还不成熟
- Cordova 可靠性、稳定性不够
TODO:
- icon 设计
- pwap-cli 根据配置文件生成目标平台的代码
- JSAPI 兼容 WebAPI 的实现
- IOS Webview 根据配置文件生成 IOS 平台的代码
- Android Webview 根据配置文件生成 Android 平台的代码
- WeChat Webview 根据配置文件生成小程序平台的代码
- Best Practices 前端开发的最佳实践,一些场景场景的解决方案,对标原生端性能
- Awesome pwap 使用 pwap 的例子