PWA全称Progressive Web App，即渐进式WEB应用。
web网页开发成本低，网站更新时上传最新的资源到服务器即可，用手机带的浏览器打开就可以使用。
当你在移动端浏览器打开自己网站的时候 你可以生成快捷方式到桌面 ( 添加页面到主屏幕 )，这个时候有两种配置，一种是纯 link 配置 一种就是使用 manifest 。
pwa
优点
无需安装，无需下载，只要你输入网址访问一次，然后将其添加到设备桌面就可以持续使用。
发布不需要提交到app商店审核
即时加载，即使在不确定的网络条件下也不会受到影响
页面展现之后，用户期望有平滑的体验，过渡动画和快速响应
就像设备上的原生应用程序，具有沉浸式的用户体验
以通过manifest.json控制应用程序的显示方式和启动方式，指定主屏幕图标、启动应用程序时要加载的页面、屏幕方向，甚至可以指定是否显示浏览器Chrome
缺点
游览器对技术支持还不够全面， 不是每一款游览器都能100%的支持所有PWA
需要通过第三方库才能调用底层硬件（如摄像头）
PWA现在还没那么火，国内一些手机生产上在Android系统上做了手脚，似乎屏蔽了PWA, 但是相信当PWA火起来以后，这个问题就不会是问题
Web应用程序清单是被称为渐进式Web应用程序(PWA)的Web技术集合的一部分, 它们是可以安装到设备的主屏幕的网络应用程序，而不需要用户通过应用商店，伴随着其他功能, 比如离线可用和接收推送通知。不像app一样需要审核。
html 实现添加至主屏幕
index.html
<!-- 主屏幕图标 -->
<link rel="apple-touch-icon-precomposed" href="https://f.ishangjie.com/h5/common/icon/commonShare.png">
<!-- 应用启动的时候的图片 -->
<link rel="apple-touch-startup-image" href="https://f.ishangjie.com/h5/common/icon/commonShare.png" media="screen and (min-device-width:481px) and (max-device-width:1024px) and (orientation:landscape) and (-webkit-min-device-pixel-ratio: 2)">
<!-- 如果没有写name 启动的就是 title -->
...
Manifest 实现添加至主屏幕
index.html
<head>
<title>Minimal PWA</title>
<meta name="viewport" content="width=device-width, user-scalable=no" />
<link rel="manifest" href="manifest.json" />
<link rel="stylesheet" type="text/css" href="main.css">
<link rel="icon" href="/e.png" type="image/png" />
</head>manifest.json
{
"name": "Minimal PWA", // 必填 显示的插件名称
"short_name": "PWA Demo", // 可选 在APP launcher和新的tab页显示，如果没有设置，则使用name
"description": "The app that helps you understand PWA", //用于描述应用
"display": "standalone", // 定义开发人员对Web应用程序的首选显示模式。standalone模式会有单独的
"start_url": "/", // 应用启动时的url
"theme_color": "#313131", // 桌面图标的背景色
"background_color": "#313131", // 为web应用程序预定义的背景颜色。在启动web应用程序和加载应用程序的内容之间创建了一个平滑的过渡。
"icons": [ // 桌面图标，是一个数组
{
"src": "icon/lowres.webp",
"sizes": "48x48", // 以空格分隔的图片尺寸
"type": "image/webp" // 帮助userAgent快速排除不支持的类型
},
{
"src": "icon/lowres",
"sizes": "48x48"
},
{
"src": "icon/hd_hi.ico",
"sizes": "72x72 96x96 128x128 256x256"
},
{
"src": "icon/hd_hi.svg",
"sizes": "72x72"
}
]
}
Manifest api 参考文档：https://developer.mozilla.org/zh-CN/docs/Web/Manifest