在 2025 收官前,看清 Data + AI 的真实走向,点击查看 BUILD 大会精华版 了解详情
写点什么

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:003797
用户头像

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

关注

评论

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

MySQL 原理与优化:意向锁,IS,IX

老崔说架构

史上最全499道Java面试题:JVM+分布式+算法+锁+MQ+微服务+数据库

冉然学Java

Java 数据库 面试 算法 多线程

Kubernetes eBPF多种玩法

CTO技术共享

开源 签约计划第三季 8月月更

体验家辛济云:CEM不是MarTech,不仅要“从0到1”,更要规避“从1到0”

B Impact

五分钟搞定YAML

俞凡

云原生 yaml

Kubernetes rubbish如何回收

CTO技术共享

开源 签约计划第三季 8月月更

Kubernetes 动态扩缩容

CTO技术共享

开源 签约计划第三季 8月月更

SpringBoot整合oceanbase,实现oracle无缝切换到oceanbase

IT学习日记

数据库 分布式数据库 oceanbase 签约计划第三季 oracle迁移到oceanbase

阿里P8熬了一个月肝出这份32W字Java面试手册,在Github标星31K+

冉然学Java

Java 面试 springboot 秋招 java面试·

如何正确理解Java领域中的多线程模型,主要用来解决什么问题?

PivotalCloud

美团二面:如何解决 bin log 与 redo log 的一致性问题

飞天小牛肉

签约计划第三季

STM32入门开发 编写DS18B20温度传感器驱动(读取环境温度、支持级联)

DS小龙哥

8月月更

Vue讲解系列- - -Nginx和Postman讲解

叶秋学长

Vue 8月月更

LAXCUS授权许可证 第1版

LAXCUS分布式操作系统

开源 分布式操作系统 软件许可证

Java程序的构造与执行

GeekYin

编程语言 JVM Java core 8月月更

史上最全的Java并发系列之Java中的线程池

自然

线程池 并发 8月月更

废除“网络君主制”,认识 Usenet ~

掘金安东尼

前端 网络 8月月更

千万级学生管理系统的考试试卷存储方案

张立奎

计算机网络知识点全面总结(一篇全懂)

C++后台开发

网络编程 计算机网络 网络协议 底层原理 C/C++开发

涨薪了!拿着GitHub标星80k的阿里性能优化笔记,把项目优化个遍

程序知音

Java 编程 程序员 性能优化 后端技术

史上最全的Java并发系列之Java中的锁的使用和实现介绍(二)

自然

多线程 并发 8月月更

React Server Components 介绍 亮点

HullQin

CSS JavaScript html 前端 8月月更

Kubernetes宕机切换源码分析

Jason黄

源码分析 kubelet Kubernetes 集群 宕机

大揭秘:云网流量采集方案关键点

阿泽🧸

签约计划第三季 8月月更 云网流量采集

为什么实际业务中不建议直接使用POI操作Excel?

IT学习日记

POI EasyExcel 签约计划第三季 java excel导出导入 poi和easyexcel对比

开源一夏 | AngularJS实战之依赖注入与应用实践

恒山其若陋兮

开源 8月月更

关于Http协议,你必须要知道的

TimeFriends

8月月更

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