Something like manipulating the speed of an animation isn’t a big deal, but it’s harder when the animation is *already running*. We got tricks.
Svelte is already quite lightweight and fast, but Svelte 5 still overs big improvements in fine-grained reactivity, meaning re-rendering as absolutely little as possible.
Support for the relative color syntax in CSS is across the board now (go interop!), so here we look at some basic (and still very useful) use cases, like applying alpha to a color you have on hand.
Native support for decorators is inevitable! It simplifies augmenting class methods, which can help with things like logging, memoization, debouncing, and dependency injection.
Out with slots, in with snippets.
Figma has support for variables, and they work with the various typography features you may want to set. For instance, you could create a variable called “Header Font” with a value of “Ideal Sans” and use it in many places.
I said to myself I said what if I used container units for every single unit in a design? I was wondering, partially because I thought the answer might be well, everything will probably scale really nicely then. Container units, in case you haven’t heard of them, are unit (like px or rem, but more […]
It’s a fun idea to do a full-on March-Madness style-playoff bracket for choosing a coding font. Still a Monolisa guy myself.
There are no obvious CSS properties or values for making a @keyframe animation wait between iterations, or have a pause before starting. But Nils Riedmann cooked up a clever way to do it using linear() animation timing. I think this is cleaner than faking it with multiple benign keyframe steps. Remember linear is not the same as linear(). The later is a function that can take any number of points and thus create any sort of easing.
These custom video (and audio) players are very nice. I like how the accommodate narrow/vertical video players and work with any video provider (even YouTube).
We might be shooting for the stars, but we’re also building on top of the magical media chrome ecosystem of player components, which does a few things for us:
- It uses web components which are compatible across web dev frameworks. Yes, even React (which can be grumpy about web components).
- It allows us to separate the player UI from the player streaming technology, so skins can be used across “players” rather than being player-specific.
Sacha Greif introducing the State of CSS 2024 results:
Let me make a prediction: we’ll look back at 2024 as the turning point between “CSS Classic” and “New CSS”.
That feels intuitively true to me, except we won’t use those names. Check out work done on CSS Levels which define CSS4 and CSS5 “eras” (which kicked off in earnest here). Officials names like this have weight and I hope it’s enough that we’ll actually start keeping these terms up to date and using them.
Check out the full survey results as well. Quick thoughts… Interesting to see Lightning CSS so low, I find it pretty sweet. I agree with the masses, anchor positioning is probably the #1 thing I’d love to see get cross-browser supported and mixins is the #1 feature I’d love to see get fully specced out.
Developer news, information, and advice — right to your feed reader of choice.
RSSHere's our page on guest writing. It's a win-win-win!
Frontend Masters donates to open source projects through thanks.dev and Open Collective, as well as donates to non-profits like The Last Mile, Annie Canons, and Vets Who Code.
