Frontend Inspirations #2

• The New CSS

  What I expect to see overall is that the perception and thus the role of CSS in the design process will change from being mainly a presentational styling tool at the end of the waterfall to a tool that is being used at the heart of making design decisions early on. The value of a designer who knows how to prototype and build web components with modern CSS will therefore increase a lot.

  I can't agree more. CSS has become the most powerful design tool for the web, we must make use of it even more and together with designers.

• How eBay Made Its New Accessibility Tool — And Made It Available to All

  Several eBay teams worked together to create a plug-in that makes it easy to include accessibility in a design right from the start.

  Nice! Go and share their "Include" tool with your designers to improve UX for all.

• The ongoing defence of frontend as a full-time job

  Here’s the deal: a frontend developer isn’t a mediocre coder that only dabbles in “easy” languages like HTML, CSS and JavaScript. A frontend developer is someone who made a conscious choice to build interfaces for the unknown with a laser sharp focus on the end user’s experience.

  Yeah, even nowadays I have to fight for the importance of a dedicated frontend role quite often, when there is often no real understanding that frontend is not just JS and a "bit of CSS".

• RSC From Scratch. Part 1: Server Components

  In this technical deep dive, we'll implement a very simplified version of React Server Components (RSC) from scratch. (...) This deep dive doesn't explain the benefits of React Server Components, how to implement an app using RSC, or how to implement a framework using them. Instead, it walks you through the process of "inventing" them on your own from scratch.

• The evolution of scalable CSS

  A deep dive into the problems with scaling CSS on large projects. Understand the evolution of CSS best practices.

• Observing CSS

  Did you know you can observe CSS properties in JS? I think this is a powerful pattern, like style queries for JS. We can use this functionality to create experiences where our users define the behavior of custom interfaces within their own CSS.

  One more interesting aspect how user's could gain even more control about their UI experience.

• Modalz Modalz Modalz

  All the reasons you don't need a modal — and what to use instead.

  This is the only link to send designers when they urge you to have content placed in a modal overlay.

• Animate elements on scroll with Scroll-driven animations

  Learn how to work with Scroll Timelines and View Timelines to create scroll-driven animations in a declarative way.

• How large DOM sizes affect interactivity, and what you can do about it

  Large DOM sizes can be a factor in whether interactions are fast or not. Learn more about the relationship between DOM size and INP, and what you can do to reduce DOM size and other ways to limit rendering work when your page has lots of DOM elements.

• Can I DevTools?

  It is like @CanIUse, but for the browser devtools

• Performance Optimization Strategy in 2023

  Great list covering base HTML optimization plus CSS, fonts and JS loading strategies

• 6 CSS snippets every front-end developer should know in 2023

  Toolbelt worthy, powerful, and stable CSS you can use today.

  And this is just the tip of the iceberg of these many new features of CSS nowadays.