Vivaldi is a new browser that focuses on user customization and experience. In this episode, designer Atle Mo (@subtlepattern) and developer / designer Henrik Helmers (@helmers) chat with us about what this might mean for web developers and what technologies Vivaldi leverages to achieve its approach to be “Feature rich, powerful, secure and fun” .

• Vivaldi - https://vivaldi.com/
• Vivaldi Forum - https://forum.vivaldi.net/
• Submit Vivaldi Bugs - https://vivaldi.com/bugreport/
• Vivaldi on Reddit - https://www.reddit.com/r/vivaldibrowser/

Guests

• Atle Mo (@subtlepattern)
• Henrik Helmers (@helmers)

Panel

• Justin Ribeiro (@justinribeiro)
• Erik Isaksen (@eisaksen) 

Chris Coyier (@chriscoyier) returns to the show to chat about his most recent publication ‘Practical SVG’. Chris walks us through the ins and outs of working with SVG (Scalable Vector Graphics). Chris is most known for on the web for masterminding codepen.io (an in-browser social code application), creating & maintaining css-tricks.com, and podcasting on ShopTalk Show & CodePen Radio.

• Practical SVG - https://abookapart.com/products/practical-svg
• About the Practical SVG book - https://css-tricks.com/wrote-book-practical-svg/
• ShopTalk Show - http://shoptalkshow.com/

• CodePen Radio - https://blog.codepen.io/radio/
• CodePen - http://codepen.io/
• The Web Platform Podcast 27 - http://thewebplatformpodcast.com/27-building-codepen
• The Web Platform Podcast 58 - http://thewebplatformpodcast.com/58-scalable-vector-graphics
• GruntIcon - https://github.com/filamentgroup/grunticon
• IcoMoon - https://icomoon.io/
• SVGO - https://github.com/svg/svgo
• SVG Reference Cheat Sheet - https://developer.mozilla.org/en-US/docs/Web/SVG/Element
• D3 - https://d3js.org/
• Sara Soueidan SVG articles - https://sarasoueidan.com/tags/svg/

Cornel Stefanache (@_cstefanache, @isMonkeyUser) talks about Monkeyuser.com,, laughter, and finding happiness at work & home.

Resources

• Monkeyuser - http://www.monkeyuser.com/
• Xkcd - http://xkcd.com/
• What If? (Randall Munroe) - http://what-if.xkcd.com/
• ReadTheSource (RTS) - https://www.youtube.com/readthesource

Erik Isaksen(@eisaksen) & Mark Nadal (@marknadal) talk about trends in web development as an industry. They discuss technology communities and how they got involved. Mark grills Erik on how technology has changed over the years & what patterns he’s seen across his career. Mark predicts the future of web technology…machine learning on AST’s. Do not resist, the future is already written.

• Web Components Remote Conf - https://wcremoteconf.com
• GunDB - http://gun.js.org/
• Brett Victor - http://worrydream.com/
• Non Zero - https://en.wikipedia.org/wiki/Nonzero:_The_Logic_of_Human_Destiny
• Esprima AST visualizer - http://resources.jointjs.com/demos/javascript-ast

Tal Ater (@TalAter), creator of Annyang, a powerful speech recognition library for the web, has now created UpUp, an Offline First library using the power of Service Workers.  UpUp is an incredible asset for web developers wanting to build Progressive Web Applications (PWA’s)

• UpUp - https://www.talater.com/upup/
• UpUp (Github) - https://github.com/TalAter/UpUp
• Are Service Workers Ready? - https://jakearchibald.github.io/isserviceworkerready/
• Offline First Slack Channel  - http://offlinefirst.org/chat/
• Tal’s new book - https://pwabook.com
• cache.adderall(⚡) - https://www.talater.com/adderall/
• The Changelog 183 : The Offline First Revolution and Speech Recognition with Tal Ater - https://changelog.com/podcast/183
• Jeremy Keith’s Service Worker link collection - https://adactio.com/links/tags/serviceworkers

A summary of the second Polymer Summit, a two day Web Component conference focused on Polymer. Chris Lorenzo (@chiefcll) & John Riviello (@johnriv), spoke on day 2 of the Summit on Comcast’s Polymer experiences. They share their thoughts with us on the event and much more.

Resources

• The Polymer Summit 2016 - https://www.polymer-project.org/summit
• Talks - https://www.polymer-project.org/summit/schedule
• Codelabs - https://codelabs.developers.google.com/polymer-summit-2016
• Polymer in Practice at Comcast w/ Chris & John - https://www.youtube.com/watch?v=dZo7Tqr2lqI&list=PLNYkxOF6rcICc687SxHQRuo9TVNOJelSZ&index=29
• John’s Lynda.com course - https://www.lynda.com/CSS-tutorials/CSS-Sass-Converting-Existing-Site/434463-2.html

Jeremy Keith (@adactio), web guru & co-founder of ClearLeft, talks with us about the potential pitfalls and hopes on Progressive Enhancement with Web Components.

Resources

