Web Components Are Your Framework's Best Friend ｜
summary
Claim: you can write your datepicker in React, use it in VueJS or even Angular. Demo actually builds a reusable custom button/date-picker using shadow DOM, slots and custom events, then wraps it with Angular Elements, Vue’s wrapper and a react wrapper. Results: Angular and Vue hit feature tests (100%), React works for basics but React fails advanced tests and needs hacks. Bundle sizes vary: Angular ~50 KB gzipped, Vue tiny but needs a global Vue runtime (~36 KB), React ~42 KB. Works now with caveats.
AI-written summary · about
chapters (24)
- 0:00Intro
- 1:38THIS TALK WILL BE
- 4:16SPECS
- 6:10ATTRIBUTES VS PROPERTIES
- 7:56CONTENT PROJECTION WITH SLOT
- 9:02NAMED SLOTS
- 11:55COMPARING FEATURE-COMPLETENESS
- 17:33REACT 17 MAYBE?
- 18:12PREACT TO THE RESCUE..?
- 20:39WRAPPING
- 22:17THE COMPARISON
- 22:53WHAT ARE WE BUILDING
- 26:31NG-CONTENT OR
- 27:11DISABLE NGZONE
- 27:44EVERYTHING IS BETTER
- 28:13ANGULAR 9 NEXT 16
- 31:04WITH VUE
- 32:52REACT IS DIFFERENT
- 33:20REACT...
- 33:48WEB-REACT-COMPONENTS
- 38:19USING WEBCOMPONENTS ALONE
- 38:58PLATFORM RESULTS
- 39:33THE PLATFORM STILL HAVE SOME GAPS
- 40:07CONCLUSION
related talks
35mFrameworks and webcomponents
34mWeb Components & Micro Apps: Angular, React & Vue peacefully united?- 34mWeb Components & Micro Apps: Angular, React & Vue peacefully united?
36mBuilding framework agnostic UI with Web Components
25mWeb components with Angular: The what, the why and the how.
21mAngular Elements Make The Best React Components
26mA look into the future: Angular Elements
40mAngular, React, Vue and Co. – peacefully united thanks to Web Components and Micro Apps