 Tell us, release this one, huh? Rules of Talk CSS since I learned from someone else. If you participate anyway whatsoever, you get chocolate. Throne at you. If you ask a question, you have a comment, anything, you'll get chocolate thrown at you. You may like chocolate, you may not, but you'll get chocolate anyway. Throne at you. Yes. This is to encourage participation as well as get through. This hasn't worked out so far, but why not? I will keep persisting. So Firefox 55 released a latest one. And so there is the frames timing function, which is related to CSS animations. There's actually a lot of interesting CSS animation functions that are starting to come out in the sense that they haven't been around very long. I mean, there's always been in working draft status, but browsers have been implementing them. We may or may not cover this if I can strong arm any one of my still remaining friends to talk about CSS animations in upcoming Talk CSS. A few other bug fixes. One thing that's interesting is that the CSS variables feature is enabled all the time, meaning if we are using CSS custom properties on Firefox, it's going to be forever on Firefox 55, meaning you don't have to worry that people won't be able to. As in, you can kind of, if you didn't write a fallback, you can just ask people, oh, it looks better on Firefox, but don't do that, always try a fallback. Safari Technology Preview 38 was also released, and it now has Carrot Color support. So Carrot Color is now actually very, very well supported. So if you didn't know what Carrot Color does, you know when you try to input text and then there's this blinking type thing where you're supposed to type your text. Now you can add color to it. Yeah, I'm sure there's a good reason for this. I mean, it's fun. You can make it blink rainbow colors or something, but that's always an option. So that's that. A few other interesting CSS properties. Basically, the point of this segment is to just inform you all of the various CSS properties that exist, but you may not know because the last time I checked, there are 499 distinct CSS properties, and I'm sure nobody knows all of them. So there's this thing called the CSS Type OM Working Graph. This one is more of a CSS object model, so it's actually very technical, the specification. Not so much for you to actually use in your work, but it's more related to when you use JavaScript. So interested people can click on the link and read the spec, although I'm very sure none of you do, even though I talk about the spec every month. There's also the CSS Containment module, which I mentioned a couple of times because now this particular specification is constantly being worked on, so there are updates all the time, but the Containment module, basically, it helps in terms of performance in that if you're not too familiar with how browsers render things, basically what happens is that it comes in stages, so you first have to lay up, then paint, then composite. So what this particular property does is that you can tell the browser if this particular element can be rendered independent of the rest of the page. So in a long story short, you don't have to re-render the entire page if you change something on a particular section. So in a sense, it kind of saves in terms of the browser doing work because it's like, okay, I only have to re-render this tiny bit. It's now candidate recommendation status, so it's kind of advanced along the spectrum now, so maybe this will be out, I don't know, next year. CSS Text Module is now at level three, so the Text Module is the specification that covers all your white space, your word break. Okay, it's not called word break, break something, so that's the specification that covers those things. And so they have updated it a bit if more with regards to the breaking because that's a hyphenation. Hyphenation, basically now there's an algorithm where you can sort of manually indicate that you want your word to be broken up. You can also let the browser do it for you, but it may or may not end up where you want it to break, things like that, so this particular specification controls those type of things, and it's still working well, so I don't think most of... I think Chrome has a lot of the hyphenation stuff, but maybe not other specs. Last one is Scroll Snap Module, which is the scroll jacking module. This one, this is actually quite fun in that you can actually sort of use CSS to scroll jack. I mean, I know some people say it's not a good idea, but I mean, it works when you want to... Maybe you have an image gallery, which is like horizontal scrolling. It actually works very well with keyboard, so you can just, oh, keyboard fresh right in there like... nicely, yes, yes, sir. What do you say? It still sucks, but I've been trying to find and it's fine, it's great, but the problem there is your mouse wheel is double... It's really buggy. It was buggy when I talked about it last year, so... So, what about in Polyfill Chrome... The Polyfill wasn't updated, so it doesn't work with the newest value, so... And sometimes the implementation is buried between browsers, so Firefox, for example, let's say like, from a whole page to log, and then you go to the next one, and you do one scroll, they all tick, and it goes to the next one in Firefox, whereas in Safari, it's more like flick over multiple steps, then it makes it so that it's horribly implemented right now. Okay, folks, so the moral of this conversation is this specification is still being worked on, so when a specification is being worked on, it's like if you write it this way, this month, and then when they update it, then the keyword doesn't work anymore. So, it's good to try it out, but don't expect it to work correctly. Ta-da! Okay, so that's that. So I want to introduce our first speaker, Maure, who is going to talk to us about how to speed up your animations. So let's welcome Maure.