Use universal the Web Platform primitives, a patterns and Polymer Project for reusable, performant, maintainable code.
Motto-in-hashtag-form #UseWebPlatform is extended motto #UseThePlatform.
The primitives and the patterns:
You Don't Need SASS, LESS, Stylus, etc.
You Don't Need Mustache, Handlebars, Nunjucks, Pug, etc.
You Don't Need Dart, TypeScript, Elm, PureScript, CoffeeScript, ClojureScript, etc.
WebAssembly or wasm is a new portable, size- and load-time-efficient format suitable for compilation to the web.
You Don't Need Google Native Client.
Drop any frameworks for their bad performance and maintainability, check out the HNPWA apps.
You Don't Need Angular, jQuery, React, Vue, Bootstrap, Foundation, etc.
Web Components are a set of web platform APIs that allow you to create new custom, reusable, encapsulated HTML tags to use in web pages and web apps.
Web Components let us extend the browser’s built-in component model - the DOM - rather than bring our own.
Web components are based on four main specifications:
You Don't Need Angular Components, React Components, Vue Components, etc.
In combination with HTTP/2 and Server Push, standard module formats like HTML Imports and ES6 Modules let us declare fine-grained dependencies and efficiently deliver them to the client in optimally cacheable form, without relying on complicated packaging tools and loaders.
You Don't Need Browserify, Rollup, Webpack, etc.
Service Workers let us build pure web apps that users can access even when their devices are offline or network conditions are poor, whereas previously we might have had to resort to manually installable native or “hybrid” apps.
Use Workbox to simplify your development by making it easy to take advantage of powerful service worker features, eliminate boilerplate code, and automate service worker generation.
Web Workers is a simple means for web content to run scripts in background threads. The worker thread can perform tasks without interfering with the user interface.
You Don't Need manually installable native or “hybrid” apps.
Progressive Web Apps (PWA) are user experiences that have the reach of the web, and are:
This new level of quality allows Progressive Web Apps to earn a place on the user's home screen.
|Website||PWA (1)||Native App|
|Offline||NO ➖||YES 👍||YES 👍|
|App stores||NO ➖||NO ➖ (2)(3)||YES 👍|
|Responsive||YES 👍||YES 👍||YES 👍|
|Searchable||YES 👍||YES 👍||NO ➖|
|Local Notifications||NO ➖||YES 👍||YES 👍|
|Push Messages||NO ➖||YES 👍||YES 👍|
|Install needed to run||NO 👍||NO 👍||YES ➖|
|Fast Updates||YES 👍||YES 👍||NO ➖|
|Cross-platform||YES 👍||YES 👍||NO ➖|
|Performance||NO ➖||YES 👍 (4)||YES 👍|
|Lower dev time and cost||YES 👍||YES 👍||NO ➖|
|Lower user acquisition cost||YES 👍||YES 👍 (5)||NO ➖|
(1) PWA on Chrome from v59 on Android, Chromebook, Samsung Internet v5.4 on Android, Windows 10 (coming soon)
(2) Progressive Web Apps are coming soon to the Windows Store for Windows 10 Devices. 👍
(3) Updates don’t have to run through an app store. 👍
(4) Performance using RAIL Performance Model, WebAssembly, Web Workers.
(5) Progressive Web Apps vs Native: Which Is Better for Your Business?
You Don't Need Apache Cordova, PhoneGap, Crosswalk, React Native, etc.
Web Accessibility means that people with disabilities can use the Web.
PRPL is a pattern for structuring and serving Progressive Web Apps (PWAs), with an emphasis on the performance of app delivery and launch. It stands for:
CSR (Client Side Rendering) with PRPL Pattern has similar performance as SSR (Server Side Rendering).
JAMstack has similar architecture.
You Don't Need SSR using Django, PHP, React, Tomcat, Vue, etc.
Budget for TTI on mobile 3G networks is only ~ 50 KB per route ❗️
Drop any frameworks. Polymer 2.0 library has around 12 KB, so about 38 KB left for your budget. 🎉
RAIL is a user-centric performance model. Every web app has these four distinct aspects to its life cycle, and performance fits into them in different ways:
We have a collection of Awesome Polymer resources.
Try StartPolymer Playgrounds. 👀
Do you like it? Please, star the motto ⭐️ 🔝
Short link: git.io/UseWebPlatform