Progressive Web Apps

Scott and Wes dive into the ins and outs, best practices and tasty tidbits of Progressive Web Apps. Freshbooks - Sponsor Get a 30 day free trial of Freshbooks at freshbooks.com/syntax and put SYNTAX in the “How did you hear about us?” section. LogRocket - Sponsor LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It’s an exception tracker, a session replayer and a performance monitor. Get 14 days free over at https://logrocket.com/syntax Show Notes 2:00 • What’s the deal with the GitHub / Microsoft acquisition? 6:05 • What is a Progressive Web App? 8:55 - Progressive Web App Checklist What are the baseline features for a Progressive Web App? 09:25 • Site is served over HTTPS Let’s Encrypt 11:05 • Pages are responsive on tablets & mobile devices 11:35 • All app URLs load while offline Use a Service Worker 16:35 • Metadata provided for Add to Home screen 18:40 • First load fast even on 3G 20:00 • Site works cross-browser 20:15 • Page transitions don’t feel like they block on the network 22:20 • Each page has a URL What makes an exemplary Progressive Web App? 27:42 • All content is indexed by Google 28:38 Schema.org • metadata is provided where appropriate • Social metadata is provided where appropriate 29:42 • Canonical URLs are provided when necessary User experience 31:43 • Content doesn’t jump as the page loads Scott’s Pro Gatsby Course 36:52 • Pressing back from a detail page retains scroll position on the previous list page 37:34 • When tapped, inputs aren’t obscured by the on screen keyboard The Best of the rest 38:22 • Content is easily shareable • Site is responsive • Any app install prompts are not used excessively • The Add to Home Screen prompt is intercepted 39:20 • Use cache-first networking Device APIs 40:34 Web RTC Get User Media 41:50 Push API 45:12 • Accelerometer • GPS 45:55 Payment Request API 47:12 Local Storage 48:03 IndexedDB 48:35 StorageManager 51:45 Vibration API 52:58 • Use Lighthouse • to improve the quality of your web apps ××× SIIIIICK ××× PIIIICKS ××× • Scott: myNoise • Wes: Ozark Trail Drinkware Shameless Plugs Scott’s Level 2 React Course Wes’ Courses Tweet us your tasty treats! Scott’s Instagram LevelUpTutorials Instagram Wes’ Instagram Wes’ Twitter Wes’ Facebook Scott’s Twitter • Make sure to include @SyntaxFM • in your tweets

Release date

Lydbog: 13. juni 2018