Recording date: August 25, 2020

John Papa @John_Papa

Ward Bell @WardBell

Dan Wahlin @DanWahlin

Craig Shoemaker @craigshoemaker

Alan Davalos @AlanGDavalos

Brought to you by* ag-Grid * Raygun

Actionable error, crash and performance monitoring. Raygun gives you visibility into how users are really experiencing your software. Detect, diagnose and resolve issues with greater speed and accuracy.

Resources:* Web Components * Shadow DOM * Render HTML with Vanilla JavaScript and LitHTML * CSS Encapsulation * lit-html * Polymer Project * LitElement * LitElement with Vue.js * Model Viewer * Iooxa * Haunted * Defining a property in LitElement * Events in LitElement * Web Component Benchmark * FAST * Vanilla JavaScript and HTML - No frameworks. No libraries. No problem * Web Component Benchmark * Open WC

Cool Components (LitElement)

• Modelviewer
• Stripe Elements
• WiredJS
• Chessboard elements
• Uni Virtualizer
• Iooxa
• Apollo Elements
• Lottie Player

Cool Components (Not LitElement)

• CSS Doodle
• Shader Doodle
• Block Link
• Button Element on Google Pay

White Label Components

• Lion
• Generic Components
• Alan on Dev.to

Timejumps 01:32 Guest introduction * 02:50 What is LitElement? * 07:17 What is CSS encapsulation? * 10:18 Sponsor: Raygun * 10:49 Wrapping everything into a component * 13:34 How does LitElement help with templating? * 22:57 Is LitElement able to integrate with other components? * 35:56 How do you define an attribute value? * 40:33 Sponsor: Ag Grid * 41:34 How does Fast compare with LitElements? * 47:42 Where to go to learn more * 50:13* Final thoughts

Podcast editing on this episode done by Chris Enns of Lemon Productions.