The State of JS 2022 Results

Note: These surveys should be taken as interesting anecdotal evidence of a self-selecting and non-representative sample of the dev world. They’ve made some positive changes over the years, but the participants are still overwhelmingly young white male devs from the US.

Conditional CSS

I like to think of CSS as a conditional design language. Over the years, CSS was known as a way to style web pages. Now, however, CSS has evolved a lot to the point you can see conditional rules. The interesting bit is that those CSS rules aren’t direct (i.e: there is still no if/else in CSS), but the way features in CSS work is conditional.

Sibling Scopes in CSS, thanks to :has() – Bram.us

If you want to select all elements between that .upper and .lower element, you can do so using this selector powered by the almighty :has() selector:

.upper ~ :has(~ .lower) {
    outline: 1px solid red;
}

CSS Subgrid

The subgrid value for grid-template-rows and grid-template-columns is now supported in Firefox and Safari 16+, and coming soon to Chrome. In this article, you’ll learn the ways that this feature makes grid layout even more powerful.

Common ARIA mistakes and how to avoid them

If you don't know what you're doing, you'll end up making your website even less accessible! There's a reason why the first rule of ARIA is: No ARIA is better than Bad ARIA! Use native HTML elements and attributes with the semantics and behaviour you require. Let's take a look at use cases for ARIA and common mistakes you should avoid.