 What is my personality? A plus, that's an A plus. Yeah, your personality is correct. Like, because your personality is correct. Well done, it's not defective, you can keep it. It doesn't need to go into the store for repair. Who are you and why? Yes, very well, thank you for asking. I am Monica and because I can be, somebody has to be, so it can only be me. That's a good answer. We're happy with that. Ah, one deep. What do you talk about? What is your plan for IO to... What sounds are you going to make on stage here? Mouth sounds. Mouth sounds? That's good, because I tried a different way. Did not go well. Not a popular session I've heard. I am making mouth sounds about the PWA starter kit. So my team has been building this awesome bunch of templates that you can use and you can pick them up and you can build a PWA. And we try to do most of the heavy lifting for you so that you don't have to. So this is a kind of similar tool to, like, a yeoman or, like, pre-axialized, that sort of similar sort of thing. That was possible already. So we looked at a whole bunch of CLIs and we saw what they were doing and we tried to... And your teams did the wrong. Well, a lot of them deal with starting up with a framework, whereas, like, starting up with a PWA is a little bit different, because what you're trying to do is make, like, a fairly framework-agnostic, sort of, like, work with everything of PWAs. So ours tries to use things off the shelf. So we have Redux for state management. We then, like, invent our own. We're using LitElement and LitHTML for, like, the rendering. It sounds like a framework. Yeah, a bit a little bit. It's, like, 2K. You find me a framework that's 2K. It's not a framework. So I've heard this Redux thing. Redux. Redux? Redux. Redux. I've heard that word a lot. Yeah. I still don't know what it is. I always say, like, it's, like, flux-Redux and react-Redux, like, but it's always in there, but I don't know what it is. It's a tiny state container. It's, like, a very glorified Q-value store. And it has a whole bunch of patterns. What you can do and can't do with your data. The whole point being, like, there's one source of truth. Only this store has access to your data. So that's the thing where you, like, connect your elements to it, and they get updates when something changes. Yeah. An element can, like, care about data getting updated or, like, wants to communicate the data needs to be updated, but can never, like, just poke at the data. Because that's gross. But that's what it was a React thing, right? Redux is a... No! Redux is a framework agnostic, view-independent. Shh. Think of it, James. Oh, you've practiced this. You've practiced this. I do. I have a slide. I have it in the palace of my mind. Oh, OK. So, yeah, so you can work with any framework as a data source? Yeah, which is why it's really popular, because you can just jam in and do anything. And a whole bunch of frameworks have, like, little adapters so that it makes it easier inside of their framework, but you can just use vanilla Redux with no problems. You sort of threw down, like, little element. I did. Like, that's the thing. What is... You haven't heard of it, Jay. God, it's already, like, two days old. Yeah, so, lit-html is a tiny little library that Justin wrote last year, and it basically lets you render templates in... HTML templates in JavaScript, and it's super fast, because it's super optimal about how it re-renders them and stuff like that. And lit elements... It's like the little value bindings. Yeah, yeah, yeah. And lit-element does the same thing, where we took lit-html and took all of that rendering logic and put it in a custom element-based class. So, it has, you know, things that you're familiar with. It has, like, a render method, so that gets called when your properties get updated, and whatever you put in your render method is basically magic, because in JavaScript, you can, you know, go to town if you want to. And other, like, tiny little helpers, like, life-cycle helpers that you might need in a custom element. What I know from problems, like, always, like, individual tiny little helpers, or whatever, use everything, buy everything all at once. It seems like something that you're too familiar with. And now we can, like, get rid of a lot of what, like, Polymer One used to have, because four browsers almost have custom elements. So, yeah, what is the status in terms of that? Because I just had to say, you know, my project, ServiceWorker, has just shipped in all browsers. So, where are we with your projects? I was at IE11 doing it. Oh, yeah, okay. IE11. IE11 doesn't have it. So, we have Chrome. We have Safari. Good. We have custom elements in Firefox behind a flag, and I've heard ChatterDom is very close. Oh. Okay. Rumors. And that is the end. Good one. I mean, and, like, probably Opera End. Oh, because, yeah. All the Chrome. Yeah, all the Chrome. Yeah. We do not have Edge. We have Interest from Edge, but not Implementation from Edge. What's the state of polyfills there? I mean, people wanted to use this stuff today. They exist. Good. That makes it for a long time. Right? Yeah, so polyfills have existed for a long time. We've been up, we've updated the polyfills to work with modules now that HTML imports are kind of on the dying end. So, we've switched to using modules for everything, and the polyfills also work with modules and don't try to import HTML imports and stuff like that. So, with the HTML imports, that would have your, like, your styles in there and then the definitions for your custom elements. Yeah. How does that look in a module world? So, in a module world, all of that looks together, but in a giant, you know, template JavaScript literal. Oh. This is what a template literal looks like. I mean, yeah, with little HTML, it makes sense because you already have your markup in an HTML template tag string literal. Yeah. Anyway, so it can just add some styles. Yeah. Yeah. Put the markup in there. So, we have the Shadydom to work with that so you can, like, you can have a module that exports a style known with all its goodness and, like, import it as a squiggle inside of your render function. I think that's actually proper keyword. It's a squiggle. What do you call the squiggles? Curly braces? Yeah, squiggles. Yeah, squiggles. Import it with a squiggle. I like that. That's, like, import it with a squiggle. That's your new tagline for Polymer. Thank you. Oh, yeah, that's good. So, like, I've been doing some work with web components recently, and my feeling is, like, the polyfill for, like, straight-up custom elements is super light and small and great and everything's happy. And my feeling is, like, with the Shadydom polyfills... Yeah, it turns out reinventing the DOM in JavaScript is kind of really hard. Who saw that coming? It's not an easy problem, yeah. It's not an easy problem. And the problem is, is not really the DOM, it's the CSS parser and telling... Telling CSS that it needs to update and run some styles when things update. So that's what makes it hard. So if you're using all of them together, it's very easy because you get a callback when all of them have rendered and then... But mostly you have to, like, take a template and be like, hey, Shady, DOM and CSS, here's the template, do your thing so that you can vibe it with magic so that it works later. If we're building stuff now, you know, with the hope of it sort of being there in the future where all browsers are sporting these web components things, should people be sort of avoiding Shadow DOM for now? No, I like it. We should go all in on Shadow DOM? Shadow DOM is very good if you need Shadow DOM. Shadow DOM gives you encapsulation. That's the worst tagline I've seen in my life. No, Shadow DOM hides you in a corner is probably the worst tagline. I like it if, you know, Shadow DOM, it's there if you need it. That's a very wholesome tagline. So think about it, if you're a reusable component library, you're a botan or Ionic and you're making a button or you're a design system instead of a big company, you're making a button, that button has to always be that kind of shade of blue, you want Shadow DOM for that. You don't want anybody like poke and prod and it'd be like, your shade of blue is slightly incorrect, I'll just add my 14th shade of blue to this application, right? You want Shadow DOM for that. But if you're building like the top view of an application, maybe you want something like a jQuery plug-in to work in there, maybe that's not gonna work with Shadow DOM, maybe that's a thing that you don't want encapsulation for. So they, I tried to build a web component of like doing syntax highlighting. Yeah. So just an element, put your code in, this syntax highlights it. And it felt like Shadow DOM was a good choice there because it's gonna hide all of those extra elements that I needed to do that syntax highlighting. Yeah. But I was worried about like, are the amount of like extra polyfilm gonna need to do that? Also, how do I get user styling in there if they wanted to change this? Oh, me and you, I have exciting news for you. Ready. I'm not, no, I'm not ready. Are you ready? Are you ready? Yeah, I'm ready. Okay. There's a new spec, I'm very excited about it. It's called part and theme and it basically works how? Part and theme. Part and theme. Okay. They come together as a couple. They come as cousins. As a couple? Oh gosh. No, this is sounding really bad already. So there are a couple, there are cousins. No. And this is something we all want? No. I think we shouldn't shame them. You're a monster. No, so part is basically, when you're building a custom element, it lets you like specify little divs that you might or like little elements that a user might wanna style and you put a part on them and you give them a name. Say if you're an input element, you would call them a WebKit placeholder or WebKit spinner up and WebKit spinner down. Those are basically the parts that input exposes for styling. So then you could do this too as a custom element and you'd be like, these are the best that you can style and then you can like use them. They're like, you can use like pseudo selector and hovers and shit like that on them and they work. So the fun fact is that we invited you to the CSS working group because of these two new things. Yes. And then we didn't talk about them. Correct. But then I learned how layouting works, so it's fine. You're also a member of the emoji committee. And that's something where we actually know what's going on. Subcommittee, thank you. Emoji subcommittee. Sorry. Yeah. So how is there no shark emoji but there is a dinosaur emoji? Do you know how much people have whined for the dinosaur emoji? Do you know what you've asked for the dinosaur emoji? No, I don't. But it's not a real animal. I mean, it's a real one. It doesn't exist anymore while a shark. There's floppy disks and they don't exist anymore. That's art. Oh. Emoji get accepted based on how many people, it's not necessarily how many people request them, but how popular that concept is. OK. And if you search for dinosaur on Google, you will find a bunch of results because a lot of people talk about dinosaurs. And when you're trying to take somebody, you would like a representation of a dinosaur. I agree that shark should also be there. Maybe nobody proposed it. Is that what we're saying? Is that dinosaurs are more popular than sharks? I can get behind that statement. This feels a lot like Shark Week and I am uncomfortable with the statement. On behalf of all sharks out there, maybe nobody proposed a shark. We don't propose emoji. People propose emoji. We just review them. So can we get like an H2B2 or free emoji? What's the process? How do we start that? And what characters would you have to combine? So first, we need to get to Serma and Jake emoji. I'm with Zero with Joiner. Oh my God, you guys, there is this emoji. This emoji exists. It's like the two bunny boys. There were like the two bunny girls and now there's the two bunny boys. Oh, I thought for me it would have to be the boy emoji and then the white color and then the white color and then the white color and the white color again. And then it'd be like, that's Jake. Shockingly, your shade of white is not on the Fitzbastier scale quite yet. We need to invent a new color space, I think, for whatever's after HDR. The reflective color space. We've had to do all sorts of gymnastics with covers to stop me just kind of exploding the camera. Yeah, they paid no attention to Serma and I and they're like set up lighting for you for 45 minutes. Otherwise, he's just a reflector. I become lighter because the sun reflects off his face. Yeah, I burn some light bulbs in my kitchen if you want to just come hang out there. We're going to link to your talk in the show notes which you haven't given yet, but we're... It's going to be great. How will your audience have reacted by the point you've given your talk? It's going to be amazing. Best talk ever. No talking comes second to it.