V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
Livid
V2EX  ›  程序员

一篇关于 Progressive Web App 很好的入门文章

  •  
  •   Livid · 2016-06-09 14:21:28 +08:00 · 11879 次点击
    这是一个创建于 3088 天前的主题,其中的信息可能已经有所发展或是发生改变。
    Progressive Web App 是 Google 在 Web 平台开始推广的一个新概念,可以理解为是尽可能借助目前的新技术(比如 Service Worker , Push Notification 及其他展现层的新技术),让 Web App 的体验无限接近 Native App 。

    https://addyosmani.com/blog/getting-started-with-progressive-web-apps/
    14 条回复    2016-06-22 22:29:33 +08:00
    HFcbyqP0iVO5KM05
        1
    HFcbyqP0iVO5KM05  
       2016-06-09 15:02:51 +08:00 via Android
    PWApp 相对于 Native App 的特点: progressive, discoverable, linkable
    PWApp 相对于一般 web app 的特点: app-like(style), re-engageable, installable

    我想知道 web app 怎么实现消息推送的。在 b-s 模式中,不是只有先 request 才有 response 吗?有谁能给个搜索关键字吗?看楼主的那篇文章,似乎是需要调用浏览器接口。
    HFcbyqP0iVO5KM05
        2
    HFcbyqP0iVO5KM05  
       2016-06-09 15:06:09 +08:00 via Android
    还没说完手抖发送了。
    消息推送的 API 目前只有谷歌浏览器有,火狐在开发, Edge 在考虑, Safri 目前没有表态。
    那网页游戏似乎是有推送的?那个是怎么实现的呢?

    一只 web 开发的新鸟。
    noli
        3
    noli  
       2016-06-09 15:15:25 +08:00   ❤️ 1
    @gulu 有了 websocket 和浏览器内核支持, web 就可以从传统的 b/s 模式中蜕化。
    jsq2627
        4
    jsq2627  
       2016-06-09 15:42:46 +08:00   ❤️ 1
    @gulu 轮询、长轮询、 Server-side event 、 WebSocket
    HFcbyqP0iVO5KM05
        5
    HFcbyqP0iVO5KM05  
       2016-06-09 15:44:37 +08:00 via Android
    @noli 谢谢,根据你的提示稍微了解了一下 websocket ,原来实现方法就是换协议,果然粗暴, 23333
    wenbinwu
        6
    wenbinwu  
       2016-06-09 16:03:39 +08:00
    跟 mozilla 不做了的 firefox os 里的 app 概念差不多
    aaronzheng
        7
    aaronzheng  
       2016-06-09 16:29:43 +08:00
    Google Chrome 团队今年在今年六月底将要在荷兰阿姆斯特丹举办 PWA 开发者高峰会议, PWA - Progressive Web App 就是“仿原生应用的 Web 应用” — 可以简单理解为我们都较为熟悉的的 HTML5 应用。 PWA 可以离线运行,还可以添加到手机主屏幕,并且点击之后会以全屏方式运行,体验跟原生应用非常相似。

    印度最大的网上商店 FlipKart 就使用 PWA 推出了 Flipkart Lite ,提升了手机版的用户的体验,介绍视频在这里


    广州 GDG 路过。
    bdbai
        8
    bdbai  
       2016-06-09 16:55:43 +08:00 via Android
    @gulu Edge 那边好像已经做出来了,跟 Win10 通知中心结合展现的。
    Tierney
        9
    Tierney  
       2016-06-09 22:04:15 +08:00 via iPhone
    @gulu Safari 在五年计划里提了一嘴……上周参加北京 GDG 的 I/O Redux 时候听分享时还专门说过这个 Session
    jswh
        10
    jswh  
       2016-06-10 01:21:32 +08:00
    @jsq2627 加个 http2 的 server push
    hantsy
        11
    hantsy  
       2016-06-10 13:15:31 +08:00
    Google Developers 的介绍很详细。。。 Angular 2 的官方 Mobile 支持基于 PWA 概念。
    hantsy
        12
    hantsy  
       2016-06-10 13:18:38 +08:00
    @aaronzheng 看了 Google Developers 的介绍, 主要比之前自己对 HTML 5 理解加入一些必要的东西,比如 metadata 描述文件, Service Worker, 本地缓存处理,还有 installable ( Chrome on Android 上支持)等。
    hantsy
        13
    hantsy  
       2016-06-10 13:21:20 +08:00
    @gulu 通知可以在 APP 启动 时启用一个客户端 Service Worker ,相当一个单独的线程在客户跑。
    vjnjc
        14
    vjnjc  
       2016-06-22 22:29:33 +08:00
    原来 v 站还有 pwa 的帖子,高级。
    顺便贴个[高级 demo]( https://www.washingtonpost.com/pwa/)
    看起来 pwa 强依赖于 service worker ,而目前 Safari 不支持,使得不是那么实用。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   912 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 24ms · UTC 21:57 · PVG 05:57 · LAX 13:57 · JFK 16:57
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.