surveys
surveys copied to clipboard
Devographics
State of CSS 2024 Suggestions
https://chriscoyier.net/2023/10/17/a-couple-of-new-css-functions-id-never-heard-of/
I wonder if the section about CSS frameworks (bootstrap/material/etc.) in its current state still makes sense. In the past I've tried to always keep the list framework-agnostic, but I feel like in 2024 if you do use one it's almost always linked to a specific framework (with the exception of Tailwind).
Not sure if I should embrace that and list e.g. shadcn or Chakra UI; or else de-emphasize that section altogether.
And on the opposite side of the spectrum there's also classless frameworks like https://picocss.com/ which are interesting too, but probably have far less usage…
New CSS-in-JS libraries:
- https://mui.com/blog/introducing-pigment-css/
- https://stylexjs.com/
- https://panda-css.com/
In 2023 we had these three related questions:
- Are there any existing CSS features that you have difficulties using (or avoid altogether) because of lack of support, or differences between browsers?
- What features do you feel are currently missing from CSS altogether?
- Any other pain points related to writing CSS?
Do we want to keep them? Do we want to make them freeform (less biasing but more processing work) or predefined?
In 2023 we had these three related questions ... Do we want to keep them? Do we want to make them freeform (less biasing but more processing work) or predefined?
They should definitely be kept. Regarding predefined or freeform, I think last year we had both, right? I.e. people could add more points in a custom field.
In addition to the points you mentioned, completely freeform answers probably also means less answers as many respondents might not bother to write things. On the other hand, only providing predefined options misses individual needs.
So I'd go for a mix of predefined options plus a freeform field for features not covered by them.
Sebastian
I quickly went through the release notes of all three major browsers and have these feature suggestions (not already in last year's survey, AFAICS):
- MPA View Transitions
- Scroll-driven Animations
@scope- Style container queries
:user-validand:user-invalidtransition-behaviorfont-size-adjustzoomalign-contenton block layoutscrollbar-widthandscrollbar-coloroverlay::spelling-errorand::grammar-errorlight-dark()- New values for
clip-path prettyandstablevalues fortext-wrap- Math functions (
abs(),log(),round(), etc.) - Color spaces in gradients
- Enhanced motion paths
- New media features like
display-mode: picture-in-pictureandprefers-reduced-transparency,update,scripting,overflow-block, andoverflow-inline - Alternative text for
content each-lineandhangingvalues fortext-indent- Custom Highlights API
- Fallback value for
attr() lhandrlhunitssupport()in@importfont-format()andfont-tech()in@media
Sebastian
I'd say so, as the usage results will probably be very different. Size queries are already widely available while style queries currently only work in Chrome (and Safari TP).
Sebastian
Also I know very little about Tailwind but given its popularity should we devote more of the survey to it? What could we even ask?
From skimming features in https://wpt.fyi/interop-2024 I think all the big features are already covered. What stands out is @starting-style and transition-behavior, as new features but which I suspect don't make sense on their own. The original motivation for these features was to allow popover animations.
I think that web developers mostly think about these problems as animating to/from display: none and to/from automatic height. Not sure how to best represent that in a survey.
@foolip they are slightly different than animating to/from display:none (which is currently not supported in all browsers, while @starting-style and transition-behavior are going baseline soon). I've been grouping all of these features under "entry and exit effects"
@una thanks for the correction, I don't understand all the pieces and how they fit together. Do you think there's something worth asking about here in the 2024 survey?
In the 2023 survey, for the question: "How happy are you with the overall state of CSS?" link
it would be great if developers could optionally be able to add some commentary with their vote, and for the votes to be linked to that commentary so that we can see, for example, what "happy" developers say vs "unhappy" developers.
@hvanops coincidentally @una suggested the same thing and I just finished implementing it! And adding the ability to filter comments according to the response is a great idea, it's already available for experience/sentiment questions but we could probably generalize it:
@foolip they are slightly different than animating to/from display:none (which is currently not supported in all browsers, while @starting-style and transition-behavior are going baseline soon). I've been grouping all of these features under "entry and exit effects"
I think it does seem like features worth including in the survey. But like @foolip said it's a question of nomenclature. Do we use the actual name of the property ("transition-behavior"), even though it might not be that meaningful for most people? Or do we talk about what the API can actually achieve ("animating to/from display:none")? Or find some other designation (entry and exit effects") to group all of it?
We can also do a mix of all three, such as calling the feature "entry and exit effects" but having a more explicit description/code example below.