My pledge to the Web ▪ Never gonna give you up ▪ Never gonna let you down ▪ Never gonna run around and desert you ▪ Never gonna make you cry ▪ Never gonna say goodbye ▪ Never gonna tell a lie and hurt you
2009 HTML [is] in direct competition with other technologies intended for applications deployed over the Web, in particular Flash and Silverlight. “ - Ian Hickson, editor HTML, Living Standard
It’s an App World. The Web Just Lives in It Today, the U.S. consumer spends an average of 2 hours and 38 minutes per day on smartphones and tablets. 80% of that time (2 hours and 7 minutes) is spent inside apps and 20% (31 minutes) is spent on the mobile web. “ - blog.flurry.com April, 2013
Progressive Web Apps ▪ “install” to the home screen ▪ have their own icon (defined by the web developer) ▪ can launch full-screen, portrait or landscape ▪ but “live” on the Web
Downloading a typical app with 20 MB APK can take more than 30 minutes on a 2G network, and the download is likely to fail before completion, due to the flaky nature of the network.
One last deciding factor in whether or not to adopt an app is whether or not the user is willing to give away their precious disk space to the app… With space this limited, the user is comparing their personal photo collection with the adoption of a new app on their phone. Mobile App Developers Are Suffering, Branch https://blog.branch.io/mobile-app-developers-are-suffering
Birdly we didn’t stand a chance as we were fighting with both our competitors and other apps for a few more MB of room inside people’s phones. https://medium.com/inside-birdly/why-you-shouldn-t-bother- creating-a-mobile-app-328af62fe0e5#.ufoave1x4
Manifest file stores metadata for your web app: icons, description, colors, and related info that lets browsers create high-quality experiences for the launcher icon, task switcher, and splash screen.
Opera differences ▪ HTTP-hosted sites will only display with browser UI, regardless of what the manifest states ▪ When the user follows a link that takes the user out of the domain of the installed app, a new tab is spawned, with browser chrome. ▪ Opera doesn’t (yet) support background_color; this will be added in a forthcoming release.
Progressive Web Apps ▪ live on the server so no update distribution lag ▪ require no app store or gatekeeper ▪ are a normal website on browsers such as Opera Mini, Safari, Windows phones ▪ searchable, indexable, linkable ▪ can work offline
The appcache API is another big mistake. It’s the best example of not understanding the problem before designing a solution, and I’m still trying to fix that mess. “ SlapDache - Hixie
AppCache is declarative - you give the browser a manifest and magic happens. This has well documented limitations. “ What's wrong with AppCache? - Alex Russell (sinister mastermind at Google)
Why is everything else around us developing so fast, but the web is so slow to adopt anything? “ Why are Standards slow? - Mark Roberts' email to WHATWG, 10 Oct 2013
Hixie’s reply: 1. Have someone design the feature. 2. Have someone write a specification for it. 3. Have some people write tests for it. 4. Have one browser implement it. 5. Have another browser implement it. 6. [etc] 7. Have people document it.
Extensible Web Manifesto Browser vendors should provide new low-level capabilities that expose the possibilities of the underlying platform as closely as possible. They should also seed the discussion of high- level APIs through JavaScript implementations of new features “
Fetch standard At a high level, fetching a resource is a fairly simple operation. A request goes in, a response comes out. The details of that operation are however quite involved and used to not be written down carefully and differ from one API to the next. “
The Fetch Standard provides a unified architecture for these features so they are all consistent when it comes to various aspects of fetching “ Explaining the platform
The Fetch Standard also defines the fetch() JavaScript API,which exposes most of the networking functionality at a fairly low level of abstraction. “ Fetch API - Fetch Living Standard
The JavaScriptification of the Web? “ We want web developers to write more declarative code, not less. This calls for eliminating the standards bottleneck to introducing new declarative forms, and giving library and framework authors the tools to create them. - extensiblewebmanifesto.org
CSS Magic ▪ Parsing when it drops unknown stuff ▪ specificity, inheritance, imports, @rules ▪ shorthands ▪ apply it live, as the page is still loading ▪ reapply any time the DOM changes
Custom Layout Custom layouts will allow us to register a custom display value and own layout computations making whole classes of new proposals possible to figure out in the community and without impossibly complex barriers. pantomime-horse: {display: --unicorn;}
Composited Scrolling • position-sticky, • image carousels, • custom scroll animations, • iphone-style contact lists, • physics-based animations. Scripted effects (driven by requestAnimationFrame, response to onscroll, etc) are flexible and powerful, but are subject to main thread jank.
they're the only way to create common effects such as
Composited Scrolling Introduce CompositorWorker whose global scope exposes requestAnimationFrame which runs at the rate of threaded scrolling and animation.
Allow DOM elements to be wrapped in a CompositorProxy which may be sent to a CompositorWorker and which exposes a limited set of accelerated properties and input events.
This extensibility and ability to adapt, refine and share sensible high-level features are the cornerstone on which we will allow the Web not just to generally improve, but to remain interesting and competitive for decades — and recapture some of the most important things that made it successful in the first place. “ Brian Kardell
Include developers In order for the open web to compete with its walled competitors, there must be a clear path for good ideas by web developers to become part of the infrastructure of the web. “ - extensiblewebmanifesto.org
the RICG’s main contribution to the web platform wasn’t picture, srcset, or sizes… To get them done we had to punch a hole through the thick technical, cultural, and institutional walls that separate the people who make browsers from the people who make websites. “ element - Mat Marquis (Wilto)
Thanks • Me by HTML sign in Tokyo by Doug Schepers (@shepazu), used with permission • The Selecter: By Braunov - Own work, CC BY-SA 3.0, https://commons.wikimedia.org/w/index.php?curid=3140115 • Stare photo Milner Moshe https://commons.wikimedia.org/wiki/File:Sartre_1967_crop.jpg • Apps vs Web graphs by Flurry, used by permission • World Development Report 2016: Digital Dividends http://www.worldbank.org/en/publication/wdr2016