PWA 这个词已经出现很久了,如果读者做嵌入式开发应该不会很了解,如果是做服务端和前端或多或少了解,最近在聊这方面的话题发现还是有一些人不知道这个 PWA 是什么技术?PWA 是 Progressive Web Apps 的缩写,中文翻译为渐进式网络应用,早在 2014 年,W3C 就公布过 Service Worker 的相关草案。
Service Worker 可以不干扰视图渲染层线程,运行独立于 Web 站点只请求原始数据,而不涉及任何样式或布局信息,但是其在生产环境被 Chrome 支持是在 2015 年,由 Google 工程师 Alex Russell 和 Frances Berriman 共同提出,在他们的一篇文章Progressive Web Apps: Escaping Tabs Without Losing Our Soul 的博文中详细阐述了 PWA 的概念和优势,PWA 旨在将 Web 应用程序与本地应用程序的最佳特性结合起来,提供一种更好的用户体验,包括快速加载、离线访问和与设备功能的集成。
PWA 优点是不需要从应用商店进行安装,而是通过网址 URL 来进行访问,简单的来说就是不用下载,用一个 URL 就能直接打开,将一个传统的网页可以渐进式地变成和本地原生 App 一样来使用,比如被添加到主屏幕、全屏方式运行、离线工作、推送通知消息等,这个和目前腾讯的微信小程序类似的。微信小程序确定是被腾讯锁死在微信里面,只能通过微信的小程序商店和微信内搜索得到,但 PWA 你应用可以被搜索引擎直接搜索得到,搜索引擎就为应用到入口,这和各手机厂商的应用商店是有着明显的差异的。
小程序和 PWA 这种应用开发模式出现比较晚,因为首次打开这种应用需要从服务器端下载各种资源文件,在 2015 年时候如果读者有使用过手机都清楚那个时候大部分还是 3G 和 4G 的时代,部分地区 WIFI 也不是全面的覆盖,这就会带来一个新问题,如果全部采用 Web App 的方式进行开发应用,每次都需要加载。而采用传统的原生方式开发者只需要把应用上传到应用商店,用户去应用商店下载得到一个固定资源的 App 安装到手机上即可,最后动态数据从服务器端通过 HTTP 协议进行交互,减少一部分常用资源的加载过程,但是放到今天 5G 已经慢慢普及,网速越来越快,用户手机几乎不会切断流量或者 WIFI 连接的,所以个人感觉 PWA 更适合现在的应用开发模式。
在介绍原生应用之前,我想我有必要介绍一下什么 Web2.0 结构互联网,Web2.0 也不仅仅限制于在浏览器交互数据上,有了 HTTP 协议和移动互联网,更多是指基于 Web2.0 异步数据交换方式。Web1.0 是互联网的早期阶段人们上网的方式是查看一些固定死的静态网页内容,网站维护者每更新一次网站就需要重新发布一个新的网页版本,而且缺乏和用户互动性。
Web2.0 是互联网的现代阶段,大约从 2004 年开始至今,在 Web2.0 时代,互联网变得更加互动和社交,用户可以更积极地参与和贡献内容,用户可以把自己的数据通过 HTTP 协议发送到远端服务器上存储,其他用户可以查看,用户之间可以互动,鼓励用户生成内容用户可以创建、编辑和共享各种形式的内容,如博客、社交媒体帖子、视频、评论等。此后移动互联网来了,更多开发者从事开发移动端 App ,而这些 App 和服务器端数据交换大部分也是采用的 HTTP 协议,不管你是使用 Java 还是 Kotlin 还是现在推荐的 Dart 和 Flutter 开发 App,乃至是 Swift 和 SwiftUI 这种,都是属于视图层的开发,最终数据还是存储在远端服务器之上。
聊到性能问题,这个就遇到我熟悉的领域了,如果大家都稍微做过一点应用端开发或者前端开发的,都会明白浏览器是一个不可或缺的基础软件,或者你是写 Java ,那么 Java 也是离不开 JVM 运行时支持的,如果你是一个大牛读到这里你应该明白我要说什么了。对的没错,这些技术栈的特点就是需要运行时或者执行引擎的支持。
浏览器中执行引擎和 JVM 设计有类似之处,都属于编程语言虚拟机范畴了,Chrome 中用的是 V8 ,而 Dart 语言也是虚拟机语言也有自己的虚拟机,Kotlin 也是一样的,Koltin 官方乃至都可以通过 K2 编译器将代码编译为 js ,放到浏览器上运行,这些的背后都依靠着虚拟机和执行引擎;例如我比较推崇的 GraalVM 项目,它的应用还是在 Serverless 领域,这个后面我也会把它和 PWA 联系起来,因为 PWA 需要后端支持,例如现在大部分云厂商推荐的 Function as a Service 方式来编写服务程序降低成本。
如果最近注意到目前开发者工具 IDE 动态话,与昨天大陆地区 App 需要备案法颁发的同时,8月 8 日 Google 也推出他们新项目 Project IDX 一个基于 AI 的浏览器开发环境,集成 AI 支持全栈编程语言,跨平台真机预览一键部署,真的云端开发模式,IDX 和 PWA 有什么关系吗?看似表面是没有关系的,但是在我看来背后实质上背后在推动 PWA 这种开发模式,Project IDX 工作空间都具有基于 Linux 的虚拟机的全部功能,配合云中托管的通用访问权限,从 GitHub 导入现有项目,让你继续之前的进度。
还可以创建新项目,预先包含流行框架的模板,包括 Angular、Flutter、Next.js、React、Svelte、Vue 和如 JavaScript、Dart 、 Java 等语言,在最后,将应用推向生产方面的一个常见痛点是部署它,通过集成 Firebase Hosting,通过几次点击就可以部署你的 Web 应用的可共享预览,或通过快速、安全和全球托管平台部署到生产环境。这里的存储空间和函数服务全部都是在 GCP 上的,个人感觉最终目的就是要把程序代码和数据锁定在 GCP 上,开发运维和应用数据都在 GCP 上完成,强依赖关系按照这个项目想法。