写点什么

Progressive Web App:模仿原生应用的 Web 应用

  • 2015-11-27
  • 本文字数:1195 字

    阅读完需:约 4 分钟

Progressive Web App 的外观和行为都同原生移动应用类似,但它本质上上仍然是Web 应用,不需要通过应用商店部署。

Ashteya Biharisingh 是一名混合移动应用开发人员。据她介绍

[Progressive Web App] 是一个具有响应式布局的 Web 应用,可以离线工作,并能够安装到设备的主屏幕上。这里所说的“安装”是指:在主屏幕上添加该 Web 应用的快捷方式。当用户点击快捷方式时,Web 应用会加载到浏览器,并以全屏模式打开。

Progressive Web App 有许多好处。对用户而言,他们无需在设备上安装应用。与原生 / 混合应用相比,这大大节省了设备的存储空间。对开发人员而言,他们无需通过应用商店发布应用,版本发布和 Bug 修复可以更及时。

近日,印度最大的网上商店之一 FlipKart 推出了一个 Progressive Web App:FlipKart Lite。Android 用户通过浏览器打开该网站时会看到一条“添加到主屏幕”的消息。下次,当用户使用该 Web 应用时,只要点击主屏幕上的图标,它就会以全屏模式打开,就像一个原生应用。目前,作为一个 Progressive Web App,FlipKart Lite 仅支持 Android 设备。如果用户在 iOS 设备上访问该网站,会被重定向到应用商店。这是因为 FlipKart Lite 使用 Service Worker 实现了离线功能,而后者仅在 Chrome 和 Opera 上得到了支持。关于FlipKart 的更多信息,可以查看这篇博文或者这段来自2015 Chrome 开发者峰会的视频

重要通知:接下来InfoQ 将会选择性地将部分优秀内容首发在微信公众号中,欢迎关注InfoQ 微信公众号第一时间阅读精品内容。

Bruce Lawson 是一名来自 Opera 的工程师。据他介绍,Opera 和Chrome 正紧密合作,探索Progressive Web App 的最佳实现,但他们的实现之间还是有一些差别。在Bruce 看来,为了便于此类应用的推广,应该有一种机制可以在用户第一次访问网站时作出提醒,该网站是一个Progressive Web App,而不是在第二次访问时才提醒用户“安装我们的应用”

Nolan Lawson 是 Progressive Web App Pokedex.org 的创建者。对于 FlipKart Lite 的出现,他写到

这个应用让我超级兴奋,因为它向我们展示了,仅仅使用 Web 技术就可以构建一个离线的、60FPS 的移动应用。

Bruce 认为,Progressive Web App 已经准备好迎接它的黄金时代。微软正考虑在其浏览器中添加 Service Worker支持。而且,他们还遵循 W3C Maifest 创建了 manifold.js ,使开发人员可以开发跨平台和设备的托管应用。iOS 也提供了一种创建“可主屏化(homescreen-able)”应用的方式。

感兴趣的读者可以进一步查阅Bruce 提供的其他一些相关资源,如 Web Manifest 说明 Service Worker 手册等。


感谢徐川对本文的审校。

给InfoQ 中文站投稿或者参与内容翻译工作,请邮件至 editors@cn.infoq.com 。也欢迎大家通过新浪微博( @InfoQ @丁晓昀),微信(微信号: InfoQChina )关注我们,并与我们的编辑和其他读者朋友交流(欢迎加入 InfoQ 读者交流群InfoQ 好读者(已满),InfoQ 读者交流群(#2)InfoQ 好读者)。

2015-11-27 18:008946
用户头像

发布了 1008 篇内容, 共 402.8 次阅读, 收获喜欢 345 次。

关注

评论

发布
暂无评论
发现更多内容

Redis之主从复制详述,看完这篇文章不再稀里糊涂

李子捌

redis 主从复制 签约计划第二季

Redis值Sentinel(哨兵)详述,图文并茂才能浅显易懂

李子捌

redis redis sentinel 签约计划第二季

“退微信群”谣言背后:总有人用阴谋论湮没常识

脑极体

掌握这些核心算法,拿不到10个offer你来找我,我锤你个不争气的

热爱java的分享家

Java 架构 程序人生 编程语言 经验分享

Flutter 中的一切都是一个小部件【Flutter专题5】

坚果

flutter 签约计划第二季

金三银四面试必备,“全新”突击真题宝典,阿里腾讯字节都稳了

Geek_1df311

Java 程序员 架构 面试

Redis的LRU(Least Recently Used)算法你了解多少?

李子捌

redis 签约计划第二季

比较 Flutter 日期选择器库【Flutter专题6】

坚果

flutter 签约计划第二季

Redis集群模式,你若还是一知半解,试试仔细阅读一遍这篇文章

李子捌

redis redis cluster 签约计划第二季

ES6, Angular, React 和 ABAP 中的 String Template(字符串模板)

汪子熙

JavaScript angular React abap 11月日更

都在用MQ,Redis的Pub/Sub也可以试着了解下

李子捌

redis MQ 签约计划第二季

模块六作业

bob

「架构实战营」

面试官:GET能上传图片吗?

喵叔

11月日更

巧用代理设计模式(Proxy Design Pattern)改善前端图片加载体验

汪子熙

设计模式 web开发 代理模式 Proxy 11月日更

在Flutter中构建图像选择器【Flutter专题9】

坚果

flutter 签约计划第二季

分布式系统的全局快照

ElvinYang

分布式系统 一致性 全局快照 Chandy-Lamport Flink ABS

linux双向重定向之tee命令

入门小站

Linux

Go语言学习查缺补漏ing Day9

Regan Yue

Go 语言 11月日更

大专毕业的我狂刷29天“阿里内部面试笔记”最终直接斩获十七个Offer

热爱java的分享家

Java 面试 程序人生 编程语言 经验分享

阿里内部“SpringCloudAlibaba学习笔记”强势来袭,开创微服务的新时代

Geek_1df311

Java 编程 架构 微服务

Flutter 状态管理概述【Flutter 专题 7】

坚果

flutter 签约计划第二季

新能源汽车发展的三种路线及差别

石云升

学习笔记 新能源汽车 11月日更

Redis分布式锁就应该这样学,精细胞与卵细胞的故事告诉你真实原理!

李子捌

redis 分布式锁 签约计划第二季

LRU经常被吐槽,要不试试LFU?本文详述LFU(Least Frequently Used)

李子捌

redis 签约计划第二季

GitHub标星139K的:“嵌入式Linux系统开发教程”

热爱java的分享家

Java 架构 程序人生 编程语言 经验分享

DDD与CQRS的关系

Bruce Talk

领域驱动设计 DDD

Flutter在各平台的安装与配置(Windows,macos,linux)【Flutter 专题 0】

坚果

flutter 签约计划第二季

比特币的账户模型

Rayjun

比特币 区块链

owasp zap 暴力破解测试

喀拉峻

网络安全 安全 信息安全

27 K8S之服务发现

穿过生命散发芬芳

k8s 11月日更

Flutter 状态管理Provider快速指南【Flutter 专题 8】

坚果

flutter 签约计划第二季

Progressive Web App:模仿原生应用的Web应用_移动_谢丽_InfoQ精选文章