决定为哪个平台构建应用一直是个挑战。开发人员应该把时间和金钱花在原生实现上,还是完全专注于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

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

  1. angular 自定义组件_如何创建Angular 6自定义元素和Web组件

    angular 自定义组件 by Prateek Mishra 通过Prateek Mishra 如何创建Angular 6自定义元素和Web组件 (How to create Angular 6 C ...

  2. 《博客园精华集--WEB分册》第三轮结果--心痛时刻一如既往

    <博客园精华集--WEB分册>第三轮筛选结果发布,已经过转载排除和重新分类,入选文章合计 54 篇,其中HTML/CSS 7 篇,WEB标准 23 篇,各种优化 8 篇,JS 16篇.另H ...

  3. H5开发的web APP和原生APP的区别

    H5开发的web APP和原生APP的区别有以下几个方面:一.开发方面 原生App ⊙ 每一种移动操作系统都需要独立的开发项目⊙ 每种平台都需要独立的开发语言.Java(Android), Objec ...

  4. Kubernetes二进制集群部署+Web管理界面+kubectl 命令管理+YAML文件详解(集合)

    Kubernetes---- 二进制集群部署(ETCD集群+Flannel网络) Kubernetes----单节点部署 Kubernetes----双master节点二进制部署 Kubernetes ...

  5. Google 的 Angular 迫使我放弃了 Web 开发

    一直以来,Facebook 的 React.Google 的 Angular 和尤雨溪的 Vue,被诸多的开发者称之为前端三大主流框架.去年,Facebook 修改了开源 React 的使用许可协议, ...

  6. 使用docker集群部署web应用

    1.环境准备 准备两个及以上的linux系统,先关闭防火墙与selinux安全策略 systemctl stop firewalld systemctl disable firewalld seten ...

  7. Springboot 、Netty-SocketIO、Redission 集群实现web消息通讯

    说明 最近因需要研究了一下消息推送,也是在网上参考其他大佬的文章以后进行的尝试,特此记录探索的小实践,也是为了后面需要时参考参考, 如果大家发现不妥之处欢迎指正. 目标 需要负载均衡,部署多服务,业务 ...

  8. 性能,安全,集成才是web之道

    年底了,又是一年过去了.今年感觉收获颇多..做web开发将近4年时光,期间没有做过任何完整的winApp,一直从事者网络开发.从最初的留言本--新闻--企业网站--论坛--聊天室--大型门户网站--大 ...

  9. Jenkins持续集成结合Docker Swarm集群实现Web应用部署的发布

    案列环境: 准备5台虚拟机,其中3台用于部署Docker Swarm集群,1台部署代码版本控制系统,1台部署Jenkins持续集成工具. 192.168.80.10 swarm01 192.168.8 ...

最新文章

  1. JUnit4.11 理论机制 @Theory 完整解读
  2. TCP实现服务器与单客户端连接(多线程)
  3. 长沙网络推广浅析影响网站快照更新时间的因素是什么?
  4. 大型网站应用中MySQL的架构演变史
  5. 使用Nomad构建弹性基础架构:计划和自我修复
  6. ystem.Windows.Forms.SplitContainer : ContainerControl, ISupportInitialize
  7. android面试之fragment,当你面试的时候,被问到关于Fragment的种种
  8. 带有Gradle的Spring Boot Web应用程序
  9. mysql php pdo_php PDO mysql写法
  10. CTR预估中的特征选择
  11. C语言C++中memset()函数使用和注意事项
  12. SQL Server2005下载地址
  13. scrapy持久化存储
  14. 通达信资金净流入公式_通达信指标公式:资金净流入,监控资金流入流出,分享...
  15. 第三方支付操作流程,有何优势,又存在哪些风险?
  16. ADXL345 三轴加速度角度传感器
  17. pcm数据编码成为aac格式文件(可以在酷狗播放)
  18. 今日总结------技术是最不值钱的
  19. php 输出等腰三角形,C语言输出等腰三角形
  20. FH151C6 Apple Lighting数据线取电\放电芯片苹果OTG取电协议IC芯片

热门文章

  1. JavaScript错误和异常
  2. 若不能细水长流地书写内心的温柔,那轰轰烈烈的一幕一幕不过是日后回忆自己爱无能的证据罢了。...
  3. HDU-4035 Maze 概率DP
  4. CV学习笔记-边缘提取
  5. python字典最大长度_支持key过期失效和限制字典大小的开源项目 [python expire max length]...
  6. dataframe 查找特定值_C++初级编程NOIP题:11H1544: 查找特定的值
  7. mysql什么是表的并的关系_MySQL表与表的关系
  8. php 生产环境 测试环境 同步,开发 RoR PHP Project,测试环境、生产环境部署相关问题...
  9. 林阳斌集美大学计算机学院,集美大学计算机工程学院导师教师师资介绍简介-林阳斌副教授(2021.04.06)...
  10. linux中nohup命令_Linux中的Nohup命令