Node.js 20.12.0 introduced a native way to load environment variables from a .env file using the loadEnvFile function from the node:process module. This is a great addition because it eliminates the need for third-party libraries like dotenv for this common task.This post will discuss how to use the loadEnvFile function to load environment variables from a .env file in your Node.js applications. It will also cover some limitations and workarounds for the function. Using loadEnvFile The basic usage is simple. Use the loadEnvFile function to load environment variables. The function takes an optional parameter that specifies the path to the...
A significant limitation of CSS multi-column layouts has been the restricted control over content flow between columns. While developers can set the number of columns, their width, and the gaps between them, controlling how content breaks and wraps remains a challenge. Previously, the primary way to influence multi-column behavior was to set a fixed height on the parent container. This approach is often impractical because content might not fit within a specified height, causing columns to overflow the container. This post covers two features in the CSS Multi-Column Layout Module Level 2 specification that address these limitations: column-height and column-wrap....
The URL Pattern API provides a standardized, native way to match URLs against specific patterns. It brings the pattern-matching capabilities found in server-side frameworks such as Express or client-side routers such as React Router directly into the browser and Node.js runtimes. This post explains the functionality of the URL Pattern API, the external tools it replaces, and why it provides a superior alternative for URL matching and routing in modern web development. How it works The API revolves around the URLPattern class. Developers can define patterns using either a compact string or a structured object, which the API then matches...
Origin Trials allow you to test and provide feedback on new or experimental web APIs before they become a permanent part of the web platform. Chromium-based browsers—such as Chrome, Edge, and Opera—use this program to test features in production environments without committing to a permanent implementation. This post explores how Origin Trials function, their built-in safety mechanisms, and best practices for implementing them in your projects. Preventing "Burn-in" In the early days of the web, browsers used vendor prefixes such as -webkit- or -moz- to test new CSS properties. This created a "burn-in" effect: developers built millions of production sites...
The W3C Recommendation process defines the lifecycle of a web technology proposal. This process involves multiple stages of review, feedback, and implementation to ensure new features are robust, interoperable, and beneficial to the web ecosystem. This post breaks down each stage of the process, explains the implications for developers, and provides guidance on navigating the evolving landscape of web standards. Why the process matters Understanding this process helps developers decide when to adopt new web technologies. Early adoption carries the risk of building on unstable APIs that might change or be abandoned. Conversely, waiting for final recommendations might result in...
globalThis is a universal accessor for the global object in JavaScript. It provides a reliable, standard way to access global variables and functions regardless of the environment executing the code. This post explains the purpose of globalThis, how it unifies access to the global scope across different JavaScript environments, and how to use it effectively in JavaScript and TypeScript projects. It also covers polyfilling globalThis for legacy environments. Purpose and functionality Before globalThis, the global object had different names depending on the runtime environment. Code designed to run in multiple environments—such as isomorphic libraries or cross-platform utilities required complex workarounds...
As generative AI evolves, the tools used to orchestrate these models must also advance. Gemini 3 provides developers with a powerful new model, but raw API calls rarely suffice for production environments. To build robust applications, you need a framework that manages state, streaming, structured data, and external APIs. This post explores how to integrate Gemini 3 with LangChain, bridge the frontend-backend gap using LangServe, and build model-agnostic applications that work across OpenAI and Anthropic. Gemini 3 and LangChain LangChain supports Gemini 3 through the @langchain/google-genai package. Because Gemini 3 maintains compatibility with existing API infrastructure, you can often upgrade...
In the modern web development landscape, performance is a business requirement. To measure success, developers often rely on tools like Google Lighthouse or PageSpeed Insights. While these tools are valuable for catching regressions and spotting unoptimized images, they often create a "green score" placebo effect. These tools measure Lab Data—a sterile, controlled simulation—rather than Field Data, which represents the chaotic, hostile reality of your actual users. Relying solely on synthetic scores is akin to testing a car's fuel efficiency on a treadmill in a climate-controlled room and expecting the same results during a rush-hour commute in a blizzard. This post...
When you build modern web applications, you often rely on third-party services like Content Delivery Networks CDNs to host essential files. While CDNs improve performance, they also introduce a vector for supply chain attacks. Subresource Integrity SRI provides a standardized defense against these risks. This post will explain what SRI is, how it works, and why it's crucial for securing your web applications. We'll also discuss the performance implications of using SRI and how to implement it effectively, even for resources hosted on your own server. Finally, we'll provide a TypeScript script to generate SRI hashes for your assets. What...
Designing APIs is difficult; designing good APIs is even harder. While web developers often focus on the implementation details of applications, the design of the APIs they create profoundly impacts usability, maintainability, and overall success. Developers design APIs regardless of the application type. The principles of good API design apply whether building a RESTful API for a web service, a GraphQL API for a mobile app, a web component, or a simple function meant for broader codebase consumption. This post explores principles of good API design and how to implement them in projects, drawing inspiration from Lea Verou's post Bluesky...
