Recently, I’ve been working on a client project built as a single-page application (SPA). Unlike server-rendered apps (where I’ve spent the majority of my time over the past few years), all the data transformations in this app happen client-side. This makes performance something we need to consider much more carefully. The app fetches data from an API that uses JSON pointers to reduce the size of…
Back in April, I gave a talk at Syd JS about lessons learned while using Tailwind to build a design system. While I’ve been a Tailwind fan for years (since version 0.5.2 !), this was my first time applying it to a design system since joining Thinkmill. The process challenged me to rethink a few things. Fun fact: I’m pretty sure the first time I heard about Thinkmill was through Tailwind super-fan…
Links Million Lint is in public beta I haven’t had a change to try this out myself, but they tout themselves on the website as as "ESLint, but for performance". I rarely have to use React devtools to identify perf issues, but using and making sense of the flame-graph can be daunting. Since this is a VS Code extension and a plugin for your React app it looks like it might help me find perf issues…
It seems I’m not very good at posting regularly, so I thought I might borrow an idea I first saw on Paweł Grzybek’s blog and try posting a monthly roundup of links. Here are my most interesting links from February. Links: Offloading JavaScript With Custom Properties Heydon Pickering makes use of applying CSS custom properties in an Intersection Observer which can then be used in CSS to apply…
I recently revived my long-dormant website as an excuse to better understand Keystatic , as well as the new Next.js app router , and server components . A few months have passed since then, and I've rebuilt the site again, this time using Astro. This post explains why. My personal website is a space to learn new things and over-engineer the hell out of what is essentially a pretty basic blog…
New lightweight zod alternative. I always feel bad about adding too much bundle weight — especially when I use zod with react-hook-form , and the react-hook-form zod resolver .
It's sad to see Netlify becoming less and less relevant. The first website I ever built was originally hosted on BitBalloon (Netlify's predecessor) and I hosted everything I could on Netlify back when I was working at Phiranno Designs . Anecdotally people don't seem to be talking about the "Jamstack" anymore. Netlify claims it's because Jamstack has become the new norm, but…
Interesting read. Not sure I entirely agree, but there are definitely some footguns with a lot of toggle designs in the wild such as relying too heavily on colour to convey information .
I can highly recommend the new podcast by PJ Vogt (former host of Reply All). It's called Search Engine and the most recent episode was especially eye opening (no pun intended 😬)
This is cool, but I'm curious what prefers-contrast: less is for — I can't imagine it would be an accessibility feature (unlike prefers-contrast: more which definitely is). Is it just for people who have a personal preference for a thinner font weights?
Some positive vibes heading into the weekend 🫶 College graduation speeches are often evergreen. They can be given at any time, similar from decade to decade. Which is why Illinois Governor J. B. Pritzker’s “How To Spot An Idiot” at Northwestern’s graduation is so genius. It is the speech for TODAY
Looks like the Polaris team have been busy! Very cool to see my former colleagues Charles Lee , Dominik Wilkowski and Jess Telford listed in the credits. Super weird that this was a "members only" article on Medium though, Shopify should put this on a blog they own.
I never really thought about it before, but there's no easy way of parsing a domain out of a URL because some "TLDs" have just 1 "part" like .com and some have two .com.au etc 🤔
I personally like Seaford the most, which doesn't surprise me as it was co-designed by Tobias Frere-Jones who has designed some of my favourite typefaces such as Whitney and the slightly overused Gotham.
End of an era. i feel bittersweet sharing i’m leaving my job at meta in a few weeks. working in the react org at meta has been an honor. i am thankful to my past and present colleagues for taking me in, letting me make mistakes, helping me see my strengths, being kind, and sharing their time.
Don’t make people solve, recall, or transcribe something to log in. Amen to that. Websites that don't allow you to paste a password are the absolute worst, good to see the W3C acknowledging this.
Nice to see that pnpm can afford to pay a maintainer full time due to the donations they receive. Doubly nice to go to their website and see the Thinkmill logo listed as a sponsor. Thanks to your donations we have now one maintainer who can support pnpm full time. Give him a follow: @hvksmr1996
I kinda like this idea: I'd propose a 4-digit semver: epoch.major.minor.patch Major indicates there are technical breaking changes, but not necessarily affect many usages. The new Epoch digit indicates an overhaul rewrite or massive update that usually requires migrations. Or for marketing. Keystone gets around this by literally calling the package @keystone-6 (the epoch is right there in the…
It's interesting to see the use of psychedelics having seemingly quite positive effects on peoples mental health. Last Week Tonight had a great segment on this recently.
The transition to the new App Router in Next.js has been rough. It's nice to see Vercel acknowledging this publicly. Personally I've been enjoying using it on this site, but there are definitely some rough edges.
TIL you can use a media attribute on a <link> element to offer both light and dark mode versions of your favicon. The cool thing about this approach is that it doesn't appear to require a manual page refresh when you change modes for the favicon to switch. That's not the case with this approach which I've used in the past.
Segun Adebayo (of Chakra UI fame) has just announced the release of Panda CSS, a new CSS-in-JS library that generates utility styles at build time (instead of runtime). This looks like just the thing I've been wanting, you can still create dynamic styles like you can with Tailwind, but defining styles in objects rather than doing string concatenation makes the story around customising and…
Imagine being the CEO of Reddit, looking at what's happened to Twitter over the last few months and thinking "I like what this Elon guy is doing, we should do something similar" 🙃 Huffman also did an interview with The Verge . Gruber wrote about the Verge interview on Daring Fireball and absolutely nails it with this line: No surprise that the CEO of a company whose website is so bad that…
I’m helping to build a design system for a client, and a colleague of mine ( Matt Stow ) introduced me to an interesting component that he created, which has fast become one of my most used layout components, so I thought I’d write about it. “Track” is a layout component for distributing content horizontally. It has two “rails” (one on each end) and a flexible “center”. Once you start using this…
Most of the text you read on this website was written using Keystatic — a new tool developed by Thinkmill to manage website content. It supports human-readable Markdown (technically Markdoc), JSON, and YAML output formats. For years now, I've had a personal website because: I'm a web developer, and every framework out there has a tutorial on how to use said framework to set up a blog. I…
I was looking through the release notes for Firefox 113 and saw that they've added support for OKLCH. Firefox is the last of the "evergreen" browsers to support this new colour space. If you're wondering why this is cool, check out this article by Evil Martians . Update: Rachel Andrew recently wrote about this on the web.dev blog .
Here is a list of the tools I use for work, inspired by this post from Wes Bos . Computer / Office MacBook Air (M1, 2020) Desk: Updown Desk 180cm Bamboo standing desk Monitor: Samsung U28H75x Keyboard: Keychron K2 Mouse: Logitech MX Master 3 Trackpad: Apple Magic Trackpad 2 Coding Editor: Visual Studio Code ( Settings / Extensions ) Theme: Night Owl Font: IBM Plex Mono Terminal(s): Integrated…