Gray Norton

@graynorton
238 Followers
167 Following
101 Posts
Web guy, democracy defender, Proportional Representation advocate, progressive, humanist, singer. Opinions mine.

👀👋🏼 New Article!

Four new CSS features for smooth entry and exit animations

i.e. animating to and from display: none and to/from the top layer

The new features include:

1. Animate display and content-visibility (Chrome 116+).
2. `transition-behavior: allow-discrete` (117+)
3. `@ starting-style` rule (117+)
4. `overlay` property (117+)

There's also a bonus section on how to create these effects with view transitions 🙂

https://developer.chrome.com/blog/entry-exit-animations/

Four new CSS features for smooth entry and exit animations - Chrome Developers

Learn about new capabilities that enable smooth transitioning of discrete animations and between the top layer

Chrome Developers

The #webComponentsCG is currently doing research for its 2023 APIs and Specs Report by looking into the following (alphabetical):

- Cross-root Aria
- Custom Attributes
- Custom Enhancements
- Declarative CSS Modules
- DOM Parts
- Element behaviors
- Form-Associated Custom Elements (as well as making them submit buttons)
- :has-slotted
- Open styling of shadow roots
- Scoped Element Registries

If you're interested in any of these and more, join the convo: https://discord.gg/YmrNQ4rYJz

#webComponents

Join the Web Components Discord Server!

Check out the Web Components community on Discord - hang out with 473 other members and enjoy free voice and text chat.

Discord
@knowler @noleli Pretty sure it’s for ergonomics—no need to create and manage an observer for this common case—and (more importantly) performance reasons. Although MOs may be relatively cheap, they’re not free; you probably don’t want a large DOM tree full of them, and since the browser code to implement slotting already knows whenever a change occurs, it’s cheaper just to fire an event.
@mike @mattwilcox @leaverou @slightlyoff Per my recollection (and just confirmed via Wikipedia), React actually predates Vue. They’re both ~10 years old.
messing around with view transitions; amazing how simple it was to make this “analog tv changing channels” transition happen

@smartwatermelon In California, there is a (small) recycling fee specifically targeting electronic devices with screens—I’d forgotten about this, so thanks for the reminder! But I had in mind something more significant and more broadly applied.

In a sane world, for example, it would make economic sense to get a microwave oven with a faulty door switch repaired rather than dump it and buy a new one…

🤔What if manufacturers were assessed a disposal tax every time something they produced ended up in a waste management facility?
LOOK. This is just a regular ol' website. No JavaScript whatsoever. Navigation pages with clicks <a> links to other HTML pages. The most basic website in the world. Yet, with a few lines of code to activate View Transitions, KAPOW.
As of iOS and iPadOS 16.4, web apps saved to your Home Screen support badging!
We've heard questions about the deets, so we wrote a blog post with the deets.
https://webkit.org/blog/14112/badging-for-home-screen-web-apps/
Badging for Home Screen Web Apps

Along with the many other features for web apps on iOS and iPadOS 16.4, WebKit now includes support for the W3C’s Badging API.

WebKit

Remember when a pandemic happened and the government was like, "Oh shit. Freelancers can't claim unemployment benefits. We should fix that." And then freelancers got $600 a week? And then the govt was like, "Emergency over. Freelancers are fine now."

Remember that?

Good times.