“AI 技术+人才”如何成为企业增长新引擎?戳此了解>>> 了解详情
写点什么

Angular 移动工具集要让 Web 应用有原生的感觉

  • 2016-05-12
  • 本文字数:1048 字

    阅读完需:约 3 分钟

决定为哪个平台构建应用一直是个挑战。开发人员应该把时间和金钱花在原生实现上,还是完全专注于 Web,或者是某种组合?新增加的 Angular 移动工具集(AMT)使用新的 Web 平台 API 让 Web 应用有了更多原生的感觉,希望可以为做这种决定的人减轻一点压力。

在 ng-conf 2016 大会上,Jeff Cross 和 Alex Rickabaugh 花时间介绍了 AMT 以及它如何帮助开发人员让 Web 应用的行为更像原生应用。Cross 做了总结:

“Progressive Web Apps”是以一些已经在某些 Web 浏览器中实现了的新兴 Web 标准为基础的最佳实践和技术。对于一些普通的 Web 应用,你使用新的平台 API 添加新的功能,让它们更加强大。它们可以在任何平台上工作,但最好是工作在它们可以更多地利用新的技术和 API 的平台上。

这些技术的主要目标是让应用可以立即加载、离线工作、可安装,并提供通知功能。通常,原生应用默认就具备这些特性,但在 Web 上实现这些特性并不容易。在这四个特性中,Cross 和 Rickabaugh 重点介绍了前三个以及对应每一个特性的技术:

  • App Shell(立即加载)
  • Service Worker(离线)
  • Web App Manifest(可安装)

Cross 说,App Shell 是指“包含动态内容的静态 UI,通常由一个工具栏和某种导航……供所有应用程序视图使用的东西。”在离线编译过程中,AMT 部分地依赖 Angular Universal 生成静态内容。

原生应用的其中一个好处是,一旦安装,即使没有网络,也总是可以保证最低限度的使用。AMT 依赖 Service Worker 在后台下载应用代码,因此,应用可以脱机工作。一个意外的结果是,在后续加载时,应用的启动速度更快,因为它已经有了代码,省去了网络和下载调用。

使用 App Shell 和 Service Worker 可以将首次同示例应用交互的时间从 2356 毫秒减少到 128 毫秒。

最后,Rickabaugh 说, Web App Manifest 是“一个标准,允许你指定应用程序的元数据。”其用途是允许将 Web 应用“安装”在设备上。运行这些应用中的任何一个,其外观和感觉都跟原生应用一样,因为浏览器边框可以隐藏。

最大的问题是有关 progressive web apps 的这三项技术中有两项在 Safari 或 Edge 浏览器中无效。

App Shell 之所以有效是因为它在应用加载前会渲染成 HTML 传给客户端。Service Worker 是一项尚处于发展中的 Web 平台开发技术,随着时间推移,会有更多的浏览器支持。Web App Manifest 只在 Android 上有效。iOS 目前有自己的方式让应用出现在用户的主界面上,而不需要浏览器边框。

感兴趣的读者可以在 YouTube 上观看完整视频

查看英文原文 Angular Mobile Toolkit Tries to Make Web Apps Feel Native

2016-05-12 19:003006
用户头像

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

关注

评论

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

中国人口红利将转化成工程师红利,但是这到底是谁的红利?是程序员的悲哀还是无奈?

非著名程序员

程序员 工程师 工程师红利 无代码开发

架构师0期04周命题作业

我在终点等你

k8s 上运行我们的 springboot 服务之——flume同步数据到到clickHouse

柠檬

k8s log Clickhouse SpringBoot 2

区块链系列教程之:比特币中的共识

程序那些事

比特币 区块链 共识与信任 分叉

ARTS 第 4 周

乌拉里

环信荣登36氪WISE2020企服金榜-智能客服榜首

DT极客

week 04 总结

Safufu

架构师0期04周总结

我在终点等你

Week4总结

王志祥

极客大学架构师训练营

点赞功能,你用 MySQL 还是 Redis ?

Java小咖秀

MySQL redis 分布式 分布式系统 经验

架构训练营 0 期总结 -- 第四周

互金从业者X

从0-1学习项目方案设计

赵孔磊

聊一聊 HashMap

江城子

Java hashmap

原创 | TDD工具集:JUnit、AssertJ和Mockito (二十四)编写测试-内建扩展

编程道与术

Java 编程 TDD 单元测试 JUnit

从 0 到 1 搭建技术中台之推送平台实践:高吞吐、低延迟、多业务隔离的设计与实现

伴鱼技术团队

kafka 缓存 分布式架构 消息推送 push

系统结构:作业

梅子黄时雨

极客大学架构师训练营

week 04 作业

Safufu

如何构建你自己的 JVM (2) HelloWorld

孤星可

Java JVM 深入理解JVM

揭秘金山云云游戏PaaS服务平台背后的视频编码技术

Geek_116789

一个典型的大型互联网应用系统使用了哪些技术方案和手段(作业)

互金从业者X

一文读懂 TypeScript 泛型及应用

阿宝哥

Java typescript 大前端

架构师训练营第四周感悟

张锐

极客大学

一个典型的大型互联网应用系统使用了哪些技术方案和手段,主要解决什么问题?请列举描述。

~就这样~

一文彻底掌握二叉查找树(多组动图)

淡蓝色

Java 数据结构 算法

【思考】-产品等级与市场定位匹配

superman

定位 产品定位

谈一谈年终奖中的那些坑

张小方

程序员 面试 offer 薪资 年终奖

系统架构:学习小结

梅子黄时雨

极客大学架构师训练营

Redis系列(四):天天用着Redis集群,主从同步该知道吧?集群工作原理是否需要了解下?

z小赵

Java redis 高并发 高并发系统设计

慧点OA转战政企市场,钉钉们羡慕么?

人称T客

分布式系统架构学习总结(第四周)

~就这样~

计算机操作系统基础(九)---存储管理之段页式存储管理

书旅

php laravel 线程 操作系统 进程

Angular移动工具集要让Web应用有原生的感觉_JavaScript_David Iffland_InfoQ精选文章