A rather geeky/technical weblog, est. 2001, by Bramus
useDeepCompareEffect Hook: A useEffect using deep comparison
A custom Hook by Kent C. Dodds (who else?) that might come in handy for “those situations”: React’s built-in useEffect hook has a second argument called the “dependencies array” and it allows you to optimize when React will call your effect callback. React will do a comparison between each of the values (via Object.is) to …
Continue reading “React useDeepCompareEffect Hook: A useEffect using deep comparison”
Chris Coyier wants to create a Card Component in React. But then he suddenly finds himself down the rabbit hole: how flexible does he make it? What is configurable and what is not? Where to draw the line? It sounds very familiar, as I’m always pondering over things like this when writing libraries/reusable things in …
Continue reading “Component Variations: Considerations for Creating a Card Component”
Apart from the quite well known prefers-color-scheme and prefers-reduced-motion features, the Media Query Level 5 spec comes with a few more new ones. The Media Query Level 5 spec is being drafted as we speak, and it includes some really nice ones. Some of them are still being figured out, but several of them are …
Late January Puppeteer 2.1.0 got released, with native support for Firefox: The launcher now has an option to run Puppeteer with different browsers, starting with Firefox. Puppeteer can now talk to a real, unpatched Firefox binary. This is a first step towards eventually deprecating the separate puppeteer-firefox package in favor of supporting Firefox directly in …
Continue reading “Puppeteer 2.1.0, with native Firefox support”
Symfony 5 recently got released. Fabien Potencier – Symfony’s creator – has also published a book along with its release. This book – written by Symfony’s creator – lays out a pragmatic approach to developing web applications with Symfony 5: from scratch to production. Whether you are discovering Symfony for the first time or refreshing …
Nice tip by Kamran Ahmed: Find the commit that broke the tests $ git rebase -i –exec "yarn test" d294ae9 This will run "yarn test" on all the commits between d294ae9 and HEAD and stop on the commit where the tests fail — Kamran Ahmed (@kamranahmedse) February 2, 2020 If you want to go back …
Continue reading “Find the Commit that Broke the Tests with `git rebase –exec`”
esbuild – An extremely fast JavaScript bundler and minifier
Interesting work by Evan Wallace, a JS bundler/minifier written in Go. Since it compiles down to native code, it’s fast: My main benchmark approximates a large codebase by duplicating the three.js library 10 times and building a single bundle from scratch, without any caches. For this benchmark, esbuild is 10-100x faster than the other JavaScript …
Continue reading “esbuild – An extremely fast JavaScript bundler and minifier”
If you have a public repository with a Dockerfile you can have users automatically deploy the container to Google Cloud Run by adding a Cloud Run Button. It’s no more than an image that links to https://deploy.cloud.run, like so: [](https://deploy.cloud.run) Add that code to your README.md and when a visitor follows that …
React Query provides you with a set of hooks to fetch data in React. Think of pages that use pagination, infinite scroll, auto-refetching, etc. It’s backend agnostic, so sources can be REST, GraphQL, etc. Here’s an example that uses pagination import React from 'react' import fetch from '../libs/fetch' import { usePaginatedQuery } from 'react-query' export …
Continue reading “React Query – Hooks for fetching, caching and updating asynchronous data in React”
Dave Rupert: I’ve always abided in the idea that “HTML is accessible by default and then we come along and mess it up. But that’s not always the case. There are some cases where even using plain ol’ HTML causes accessibility problems. I’m going to start rounding up those HTML shortfalls in this here post …