How Core Web Vitals Saved Users 10,000 Years of Waiting for Web Pages to Load — Highlights the performance achievements brought about by web vitals metrics, particularly the “exponential impact” of the combined small savings that we’ve all made since their introduction.

Osmani, Sullivan and Ueno (Google Chrome)

Splitting within Selects — We featured the ability to add an horizontal rule to a select element a few issues back. Here Adrian reminds us about the <optgroup> element, and how the two methods differ.

Adrian Roselli

📞 Calling Frontend Devs! Sentry Launch Week is Coming — Tune in daily on YouTube for new product announcements and technical demos; then join Discord to get the inside scoop from the engineers that build Sentry. RSVP for Nov 13-Nov 17, at 9 am PT to get reminders/recaps and a chance to win exclusive swag.

Sentry sponsor

Addressing Accessibility Concerns With Using Fluid Type — The clamp() function, when paired with viewport units, offers one approach to having scaling, fluid font sizing, but it’s not without some accessibility concerns. Max Barvian takes a look at the issue and offers ideas on how to help address it.

Maxwell Barvian

Minimalist Affordances: Making the Right Tradeoffs — When aesthetics trump usability and form overrules function, it’s important to know what you’re doing and the potential downsides to your choices. Lea looks at the evolution of UI affordances, minimalism, and where confusion can creep in.

Lea Verou

CSS prefers-reduced-transparency in Chrome — An explainer on how best to optimize and adjust your experience for users who prefer (or may even require) an opaque UI.

Adam Argyle

AI as a UX Assistant? — An overview of how those working in UX are using AI in their jobs, based on survey data from over 800 respondents. 92% of respondents said they are using at least one AI tool, helping with tasks such as editing, research, and ideation.

Liu, Zhang, Budiu (Nielsen Norman Group)

AI Is Empowering More Web Developers. Be One of Them! — Level up your career with these free AI focused courses covering prompt engineering, Dall-E, Chat-GPT & LangChain.js.

Scrimba sponsor

Why to Use px Units for margin, padding, and Other Spacing Techniques — Ashlee suggests that when users increase their text size, they’re not trying to make the space around text bigger.

Ashlee M Boyer

Testing with Intent: A Path to Embedded Accessibility — Proposes testing from the perspective of a user intending to do something specific and how this method can have a positive impact on both your overall testing technique and accessibility.

Sam Gladstone

Better Dynamic Themes in Tailwind with OKLCH Color Magic — How to make Tailwind CSS play nice with CSS variables, OKLCH colors, and dynamic themes.

Dan Kozlov

What Exactly is "Modern" CSS? — “When the web itself is somewhat transient, it’s tough not to think about permanence and longevity.”

Geoff Graham

Buttons.cool: A Big Collection of Web Buttons — A growing and curated collection of over a hundred nice looking, free HTML and CSS button code examples from CodePen.

Lucas Bonomi

React Components for the Google Maps JavaScript API — react-google-maps is the ‘first Google-sponsored library’ for integrating Google Maps JavaScript API components in a React app.

Mike Pegg (Google Cloud)

Maximize Tech Team Success with a Free AI-Powered Payroll — 🌍 Elevate your global team management. Run unlimited cycles for free and pay in minutes, all in one system.

Revelo Payroll sponsor

DFlex: A Drag-and-Drop Library for All JS Frameworks — A vanilla JavaScript solution with a focus on good performance and easy implementation. Try some demos here.

DFlex

capture-website 4.0: Capture Screenshots of Websites — A high-level Puppeteer wrapper to make it easy to capture screenshots of websites from Node or the command-line.

Sindre Sorhus

Shots: A Full-Featured Device Mockup Tool — Has just about everything you’ll need to create mockups for product and app shots. Upload your image then customize the background, device size, frame, border, and more. No Safari support.

Shots

A WebGL Fluid Simulation — We first linked to this beautiful demo back in 2019, but it still feels fresh and, perhaps, will now run a lot faster on your machine than it did back then!

Pavel Dobryakov