Progressive Web App template
See original GitHub issue@yyx990803 and I have talked about working on an official PWA template for Vue 📱
There are a few different options for what this could include:
- Web Application Manifest
- Default favicons (minimalist setup from realfavicongenerator.net)
- Service Worker precaching + runtime caching via
sw-precache-webpack-plugin
- Application Shell architecture
- Code-splitting by default with vue-router
If we wanted to go even more ambitious we could cover:
- PRPL pattern support (using something like
preload-webpack-plugin
) - Simple server-side rendering + pre-fetching
- CSS extraction for production
Requirements
- Aim to score as close to 100/100 on Lighthouse
- Must be straight-forward to use. If we make it inherently complex, it will lose value to end users.
Prior-art - PWA templates and boilerplates 🎨
- https://github.com/Narkoleptika/webpack-everything
- https://github.com/electricjesus/vue-pwa-template
- https://github.com/BosNaufal/vue-simple-pwa
Vue.js PWAs (open-source) 👐
- https://github.com/vuejs/vue-hackernews-2.0
- https://github.com/GoogleChrome/jscost.org (not yet fully released)
- https://github.com/mrgodhani/feedbox
- https://github.com/bstavroulakis/vue-wordpress-pwa
Other references 📚
Initially, I would love to get a feel for what would considered palatable for an MVP. There’s technically nothing stopping us baking in everything in the above list, but let’s talk and figure out a path forward 🚀
Issue Analytics
- State:
- Created 7 years ago
- Reactions:58
- Comments:6 (3 by maintainers)
Top Results From Across the Web
Progressive Web App Website Templates - ThemeForest
Get 58 progressive web app website templates on ThemeForest such as Odis: PWA Mobile App (Progressive Web App), Mostore - WooCommerce Mobile Progressive...
Read more >Simple PWA
Simple PWA is a Progressive Web App template that provides the minimum file structure needed to create a PWA—a reliable and installable web...
Read more >Progressive Web App Template - GitHub
This template is a starting point for building Progressive Web Apps based on Polymer & Material Design with motto #UseThePlatform.
Read more >Download 27 Pwa Web Templates - Envato Elements
Download All 27 “pwa” web templates unlimited times with a single Envato Elements subscription. All from independent designers.
Read more >Progressive Web App designs, themes, templates ... - Dribbble
Progressive Web App. 218 inspirational designs, illustrations, and graphic elements from the world's best designers. Want more inspiration?
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
I’ve created https://github.com/vuejs/pwa and sent an invite for collaboration. We’ll move it to
vuejs-templates
once it’s ready.Thanks Addy! The list looks good and totally feasible. The only thing I’d consider is whether we want to include SSR for now, since SSR comes with some tradeoffs in increased dev and deployment complexity which may not be a net win for all apps. We can start with a version without SSR and then work on a separate one that uses SSR.