Bookmarks

What the top 10% of dev teams look like in 2023

This is fairly transparently an ad for Linear, and most of the actual numbers seem pretty suspect, however it is a concise list of potential team metrics to measure.

September 2023
RSC From Scratch. Part 1: Server Components

Dan Abramov walks through creation of a React Server Component server & client, explaining how each piece and what it's needed for.

September 2023
Type vs Interface: Which Should You Use In 2023?

Well reasoned argument for using type over interface for types for objects in TypeScript.

September 2023
Power consumption of JPEG, WebP, and AVIF

Really interesting comparison of power usage when loading images, using Firefox's dev tools (it's built into the performance capture tool now). tl;dr: WebP comes out on top.

September 2023
Type safe CSS design systems with @property

Explainer of new ish @property in CSS, which allows variables to be declared with a "type" as well as a fallback if an override doesn't match the type. This is really useful for design systems, as you can provide more guarantees that your variables are being used correctly.

September 2023
Maximizing your impact when moving into a leadership role

The title doesn't do a good job of describing this, but it's really a decent article on how Senior/Staff can influence organisations to solve bigger, structural problems with a pretty good specific example (improving a11y).

August 2023
Core Web Vitals for Search Engine Optimisation: What Do We Need to Know?

Really in-depth look - with lots of citations - at the ways in which Google's Core Web Vitals affect search ranking. I'm sure this will be useful reference material for when SEO comes up.

August 2023
Standardizing Focus Styles With CSS Custom Properties

Controlling the outline styles via CSS variables is a really clever idea: it allows customisation of elements (either on a one-off basis, or as part of the design system).

July 2023
You might not need Jest — the Node.js native test runner is great

Looks like Node 18 has a drop-in replacement for Mocha/Jest. Looking at the docs it even supports it.only which isn't mentioned in the article.

July 2023
TIL — Node.js 18.3 comes with command-line arguments parser

We can replace minimist and friends with a built-in Node util now.

July 2023
CSS clip-path can go outside of an element

Handy little tip from Stefan, I can see this being useful in a number of ways.

July 2023
Stepping Stones not Milestones

Sets out an argument for project planning via "stepping stones" over "milestones". The argument is that avoiding a big plan-up-front (a series of milestones) in favour of stepping stones at each you can stop and chose the next stone allows for demonstrating progress but with flexibility. Each stepping stone has some kind of deliverable and moves towards the overall strategic goal. This sounds a lot like how I approached our migration to React, but frames it a bit better than "flying by the seat of my pants" :D

July 2023
Standardizing Focus Styles With CSS Custom Properties

Explains a neat CSS snippet that gives flexibility to focus outline styles using CSS variables. This allows the focus ring to be restyled based on different contexts (like buttons/form elements etc).

June 2023
Modern CSS For Dynamic Component-Based Architecture

Wide ranging article (adapted from a conference talk) from Modern CSS. Covers some global helpers, layout utilities and some specific components based on the latest CSS features.

June 2023
Measuring an engineering organization

Excellent article outlining an overall approach to engineering metrics, with a particular focus on practicality and application over theoretical purity.

June 2023
Semantics and the popover attribute: what to use when?

Article describing the different (ARIA) roles that should be attached to the new popover attribute.

June 2023
Table with Expando Rows — Adrian Roselli

Examples of handling a table with expanding rows, to show more information, in an accessible way.

May 2023
Fighting inter-component HTML bloat by Elise Hein

Lots of interesting ideas about preventing additional divs when building (largely React-based) design systems. Particularly interested in the ideas around the asChild prop, which is a really interesting workaround for issues with compound components.

May 2023
OKLCH in CSS: why we moved from RGB and HSL — Evil Martians’ team blog

Persuasive article on why OKLCH is the best of the "new" colour formats coming to CSS. The arguments are essentially: it retains the "readability" of LCH (it's fairly easy to guess what the colour from the code), it supports a much wider range of colours ("wide-gamut P3"), it prevents issues when changing colours programmatically (e.g. via a darken() function) as it models human colour perception much more closely - which also helps with preventing colour contrast problems.

May 2023
sips: Scriptable image processing system | Simon Willison’s TILs

Quick intro to a CLI tool installed in macOS by default. It can be scripted via JS, specifically the Canvas API. It also seems like it can convert WEBP into PNG fairly simply too.

May 2023