渐进式网络应用程序或PWAs已经出现了一段时间,但直到最近才成为一个流行词。每个人都在谈论它,但它只是一种时尚,还是网络的未来?

 

什么是PWA?

渐进式web应用程序是web页面和本机应用程序的混合体。这种应用程序类型试图将大多数现代浏览器提供的特性与移动体验的优点结合起来。但实际上,PWA仍然只是一个网站,如果用户想要以这种方式使用它,它可以“变成”应用程序。因此,如果用户使用支持的操作系统和浏览器返回网站,系统将提示他将网站添加到主屏幕。如果他决定这么做,他可以在以后将该网站作为应用程序使用,如果没有,该网站仍然可以通过浏览器访问,并且仍然具有使PWA变得更好的大部分好处。

谷歌对PWA的定义:

  • Reliable 即使在不确定的网络条件下,立即加载并且永远不会显示downasaur又名:离线工作
  • Fast - 快速响应用户交互,丝滑流畅的动画,没有乱七八糟的滚动。
  • Engaging - 感觉就像设备上的自然应用程序,具有身临其境的用户体验。

离线工作,那是什么样?

Service workers是每个PWA的核心。Service worker是一个在后台运行的脚本,与web页面分离。它负责缓存、内容更新、推送通知、并使PWA可以脱机工作。基本上,Service worker可以拦截和处理网络请求,如果需要,可以从缓存中提供资源。

在大多数情况下,PWAs将是单页面应用程序,在第一次加载时,Application shell将存储在缓存中。

什么是Application shell?

Application shell,是呈现网站UI所需的最小HTML、CSS和JS。它应该只包含UI元素,不包含任何动态数据。由于它存储在第一次加载时的缓存中,每次用户打开app(或网站),UI都会立即加载,使得PWA只能获取动态数据。

如何安装应用程序?

它实际上不是一个安装。有一个“添加到主屏幕”功能,因此用户可以在智能手机主屏幕上为您的网站添加快捷方式。它的外观和行为都像一个本地应用程序。一旦打开,它将使用启动画面加载器加载,无需浏览器UI。要启用“添加到主屏幕”功能,您的PWA将需要app manifest

App manifest?

Web app manifest只是一个简单的JSON文件,使您能够控制应用程序在用户希望看到应用程序的区域(例如移动主屏幕)中的显示方式,指导用户可以启动的内容,更重要的是如何启动它。这包括应用程序名称、各种图标和大小、启动背景等。

 

PWAs不能在Apple设备上工作,所以它是没用的?

Service workersService workers目前在Safari中不起作用,但目前正在开发中。这意味着我们很快就可以在所有设备上使用PWAs。

但在那之前,如果PWAs在你的iphone上运行良好,就像其他普通网站一样,那就更好了