Introduction to Web Components

I had the pleasure and honour to be the opening speaker for the first ever London Web Components meetup! Yay!

There was no video recording, but I remembered to record a screencast! It's a bit messy and noisy, but if you couldn't attend, this is better than nothing.

It also includes all the Q&A!


Some of the things people are worried about, which I think are interesting if you're working on Web Components in any way:

  • How can I use them in production reliably?
  • What's the best way to get started i.e. where do I start? do you migrate the whole thing with a new framework? or do you start little by little?
  • How would them affect SEO and accessibility? the best option is probably to extend existing elements where possible using the is="" idiom so you can add to the existing functionality
  • How do Web Components interact with other libraries? e.g. jQuery or React. Why would one use Web Components instead of Angular directives for example?
  • And if we use jQuery with components aren't we back to "square one"?
  • What are examples of web components in production we can look at? e.g. the famous GitHub time element custom element.
  • Putting the whole app in just one tag yes/no: verging towards the NO, makes people uneasy
  • How does the hyphen thing work? It's for preventing people registering existing elements, and also casual namespacing. It's not perfect and won't avoid clashes, some idea is to allow a way to delay the registration until the name of the element is provided so you can register it in the same way that you can require() something in node and don't care what the internal name of such module is.
Only one person in the audience was using Web Components in production (that would be Wilson with Firefox OS, tee hee!) and about 10 or so were using them to play around and experiment, and consistently using Polymer... except Firefox OS, which uses just vanilla JS.

Slides are here and here's the source code.

I'm really glad that I convinced my awesome colleague Wilson Page to join us too, as he has loads of experience implementing Web Components in Firefox OS and so he could provide lots of interesting commentary. Hopefully he will speak at a future event!

Join the meet-up so you can be informed when there's a new one happening!