关于 PWA 应用的可安装性

简介: 关于 PWA 应用的可安装性

PWA 的一个定义特征是它可以被安装在原生移动设备上,然后对用户来说就像是一个平台的原生应用程序,是其设备的 permanent 功能。用户可以像启动任何其他应用程序一样,直接从移动操作系统中启动它。


我们可以这样概括:


  • PWA 可以从平台的应用商店安装,或者直接从网页安装。
  • PWA 可以像平台特定的应用一样安装,并可以自定义安装过程。


一旦安装,PWA就会在设备上获得一个应用图标,与平台特定的应用并列。


一旦安装,PWA可以作为一个独立的应用启动,而不是在浏览器中的一个网站。


首先,我们将讨论一个web应用必须满足的可安装性要求。


可安装性


为了让一个 web 应用可安装,它需要满足一些技术要求。我们可以将这些看作是一个web应用成为 PWA 的最低要求。


web app manifest


Web 应用程序清单是一个 JSON 文件,它告诉浏览器 PWA 在设备上应如何显示和运行。

对于要成为 PWA 的 Web 应用程序,它必须是可安装的,并且要使其可安装,它必须包含清单。

manifest.json 文件通过 link 标签被引入 index.html:

<!doctype html>
<html lang="en">
  <head>
    <link rel="manifest" href="manifest.json" />
    <!-- ... -->
  </head>
  <body></body>
</html>


清单包含一个包含成员集合的 JSON 对象,每个成员都定义 PWA 外观或行为的某些方面。 下面这是一个相当简单的清单,仅包含两个成员:“name”和“icons”。

{
  "name": "My PWA",
  "icons": [
    {
      "src": "icons/512.png",
      "type": "image/png",
      "sizes": "512x512"
    }
  ]
}


对于可安装的 Web 应用程序,它必须包含一个带有 fetch 事件处理程序的 Service Worker,以提供基本的离线体验。


用户希望在应用商店中找到适合其平台的应用,例如 Google Play Store 或 Apple Store。


如果应用程序满足了可安装性的先决条件,可以将其打包并通过应用程序商店分发。

相关文章
|
1月前
|
Rust 前端开发 开发者
探索前端技术发展趋势:从WebAssembly到PWA
【2月更文挑战第10天】随着互联网的快速发展,前端技术也在不断演进。本文将从WebAssembly和渐进式Web应用(PWA)两个方面探讨前端技术的发展趋势,分析它们对于前端开发的影响和未来发展潜力。
|
7月前
|
JSON 缓存 搜索推荐
Progressive Web Apps(PWA):未来网络体验的崭新纪元
在当今数字化的世界中,Progressive Web Apps(PWA)已经成为了Web开发的一项重要趋势。PWA是一种结合了Web和原生应用程序优点的新型Web应用,它们提供了高性能、离线访问和优秀的用户体验。本博客将深入探讨PWA的概念、特点以及为什么它们对未来网络体验如此重要。
67 0
|
7月前
|
供应链 JavaScript 前端开发
业界三款主流的 PWA Storefront 概述
业界三款主流的 PWA Storefront 概述
140 0
|
1月前
|
编解码 前端开发 JavaScript
前端发展趋势:WebAssembly、PWA 和响应式设计
前端发展趋势:WebAssembly、PWA 和响应式设计
|
7月前
|
传感器 Web App开发 缓存
PWA 技术诞生的前世今生漫谈
PWA 技术诞生的前世今生漫谈
58 0
|
3月前
|
Web App开发 JavaScript 前端开发
渐进式网页应用(PWA)
【1月更文挑战第1天】
|
7月前
|
存储 缓存 JSON
PWA 应用和原生应用的一些区别
PWA 应用和原生应用的一些区别
44 0
|
8月前
|
JSON 缓存 前端开发
PWA(渐进式Web应用)的开发与部署
PWA(渐进式Web应用)的开发与部署
306 0
|
9月前
|
缓存 前端开发 API
前端的未来在哪里之PWA
PWA(Progressive Web App)作为一种新的前端开发技术,已经成为了前端开发的新趋势。它可以让应用程序在没有网络连接的情况下也可以正常运行,提高了用户的体验。
116 0
|
11月前
|
Web App开发 存储 安全