小程序的鼻祖在国内就这么消亡了!(一)

简介: 互联网发展了这么久,我们记住了“Native App”、“小程序”、“快应用”、“App clips”、“Hybrid App”、“Web App”,似乎独独没有 PWA,但 PWA 及其理念却一直在推动着前端领域前进。

PWA 是什么?


似乎 PWA 对很多人来说是如此陌生,PWA 对前端开发者来说却又是无处不在。


身边的 PWA


Lighthouse


对前端开发者来说,Lighthouse 是一个很熟悉的网站性能诊断工具,在这里,我们总是可以看到 PWA(Progressive Web App)的身影:


cb9aafa2d7953bd9f6cf1b57bc58b592.png


PWA 书籍


又或者,你曾无意间看到这些书籍或者资料:


2aa3c5a92761da6634b39db148cb562e.png


  • 《PWA 应用实战》[1]


开发者相关


啊哈,这些,都没看到过?那你总是访问过Google Developers[2]吧,或者总看见过这样一个图标:


6a85290e629ff0f3270f94d0df0b7244.png


可以认为这个图标在哪里,一个 PWA 应用就在哪里,点击这个按钮,可以将 PWA 应用安装到桌面。于是,在线 IDE StackBlitz.com[3]出现了,字节内部使用的Goofy Studio PWA[4]出现了:


1e8c24c3b4f56a95bbe47a8bdb17196a.png


谷歌的探索


但是,动不动就讲开发,真的太卷了,说说那些更有意思的 PWA 应用吧。


2018 Google Chrome 开发者峰会上,Google 发布了Squoosh[5],这是一个开源的图片压缩渐进式 Web 应用(PWA),它同时也是现代 Web 技术的一个实际展示,谷歌实验室发布 Squoosh[6] 的主要目标是演示高级 web 应用程序如何利用现代技术在 web 浏览器中提供高性能的体验。


63d75d669d8468d64026b29f377fefe3.png


PROXX[7]是谷歌 Chrome 团队推出的一款 JavaScript 游戏。该项目展示了如何开发快速平滑的 Web 应用,这些应用在多种平台和输入设备上提供了相近的用户体验。Proxx 项目的独到之处在于它主要针对的是智能功能机


智能功能机是低价智能机替代设备,在印度和非洲广为使用。相对于智能机,智能功能机的硬件非常简单。它不支持触控,屏幕相对较小,大多采用 240x320 分辨率的 QVGA 屏,CPU 的处理能力也相对较弱。


80fca9ee8383272cec358bfcdec5390c.png


这是一款 JavaScript 游戏扫雷游戏,摸鱼时可以玩儿玩儿,如果不幸被老板撞见,你就说在研究 PWA 嘛


微博 Lite


微博 Lite[8],我相信,这,应该是 PWA 离你最近的一次:


1023d27f50ce2b6d87c70edf45faab4b.png


我猜你一定不会问:既然 PWA 应用还是蛮广泛的,那,它一定很强大吧?


蒽,强不强大看看数据就知道了。


强大的生产力


  • 2017 年的一篇技术博文[9]显示,堪称图片版的 Twitter 的 Pinterest 将他们的移动网站重建为 PWA,核心参与度增加了 60%,用户产生的广告收入增加了 44%,花费的时间也增加了 40%;


03e3e14d277b7da15de85cd182d4290f.png

f3a01d0d5fda51f363f5e24f26f572e2.png


  • 2016 年初 AliExpress 开始与 Google 团队合作,推动 PWA 技术在 AliExpress 上的落地;结果是非常令人惊奇和满意的。AliExpress 发现新用户的转换率增加了 104%[10]。在 Safari 的转化率也上升了 82%。现在用户每次访问的页面数量是原先的两倍,也大大提升了用户浏览页面的时间;


  • 类似这样的成功案例数不胜数,为了方便你直接丢到老板脸上,我梳理了这个图 😂:


6576eea954945ee7d259cfa7161abc06.png


我觉得你可以告诉他:这些不仅仅是数字,这些都是 PWA 的成功案例


老板说:这些和墙内的你我,距离能有多近?没事,离我们最近的 PWA 应用将在你的手上诞生。


PWA 诞生的条件


我们应该都深有体会,Native app 体验确实很好,下载到手机上之后入口也方便。但它的优缺点很明显:


edaf54d071c3560794dc425afc14902c.png


而 web 网页开发成本低,网站更新时上传最新的资源到服务器即可,用手机带的浏览器打开就可以使用。但是除了体验上比 Native app 还是差一些,还有一些明显的缺点


225c8730bb0f28a313847589e05f4aeb.png


在这些因素的推动下,Web 应用渐进式接近原生 App的概念 —— PWA 诞生了。

相关文章
|
Web App开发 人工智能 小程序
|
Web App开发 缓存 前端开发
|
1月前
|
小程序 前端开发 JavaScript
在线课堂+工具组件小程序uniapp移动端源码
在线课堂+工具组件小程序uniapp移动端源码
39 0
在线课堂+工具组件小程序uniapp移动端源码
|
2月前
|
移动开发 小程序 数据可视化
基于npm CLI脚手架的uniapp项目创建、运行与打包全攻略(微信小程序、H5、APP全覆盖)
基于npm CLI脚手架的uniapp项目创建、运行与打包全攻略(微信小程序、H5、APP全覆盖)
372 3
|
2月前
|
小程序 API
微信小程序更新提醒uniapp
在小程序开发中,版本更新至关重要。本方案利用 `uni-app` 的 `uni.getUpdateManager()` API 在启动时检测版本更新,提示用户并提供立即更新选项,自动下载更新内容,并在更新完成后重启小程序以应用新版本。适用于微信小程序,确保用户始终使用最新版本。以下是实现步骤: ### 实现步骤 1. **创建更新方法**:在 `App.vue` 中创建 `updateApp` 方法用于检查小程序是否有新版本。 2. **测试**:添加编译模式并选择成功状态进行模拟测试。
60 0
微信小程序更新提醒uniapp
|
4月前
|
小程序 前端开发 Java
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
JavaDog Chat v1.0.0 是一款基于 SpringBoot、MybatisPlus 和 uniapp 的简易聊天软件,兼容 H5、小程序和 APP,提供丰富的注释和简洁代码,适合初学者。主要功能包括登录注册、消息发送、好友管理及群组交流。
118 0
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
|
4月前
|
小程序 前端开发 JavaScript
【项目实战】SpringBoot+uniapp+uview2打造一个企业黑红名单吐槽小程序
【避坑宝】是一款企业黑红名单吐槽小程序,旨在帮助打工人群体辨别企业优劣。该平台采用SpringBoot+MybatisPlus+uniapp+uview2等技术栈构建,具备丰富的注释与简洁的代码结构,非常适合实战练习与学习。通过小程序搜索“避坑宝”即可体验。
122 0
【项目实战】SpringBoot+uniapp+uview2打造一个企业黑红名单吐槽小程序
|
4月前
|
存储 小程序 JavaScript
|
5月前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的汉服交易小程序的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的汉服交易小程序的详细设计和实现(源码+lw+部署文档+讲解等)
79 7

热门文章

最新文章