Modern Mobile Web Apps

Download Modern Mobile Web Apps

Post on 06-Jan-2017

2.382 views

Category:

Technology

1 download

TRANSCRIPT

  • https://twitter.com/dynamitterhttp://www.facebook.com/dynamishttp://slideshare.net/dynamishttp://dynamis.jp

  • http://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/androidhttp://r.dynamis.jp/android

  • http://r.dynamis.jp/ios

  • http://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ios

  • http://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ioshttp://r.dynamis.jp/ios

  • http://www.netratings.co.jp/news_release/2015/11/Newsrelease20151125.html

  • http://www.slideshare.net/VictorKongCisneros/the-2015-us-mobile-app-report-by-comscore

  • http://www.slideshare.net/VictorKongCisneros/the-2015-us-mobile-app-report-by-comscore

  • http://www.slideshare.net/VictorKongCisneros/the-2015-us-mobile-app-report-by-comscore

  • http://www.slideshare.net/VictorKongCisneros/the-2015-us-mobile-app-report-by-comscore

  • http://www.slideshare.net/VictorKongCisneros/the-2015-us-mobile-app-report-by-comscore

  • https://www.millwardbrowndigital.com/mobile-mantra/

  • https://www.millwardbrowndigital.com/mobile-mantra/

  • https://www.youtube.com/watch?v=MxTaDhwJDLg

  • https://infrequently.org/2015/06/progressive-apps-escaping-tabs-without-losing-our-soul/

  • https://developers.google.com/web/progressive-web-apps

  • https://developers.google.com/web/progressive-web-apps

  • https://developers.google.com/web/progressive-web-apps

  • http://www.html5rocks.com/en/tutorials/service-worker/introduction/

  • var CACHE_NAME = 'my-site-cache-v1'; var urlsToCache = [ '/', '/style.css', '/script.js'];

    self.addEventListener('install', function(event) { // Perform install steps event.waitUntil( caches.open(CACHE_NAME) .then(function(cache) { console.log('Opened cache'); return cache.addAll(urlsToCache); }) ); });

    http://www.html5rocks.com/en/tutorials/service-worker/introduction/

  • https://hacks.mozilla.org/2015/12/beyond-offline/

  • https://jakearchibald.com/2014/offline-cookbook/

  • var urlsToCache = [ '/', '/style.css', '/script.js'];self.addEventListener('fetch', function(event) { event.respondWith( caches.match(event.request) .then(function(response) { // Cache hit - return response if (response) { return response; } return fetch(event.request); } ) ); });

  • https://developers.google.com/web/updates/2015/11/app-shell

  • https://developers.google.com/web/updates/2015/11/app-shell

  • http://r.dynamis.jp/suumo-serviceworker

  • { "short_name": "", "name": "", "icons": [ { "src": "launcher-icon-3x.png", "sizes": "144x144", "type": "image/png" } ], "start_url": "index.html", "display": "standalone" }

    https://www.w3.org/TR/appmanifest/

  • https://developers.google.com/web/updates/2015/03/increasing-engagement-with-app-install-banners-in-chrome-for-android

  • https://serviceworke.rs/push-rich_demo.html

  • https://serviceworke.rs/push-rich_demo.html

  • async function registerForPush() { // Service Worker let registration = await navigator.serviceWorker.register('sw.js') // let subscription = await registration.pushManager.getSubscription() // if (!subscription) { subscription = await registration.pushManager.subscribe() } // await fetch('/save-push-endpoint', { method: 'post', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(subscription) }) // subscription.endpoint POST }

  • https://github.com/marco-c/web-pushhttps://github.com/mozilla-services/autopush

  • HTML5

    CSS3

    WebGLECMA6

    DOM4 HTTP/2

    IndexedDB

    ServiceWorkers

    WAI-ARIA

    WebRTC

    Presentation

    TCP

    asm.js

    SVG

    Audio

    Push

    ManifestWebVR

    DNT