Web Components Are Not the Future

A few years ago I wrote an article suggesting that Web Components might not be the most beneficial direction for Web development to head. It was a soft-handed look at where they made sense and where things fall apart. It wasn't geared as a "us against them" argument and I hoped people would come to reasonable conclusions for themselves.

Full article

Read More

GitHub trick to find the commit that deleted a file

There are variations on this command to control how hard you want to look, and which branch you want to look in, but that’s the basic idea. But what if you want to do this on a hosted repo?

Full article

Read More

Why we developed the Node.js reference architecture

Welcome to this new series introducing the Node.js reference architecture from Red Hat and IBM. This article is an overview of our reasons for developing the Node.js reference architecture—both what we hope the architecture will offer our developer community and what we do not intend it to do.

Full article

Read More

Vim for React Developers

Vim has been around for over 30 years, and vi (which Vim extends) almost 50 years. So why does it feel like everyone is talking about Vim right now? There’s been a Vim renaissance lately from the popularity of Neovim and its growing community.

Full article

Read More

Component Composition is great btw

When I first learned about React, I heard about all of its advantages: Virtual DOM is super fast, one-way data flow is very predictable, and JSX is ... an interesting way to put markup into JavaScript. It's easy to miss this advantage if you've always been used to it.

Full article

Read More

Compile and run C in JavaScript

From compression to cryptography to networking to the web browser you're reading this on, the world runs on C. If it's not written in C, it speaks the C ABI (C++, Rust, Zig, etc) and is available as a C library. C and the C ABI are the past, present, and future of systems programming.

Full article

Read More

Storage Disaggregated Databases and Shared Transaction Log Architecture In Comparison

There are two great papers published recently regarding database storage architecture:Understanding the Performance Implications of the Design Principles in Storage-Disaggregated Databases — Xi Pang et. al., Sigmod, June 2024 (I will call it the “LogDB” in this post, a term from the paper). Taming Consensus in the Wild (with the Shared Log Abstraction) — M. Balakrishnan, ACM SIGOPS Operating Systems Review, August 2024 (I will call it the “shared log” in this post to differentiate from the above)

Full article

Read More

Introducing TanStack Router

TanStack Router is an incredibly exciting project. It’s essentially a fully-featured client-side JavaScript application framework. It provides a mature routing and navigation system with nested layouts and efficient data loading capabilities at every point in the route tree.

Full article

Read More

Your company needs Junior devs

Getting coffee with a bunch of local tech leaders, I surprised myself with how stridently I argued why companies should hire junior engineers. Lately, BigTech only wants elite squads of Staff devs that can “hit the ground running” on the big (often AI) initiative.

Full article

Read More

Cleaner JavaScript promises with safe-await

Nested try/catch blocks are a common pattern in JavaScript when working with promises. However, they often lead to hard-to-read and maintain code. This code is hard to read and maintain. The final return result is buried halfway through the script, making it difficult to trace error handling.

Full article

Read More

A milestone for TypeScript Performance in TanStack Router

TanStack Router pushes the boundaries on type-safe routing. The router's components such as and its hooks such as useSearch, useParams, useRouteContext and useLoaderData, infer from the route definitions to offer great type-safety.

Full article

Read More

Optimising for High Latency Environments

Last week, I posted a short update on LinkedIn about CrUX’s new RTT data. Go and give it a quick read—the context will help. Chrome have recently begun adding Round-Trip-Time (RTT) data to the Chrome User Experience Report (CrUX).

Full article

Read More

How Infinite Queries work

This week, a very interesting bug report was filed for Infinite Queries in React Query. It was interesting because up to this point, I firmly believed that React Query doesn't have any bugs.

Full article

Read More

Hey, this is Hono's RPC

The web framework Hono is often compared to another popular JavaScript framework, Express. Both can do similar things, but Hono has an advantage: it supports TypeScript as a first-class.

Full article

Read More

Svelte 5 signals fix its glitchy and inconsistent reactivity

