Suspense has been a feature in React since v16.6.0. Despite this, I haven’t seen much of it in action beyond limited applications of “suspense-enabled libraries”. The React team seems to think Suspense is so incomplete that the entire API remains undocumented. I think that purposefully hiding APIs in documentation is silly, but fine! I’ll play their game! Let’s build a Suspense-enabled library, and use it. We will peel back the curtain of Suspense along the way.

React v18.0 has broken ground by introducing a long-awaited feature: Concurrency! Unfortunately, despite a deluge of resources explaining how to use it, explanations of how it works are sparse. As it is a low-level feature, it’s not critical to understand React’s idea of concurrency, but it doesn’t hurt!

JavaScript runs in a single-threaded environment with an event loop, an architecture that is very easy to reason about. It’s a continuous loop executing incoming work. Synchronous work runs immediately; asynchronous work runs when there is no synchronous work to left to perform. This design implies that performing synchronous work is a Big Deal: for every continuous moment it runs, the event loop cannot perform any work – none!

Before the introduction of contexts and hooks in React v16.8, Higher-Order Components (or HOCs for short) were a common sight. Today, it is an under-used pattern. While the concept presents infinite possibilities, practical applications should be limited to transparently adding wrappers or logic.

If you use GitHub Actions for deployments in a “push to master, deploy to prod” sort of flow, you’ve likely wanted to avoid deploying conflicting refs. By default, GitHub Actions will want to run a deployment for every commit as soon as you push it. Concurrency groups help, but it requires a bit of creativity to get it running smoothly.

I recently dealt with a tricky TypeScript situation. GraphQL servers have a feature where for any response it returns, it adds a __typename within every object corresponding to its type’s name.

Is it possible to remove them without rewriting the type definition by hand?

Squeal is a library designed to allow querying raw SQL directly from the front-end without compromising security. This document intends to formalize the design for the Squeal library and eventually become a complete specification.

I recently did some work on a VS Code extension whose purpose is to handle rich pastes. It prompted me to survey different copy-pasting libraries and the state of the NPM ecosystem as a whole.

While Google does publish scripts to help with the installation, it requires a non-trivial depth of knowledge to do right. After struggling with it for many hours, I wrote a guide for personal future reference.

I recently returned to those notes to entirely automate the process using GitHub Actions. The work is open-source and available on GitHub.

I like DevOps. More specifically, I like good DevOps. For example, I love Heroku host a few dozen free apps there. Salesforce must be raking in boatloads of cash from every business that also loves Heroku, but I can’t justify spending $7 per app per month. I have 21 apps. It would cost nearly 150$ per month to run them on the hobby tier. I tried to recreate something similar to Heroku for years, and I was pretty happy with where it got me.

IDEs will give you the world as long as you stay inside of it. VS Code makes file management a breeze in your workspace but bringing in anything from the outside world will not be frictionless. Inserting a screenshot into a markdown document within VS Code is a multi-step process:

1. Take the screenshot
2. Save the screenshot in a folder
3. Locate the screenshot in file explorer
4. Drag-drop the screenshot into VS Code
5. Reference the screenshot from the markdown document

Nowhere near as seamless as Microsoft Word handles pasting images. What if there was an extension that could handle pastes directly?