• Extensible Web Components (2016) - https://adactio.com/journal/11052
• Responsible Web Components (2014) - https://adactio.com/journal/7967
• Adam Onishi’s article - http://adamonishi.com/2016/08/web-components-and-progressive-enhancement/
• Eric Bidelman on Web Components in PWA (specifically on JavaScript class extension as Progressive Enhancement) - https://www.youtube.com/watch?v=pBCDdeqzUlY&feature=youtu.be&t=6m34s
• Polymer Shop Demo - https://shop.polymer-project.org/
• Polymon - https://polymon.polymer-project.org/
• Gold Standard - https://github.com/webcomponents/gold-standard/wiki
• The Extensible Web Manifesto - https://extensiblewebmanifesto.org/
• Alex Russell’s response to Keith - https://infrequently.org/2014/09/uncomfortably-excited/
• Sturgeon’s Law - https://en.wikipedia.org/wiki/Sturgeon%27s_law
• Soledad’s Lightning Talk - https://soledadpenades.com/2014/09/19/extensible-web-summit-berlin-2014-my-lightning-talk-on-web-components/
• Bruce Lawson blog post on the Extensible Web Summit -http://www.brucelawson.co.uk/2014/extensible-web-summit-berlin/

Paul Bakaus (@pbakaus), Google Engineer, has recently been leading the AMP Project which is an open source initiative to optimize content for mobile devices using the web. AMP is heavily supported by several global news & media groups and has the SEO community in an uproar. Paul takes us through the core concepts of project and the reasoning behind it. Additionally, AMP leverages many newer technologies such as Service Workers, ES2015, and Custom Elements (One of the four Web Component pillars) making it an exciting project for developers to contribute to.

Resources

• AMP by example - https://ampbyexample.com/
• How does it work? - https://www.ampproject.org/learn/how-amp-works/
• AMP on Github - https://github.com/ampproject
• AMP HTML - https://github.com/ampproject/amphtml
• Creating your first AMP page - https://www.ampproject.org/docs/get_started/create.html
• AMP Validator
• • General info - https://github.com/ampproject/amphtml/blob/master/validator/README.md
  • Guide - https://www.ampproject.org/docs/guides/validate
• AMP Docs & Reference - https://www.ampproject.org/learn/about-amp/
• CLI validator (unofficial) - https://www.npmjs.com/package/amp-validator
• Trumping Responsive Design? - http://searchengineland.com/amp-one-year-old-growing-fast-will-ultimately-trump-responsive-design-260691
• AMP Cache - https://www.ampproject.org/learn/about-amp/#google-amp-cache
• Supported Platforms - https://www.ampproject.org/learn/who/
• Case Studies - https://www.ampproject.org/case-studies/
• AMP Cache API: https://developers.google.com/amp/cache/overview
• AMP Validator Extension: https://chrome.google.com/webstore/detail/amp-validator/nmoffdblmcmgeicmolmhobpoocbbmknc?hl=en
• AMP Chrome Extension - https://chrome.google.com/webstore/detail/amp-validator/nmoffdblmcmgeicmolmhobpoocbbmknc
• Wordpress Extension - https://wordpress.org/plugins/amp/
• AMPBench - http://ampbench.appspot.com/

Summary

Harry Roberts (@CSSWizardry) talks with us about scaling CSS in code and across large teams. We also discuss the CSS in the Web Platform standards, the history of CSS, refactoring code, as well as projects like Houdini which aims ‘to jointly develop features that explain the “magic” of Styling and Layout on the web.’

Resources

• Harry’s website - http://csswizardry.com/
• Github - https://github.com/csswizardry
• The 3 I’s of refactoring - http://csswizardry.com/2016/08/refactoring-css-the-three-i-s/
• Mixins better for performance - http://csswizardry.com/2016/02/mixins-better-for-performance/
• Houdini W3C Drafts Wiki  - https://github.com/w3c/css-houdini-drafts/wiki
• What is Houdini? - https://www.smashingmagazine.com/2016/03/houdini-maybe-the-most-exciting-development-in-css-youve-never-heard-of/
• Jen Simmons on Feature Queries in CSS - https://hacks.mozilla.org/2016/08/using-feature-queries-in-css/
• CSS Triggers - https://csstriggers.com/
• The languages that were almost CSS - https://eager.io/blog/the-languages-which-almost-were-css/
• Image issues with Base64 article - https://99designs.com.au/tech-blog/blog/2016/07/14/real-world-http-2-400gb-of-images-per-day/

Summary

It’s been awhile since we have chatted about Elm Lang. Richard Feldman (@rtfeldman), Developer at No Red Ink, returns to the podcast with Conner Ruhl (@connerruhl), Developer Operations at Carfax, in his podcast debut. The two Elm fanatics chat about their experiences with Elm and how it’s made their productivity exponentially better.

Resources

• Elm - http://elm-lang.org/
• Richards Github - https://github.com/rtfeldman
• Elm in Action - https://www.manning.com/books/elm-in-action?a_aid=elm_in_action&a_bid=b15edc5c
• JSAir: Typed Functional Programming in JS - http://audio.javascriptair.com/e/034-jsair-typed-functional-programming-in-javascript-with-alfonso-garcia-caro-richard-feldman-phil-freeman-and-jordan-walke/
• JSJ 175: https://devchat.tv/js-jabber/175-jsj-elm-with-evan-czaplicki-and-richard-feldman
• JSJ 229: https://devchat.tv/js-jabber/229-jsj-elm-with-richard-feldman