A rather geeky/technical weblog, est. 2001, by Bramus
In this video from the most recent WWDC, Jen Simmons (Web Technologies Evangelist) and Myles Maxfield (Safari and WebKit Engineer) introduce Safari 15. Meet Safari 15: redesigned and ready to help people explore the web. Discover how you can approach designing websites and apps for Safari, and learn how to incorporate the tab bar in …
Josh W. Comeau lays out the details how styled-components works internally. For so many React devs, styled-components seems kinda magical. It isn’t at all clear how it uses traditional CSS features under-the-hood, and that lack of clarity can cause real problems when things go awry. In this post, we’ll learn exactly how styled-components works by …
A simple, consistent open-source icon set designed to be used in a wide variety of digital products. The folks at Mono have released an update to their Icon Set, now totalling 177 icons in total. Available as SVGs (recommended) but can also be included as an icon font. Mono Icons →Mono Icons (GitHub) →
ORDER BY RANDOM()
Dmitri Pavlutin walks us through properly cleaning up side-effects in React: From time to time you might have difficulties at the intersection of component lifecycle (initial render, mount, update, unmount) and the side-effect lifecycle (start, in progress, complete). Tackled are fetch requests, timers like setTimeout(), debounce or throttle functions, etc. With the techniques applied, you …
inherit, initial, unset, and revert
PPK: Today we’re going to take a quick look at a few special CSS keywords you can use on any CSS property: inherit, initial, revert, and unset. Also, we will ask where and when to use them to the greatest effect, and if we need more of those keywords. Inherit, initial, unset, revert →
New in DevTools that ship with Chrome 92 (selection): A new CSS grid editor (pictured above), similar to the Flexbox editor which shipped with DevTools in Chrome 90 Support for const redeclarations in the Console — Oh, didn’t know I needed this! Source order viewer Enhanced CORS debugging support Lighthouse 7.5 [Experimental] Protocol monitor — …
A common thing to do regarding font-sizing is to use Viewport Unit Based Typography, nowadays often combined with CSS min() or clamp(): :root { font-size: min(calc(1em + 1vw), 4em); } However, as Sara Soueidan details, Safari doesn’t co-operate here: In Safari on macOS, the fluid text wasn’t really fluid—resizing the viewport did nothing to the …
Continue reading “Viewport Unit Based Typography vs. Safari”
Jerod Santo: There are plenty of times in my career when I’ve stored a boolean and later wished I’d had a timestamp. There are zero times when I’ve stored a timestamp and regretted that decision. Hear hear! Over the years I’ve come to include 9 meta fields for most of the tables I create: added_at, …