Engineering is all about tradeoffs, and as Rich Harris said in this interview, Svelte before version 5 was overly focused on the first 5 minutes of the developer experience. Svelte 3's apparent simplicity is full of subtle complexity.

Full article

Read More

Claude 3.5 Sonnet vs GPT-4o — An honest review

Anthropic, the company behind the Claude series of models, has released Claude 3.5 Sonnet. It comes at a time when we all have accepted GPT-4o to be the default best model for the majority of tasks like reasoning, summarization, etc.

Full article

Read More

Why GitHub Actually Won

A few days ago, a video produced by @t3dotgg was posted to his very popular YouTube channel where he reviews an article written by the Graphite team titled “How GitHub replaced SourceForge as the dominant code hosting platform”.

Full article

Read More

Zustand adoption guide: Overview, examples, and alternatives

Since the rise of dynamic applications, state management has been a primary concern for developers using modern frontend frameworks to build SPAs. State management solutions enable developers to share data locally in a component and globally between the multiple pages of an application.

Full article

Read More

Best practices for cost-efficient Kafka clusters

In today's data-driven world, Apache Kafka has emerged as a cornerstone of modern data streaming, particularly with the rise of AI and the immense volumes of data it generates.

Full article

Read More

From Parcel to Vite: A short story of a 100K LOC migration

We have three main frontend projects at Logto: the sign-in experience, the Console, and the live preview. These projects are all in TypeScript, React, and SASS modules; in total, they have around 100K lines of code. We loved Parcel for its simplicity and zero-config setup. I can still remember the day when I was shocked by how easy it was to set up a new project with Parcel. You can just run parcel index.html and boom, all necessary dependencies are installed and the project is running.

Full article

Read More

Sticky Headers And Full-Height Elements: A Tricky Combination

Sticky positioning is one of those CSS features that’s pretty delicate and can be negated by a lot of things, so here’s another one to add to your mental catalog: Sticky elements don’t play nicely if they have to coordinate with other elements to make up a combined height, like 100vh. Philip Braunen explores why this happens and presents a solution to fix it.

Full article

Read More

Oops, I accidentally made our website faster by switching to Remix

Echobind cares very much about using the right tools for the job, but we’re pragmatic enough to know when it’s worth while to migrate tools and services to save a couple of bucks.

Full article

Read More

The web's clipboard, and how it stores data of different types

If you've been using computers for a while, you probably know that the clipboard can store multiple types of data (images, rich text content, files, and so on). As a software developer, it started frustrating me that I didn't have a good understanding of how the clipboard stores and organizes data of different types.

Full article

Read More

React and FormData

Learn React's newest and yet oldest standard for accessing form data, and the tricks to use it with TypeScript. When you learn how to access form data in React, historically you would have learned about controlled and uncontrolled fields.

Full article

Read More

An SSR Performance Showdown

Server-Side Rendering (SSR) is an often overlooked aspect when building high-performance web applications with Node.js. During my time consulting, many engagements centered around debugging Node.js performance issues. In these scenarios, the culprit is almost always SSR.

Full article

Read More

The AI Driven Development Glossary

As I covered in the introductory article, “The Art of Effortless Programming” (currently being expanded into a book of the same name), AI Driven Development is the process of building software leveraging AI to produce source code or applications, largely automating tasks like code generation, documentation, testing, etc. It can produce profound improvements in productivity, up to an order of magnitude or better.

Full article

Read More

Preloading files to reduce download chains in the browser

I made a little update to the site today to fix how browsers were loading files needed by other files. The custom font I use and the random quote in the header loads in slightly faster now because the browser is downloading all the files it needs at the same time.

Full article

Read More

The future is standalone!

Angular v19 will make standalone: true the default for components, directives, and pipes. In v14 we introduced a developer preview “standalone” feature, which made it possible for the first time to build an application that didn’t rely on NgModules.

Full article

Read More

Web Workers, Comlink, Vite and TanStack Query

I've written previously about combining Web Workers and Comlink. I recently found myself needing to use Web Workers again. As I picked them up this time I found myself making some different choices, now I was working in a codebase that used Vite to build.

Full article

Read More

Tips from 8 months of TanStack/Router in production

On my last day at Tia I wrote a master vision doc for our TanStack Router app. Here are the parts I can share. These are battle-tested patterns and lessons learned from using TanStack Router in production since before v1.

Full article

Read More

How I made our React app more performant (includes INP)

I've been trying to reduce the number of re-renders in one of our features at work. It's a bit heavy on low-end phones. I ended up going down a rabbit hole of trying to understand re-renders in React. It's been quite fun.

Full article

Read More

Governing data products using fitness functions

Decentralized data management requires automation to scale governance effectively. Fitness functions are a powerful automated governance technique we've applied to data products within the context of a Data Mesh.

Full article

Read More

Good Retry, Bad Retry: An Incident Story

Sometimes, a seemingly simple and obvious solution can lead to a series of problems later on. This is especially true when adding retries. My name is Denis Isaev, and I’d like to share my experience dealing with reliability issues caused by retries.

Full article

Read More

Thinking Like an Architect

Key Takeaways Architects aren't the smartest people on the team, they are the ones making everyone else smarter. An architect is an IQ amplifier. Riding the architect elevator means connecting the penthouse with the engine room.

Full article

Read More

Unified Grid: How We Re-Architected Slack for Our Largest Customers

All software is built atop a core set of assumptions. As new code is added and new use-cases emerge, software can become unmoored from those assumptions. When this happens, a fundamental tension arises between revisiting those foundational assumptions—which usually entails a lot of work—or trying to support new behavior atop the existing architecture.

Full article

Read More

A bundler story: migrating from Webpack to Rspack

Here at Alan, we have been using Webpack for years. While it has served us well, it has become a bottleneck for development. We recently completed the migration to Rspack, a Rust alternative promising better performance. This is a short story of our journey and learnings.

Full article

Read More

My Architecture Drivers

I don’t feel like an authority or an expert. I prefer to think about myself as a practitioner. Our industry is filled with self-proclaimed experts; we need more doers. For similar reasons, I was reluctant to call myself an “Architect” for a long time.

Full article

Read More

Component testing in Storybook

Over the past decade, web UI technology has evolved by leaps and bounds. In spite of that, it’s harder than ever to build/maintain a production UI in 2024. At Storybook, we work with thousands of the top UI teams around the world, at places like Microsoft, Supabase, and JPMorganChase.

Full article

Read More

5 Wasm Use Cases for Frontend Development · Frontend Dogma

WebAssembly—or Wasm—is gaining ground as a frontend development option. How should you consider applying it? Multiplayer gaming keeps gaining popularity and shows no signs of slowing.

Full article

Read More

How Micro-Frontends are reshaping Modern Web Architecture

Are you frustrated with slow deployment cycles, tightly coupled dependencies, and the cumbersome nature of managing monolithic front-end codebases? These common issues plague many development teams, leading to decreased productivity and delayed project delivery.

Full article

Read More

Why Playwright is less flaky than Selenium

Yes, this is a link post to my own post on switching Rails system tests from Selenium to Playwright, which is newer, faster, and by all accounts I've ever heard from anyone who's used both of them: better.

Full article

Read More

How To Create An NPM Package

In this guide, we'll go through every single step you need to take to publish a package to npm. This is not a minimal guide. We'll be setting up a fully production-ready package from an empty directory. This will include:

Full article

Read More

Regexes Got Good: The History And Future Of Regular Expressions In JavaScript

Although JavaScript regexes used to be underpowered compared to other modern flavors, numerous improvements in recent years mean that’s no longer true. Steven Levithan evaluates the history and present state of regular expressions in JavaScript with tips to make your regexes more readable, maintainable, and resilient.

Full article

Read More

How to make your web page faster before it even loads

As developers (and as front end developers in particular), we usually talk about web performance in the context of measuring what happens when we start to see things appear in a browser window, and when we can consume content or interact with the page.

Full article

Read More