标签：#Development

🎯 What a “Stacked PR” Is (and Why You’ll Want One) A stacked pull request (sometimes called a stacked PR , stacked diff , or dependent PR ) is a series of PRs that build on top of each other, each one containing a small, logically‑isolated change. main ──► A ──► B ──► C │ │ │ │ │ └─ PR‑C (depends on B) │ └─ PR‑B (depends on A) └─ PR‑A (directly on main) A is based on main . B is based on A (its head). C is based on B , etc. When you eventually merge the stack in order (A → B → C), each change lands cleanly, and reviewers can focus on one cohesive piece at a time. Why Stack PRs? Problem Stacked PR Solution Huge, monolithic PRs that are hard to review & cause long CI times Break the work into bite‑size PRs (e.g., “feature flag”, “data model”, “UI”) Inter‑dependent changes (e.g., a new API + its consumer) Each dependent change lives in its own PR, but they still get tested together because they are built on top of each other Rebasing on main constantly drags in unrelated changes Only the bottom PR needs to be rebased onto main ; the rest stay on top of it Need to ship part of a larger change early Merge the first PR in the stack; the rest stay pending until they’re ready CI resources Only the bottom PR runs the full suite against main ; higher PRs can run a lighter subset because they already passed lower‑level tests 📦 The Landscape of Tools (as of 2026) Tool / Service Key Features Installation / Setup Typical Workflow ghstack (GitHub CLI plugin) - Creates stacked PRs automatically from a series of commits. - Handles base‑branch updates, resolves merge conflicts, and can re‑stack after rebases. - Works with GitHub's GraphQL API, so you get “dependent PR” links in the UI. pip install ghstack (or brew install ghstack ). Requires a personal access token with repo scope. bash git checkout -b feature/stacked\n# create many commits …\nghstack push\n# later, after rebasing on main\nghstack rebase . | | GitTown (aka git-town ) | - git town ship can ship a stack of dependent br

Microsoft and Uno Platform have released the first stable versions in the SkiaSharp 4 series, beginning with SkiaSharp 4.148.0 and followed shortly afterward by 4.150.0. A 4.151.0 prerelease line is also available, demonstrating the project’s new approach of aligning package versions and release cadence with upstream Skia milestones. By Edin Kapić

I built a free tool that checks a supplier before you pay them. The part that took most of the work, and taught me most, was reading ten national company registers instead of relying on the EU's own VIES service. This is what I found out, mostly so the next person doesn't have to. The problem with "the VAT number is valid" VIES — the European Commission's VAT Information Exchange System — answers one question: is this VAT number currently registered. That sounds like the question you want answered. It isn't. A company that has gone into liquidation keeps a cleanly resolving VAT number in VIES. So does one that has been struck off the register. Deregistration and insolvency are run by different authorities on different timetables, and the gap between "this company has stopped being a going concern" and "the VAT number stops validating" can be months. So you can check a supplier, get a green tick, and be looking at an insolvency estate. The national registers know. VIES doesn't ask them. Ten registers, and what each actually gives you I found free, public, machine-readable-enough sources for ten countries: Bulgaria, Czechia, Estonia, Finland, France, Greece, Latvia, Poland, Romania and Slovenia. They are not equivalent, and this is the thing I'd have liked written down somewhere before I started: Six of them report company *state * — inactive, in liquidation, bankrupt, insolvent, terminated, ceased, struck off: Romania, Estonia, France, Greece, Bulgaria, Latvia. This is the valuable one. Three report whether the company is actually VAT-active — Poland, Romania, Slovenia. That matters more than it sounds, because VIES does not distinguish "this is a real company that isn't VAT-registered" from "this number belongs to nobody". The rest give you a name and not much more. Czechia, for instance, is in the ten but in neither of the other two groups. It confirms a name. That's it. Worth knowing before you build a feature around it. Poland is the interesting one Poland is the

Quotient CEO Lizzie Matusov explains why soaring AI spend often fails to improve software delivery. She presents a research-backed AI maturity framework designed to help engineering leaders move beyond vanity metrics like token usage, align organizational AI adoption, and address critical bottlenecks across the software development life cycle to deliver measurable business outcomes. By Lizzie Matusov

Version 5.0.0 of eslint-rspack-plugin has been released as a pure ESM package, aligning with the Rspack ecosystem and removing its CommonJS build. The plugin continues to integrate ESLint in the build process but may affect build times. Users are advised to consider separate linting commands for efficiency. The project is open source and available via npm. By Daniel Curtis

Problem Description Merge multiple structurally similar tables with different column names into a wide table using full outer joins by common ID. Four tables have similar structures, each with two fields. The fields have the same meaning but different names (id, id2, id3, id4 all represent ID). The goal is to merge the four tables into single rows by ID, with each ID appearing in exactly one row. When an ID is absent in a table, the corresponding columns take NULL. Source Data T1 table: T2 table: T3 table: T4 table: * Expected Result * For example, ID=555 appears in both T1 and T2 but not in T3 or T4, so id, colA, id2, colB have values, while id3/colC/id4/colD are NULL. ID=222 only appears in T3, so only id3 and colC have values; all other columns are NULL. ID=10 appears in T2 and T4 but not in T1 or T3, so id2, colB, id4, colD have values; all other columns are NULL. SQLazy Step-by-Step Implementation Core Idea: First use derive to unify the ID column names of each table to ID_main, making subsequent merging easier. Then start from the first table and perform full outer joins one by one: use join to full outer join the current result with the next table on ID_main, then use derive and nvl to merge the new ID into the ID_main column, appending tables one by one to get the final result. [ Click to run this example online ] The steps are explained below. Steps 1-4: Unify ID Column Names Across Tables derive id as ID_main, id, colA Use derive on T1-T4 to rename their respective ID column names (id/id2/id3/id4) uniformly to ID_main. Step 5: Full Outer Join T1 and T2 join ID_main; with t2; ID_main; take id2, colB; full Use the join function to full outer join t1 and t2 on ID_main. Step 6: Merge NULLs in ID Column derive nvl(ID_main, id2) as ID_main, id, colA, id2, colB If a record comes from t2 but is not present in t1, its ID_main is NULL. This step assigns t2.id2 to ID_main in such records, ensuring the ID_main column always has a value. Different SQL implementations u

In a recent Azure Architecture blog article, Azure lead engineer Kishorekumar Pattabiraman outlines practical criteria for choosing between skills, sub-agents, and other approaches when building AI systems, emphasizing reusability, simplicity, and long-term maintainability. By Sergio De Simone

Somewhere on your feed right now, someone is bragging about the app they built in a weekend, no engineering background, no team, just a prompt and a Saturday. The post always ends the same way. Look what I built without needing any of you. Anyone can build software now. That is the whole pitch, repeated in a hundred different captions this month alone. Here is what that post never shows you. The part where someone checks it. Not "does it run." Checks it. Someone who did not write it, looking for the version of it that fails, the input nobody thought to try, the assumption that was wrong in a way the builder was structurally the worst person to catch, because they were too close to their own idea to see the hole in it. That someone is not optional. It is the actual job. None of this is theoretical. A notification icon that, instead of opening a panel, closes the entire page and drops me back on an empty tab. A video call that disconnects mid sentence for no visible reason. A video that plays with the sound simply gone, until I restart it. I do not have a chart proving reliability across the industry is getting worse. What I have is a pattern I keep running into, on products built by some of the most resourced engineering organizations on earth. Why software engineering has more than one person in the room A developer writes the code. A reviewer reads it before it merges. QA tries to break it on purpose. A manager decides if it is actually ready, or just finished. None of these roles exist because engineers do not trust themselves. They exist because a single person, however good, cannot see their own blind spots. That is not a flaw in the person. It is a fact about how blind spots work. Ten sets of eyes exist so that the eleventh mistake gets caught before a million people hit it. We have already watched what happens when that layer disappears, and we did not need AI to run the experiment. We ran it with the spreadsheet. The spreadsheet already showed us the cost of

Microsoft's Agent Framework now ships a supported runtime. Build 2026 brought the Agent Harness, the GitHub Copilot and Claude Agent SDK connectors, and the orchestration patterns to stable release; the harness and Foundry Hosted Agents have since reached GA. The shift is from an SDK for building agents to a governed platform for running them. By Steef-Jan Wiggers

Welcome back to the React Mastery Series ! In the previous article, we learned how React applications communicate with backend services using Fetch API and Axios , along with best practices like service layers, interceptors, and error handling. Today, we'll explore one of the most common features you'll build as a React developer: Forms in React Whether it's: User Login Registration Profile Update Payment Details Contact Forms Search Filters Forms are everywhere. Learning how to build performant, scalable, and validated forms is an essential skill for every React developer. Understanding Forms in React A form is a collection of input elements used to collect user data. Example: Login Form Email,Password and Login Button React provides multiple ways to manage form data. The two most common approaches are: Controlled Components Uncontrolled Components Controlled Components In a controlled component, React controls the input value through state. Example: import { useState } from " react " ; function Login () { const [ email , setEmail ] = useState ( "" ); return ( < input type = "email" value = { email } onChange = { ( e ) => setEmail ( e . target . value ) } /> ); } Flow: User Types ↓ onChange ↓ React State ↓ Input Updates The input value always comes from React state. Why Controlled Components? Benefits: Easy validation Easy formatting Predictable state Better debugging Example: if ( email . length < 5 ) { // Show validation message } Since the value is stored in state, validation becomes straightforward. Uncontrolled Components In uncontrolled components, the DOM manages the input value. React accesses it using a ref. Example: import { useRef } from " react " ; function Login () { const emailRef = useRef < HTMLInputElement > ( null ); function handleSubmit () { console . log ( emailRef . current ?. value ); } return ( <> < input ref = { emailRef } /> < button onClick = { handleSubmit } > Login </ button > </> ); } Use uncontrolled components when you don't need Reac

Git is the ultimate tool for developers. Yet, branching strategies still confuse many of us. Commands like merge, rebase, and cherry-pick manipulate your commit history in completely different ways. If you just guess what they do, you risk ruining your team's shared history or losing track of your changes. The easiest way to understand Git is to visualize it. Let us look at exactly what happens to your Git graph when you run these three critical commands. 🏗️ Starting Point: Our Example Repository Imagine we have a standard repository. We branched off the main branch from commit B to work on a new feature in a feature branch. While we worked on our feature, someone else pushed commit C and D to main. Here is what our history looks like right now: C --- D [main] / A --- B \ E --- F [feature] main has two new commits: C and D. feature has two new commits: E and F. 🔀 1. Git Merge (The Safe Record Keeper) When you merge main into your feature branch (or vice versa), Git creates a special, brand-new commit called a merge commit. git checkout feature git merge main The Visual Graph After Merge: C ------- D ------ [main] / \ A --- B \ \ v E --- F --- G [feature] What happened under the hood? Git looked at the common ancestor (B), took the history of main (C and D), took the history of feature (E and F), and combined them. Commit G is the merge commit. It has two parent commits: F and D. Pros: 100% non-destructive. It preserves the exact historical timeline of when things actually happened. Cons: Your Git graph can quickly become a messy "train track" web if you have many developers merging constantly. 🚀 2. Git Rebase (The Clean History Rewriter) Rebase takes all the commits from your current branch, lifts them up, and replants them on top of the very last commit of the target branch. git checkout feature git rebase main The Visual Graph After Rebase: C --- D [main] / \ A --- B E' --- F' [feature] What happened under the hood? Git temporarily blew away commits E and F. It ca

Microsoft has released TypeScript 7.0, featuring a native compiler that improves build speeds by 8x to 12x. Notable performance enhancements were evidenced in real codebases. The version lacks a stable programmatic API, anticipated in 7.1. Transitioning includes a compatibility package for existing tooling, and TypeScript remains an open-source project. By Daniel Curtis

Embabel has reached its 1.0 release, providing a framework for AI agents on Java It allows Java and Kotlin developers to define agents as typed domain objects. Built on Spring AI, Embabel supports multiple model providers and combines planning with predefined state machines, offering flexibility for agent workflows. By Erik Costlow

Most of the engineers consider documentation as an after-thought; a README on a finished system written in the final 20 minutes before a PR gets merged. That's the wrong way to do this relationship. Documentation is not a description of architecture. It is part of the architecture, and marking it as separate is the cause of so many rotting systems, which still pass all tests. The compiler doesn't care, your team does It could be a consistent codebase and yet it be undocumented garbage from the point of view of anybody who didn't write it. Only one sort of correctness is enforced by the compiler (or interpreter): does this code perform the operation that the instructions say it performs. It doesn't weigh in on why a specific table contains a deleted_at column, versus a hard delete, or why a service tries 3 times with exponential back-off, versus 5 times with a fixed interval. Those decisions include constraints that are not apparent in the diff, regulatory, historical, or performance. If these are only in the mind of the programmer who wrote them, the actual architecture is partially undocumented, and these constraints will be breached as soon as someone else messes with the code when it is under a tight deadline. Architecture is not only the shape of your services and schemas, it's the set of decisions and constraints that shape stayed within. Undocumented constraints are like walls that we don't see, or know about. They are walked through without anyone knowing they exist, and one of the assumed conditions is broken at a time. Documentation as a design artifact, not a report Good documentation should be done prior to and/or in the midst of implementation, not after. When writing a design doc that explicitly states the problem, the options you considered, the one you selected, and the tradeoffs you made, you are actually doing real design work, you are making mistakes in your thinking process that would only become apparent during production. There have been more ti

I hit Ctrl-F more than any other key combination on this machine. It runs a shell function called fts — "find tmux session," which is not a good name but it's four years too late to change it. I press it, a fuzzy finder opens listing every project directory I have, I type a few characters, and I'm sitting in a tmux session for that project with the panes already laid out. If the session already existed, I'm back in it exactly where I left off. If what I typed doesn't exist yet, it offers to create it. Somebody watched me do this over a screen share recently and asked what was going on. So: here's the whole thing, the four tools it's built on, and a breakdown of every part that isn't obvious. What you'll end up with: One keystroke from anywhere to any project Fuzzy search across every repo you own, with a live directory tree preview Type a name that doesn't exist → it offers to scaffold and place it Never accidentally start a second tmux session for a project you already have open The same window/pane layout in every project, every time The problem it solves Before this, starting work looked like: cd ~/repo/work/some-project-i-half-remember-the-name-of tmux new-session -s some-project # split some panes, badly, slightly differently each time Three or four commands, one of which needed me to remember a path. None of it hard. All of it friction at exactly the wrong moment — the moment you've decided to start something, which is the moment you're most likely to get distracted instead. I'd also collected tmux sessions named 0 , 1 , 2 and some-project-2 , because I kept starting new ones instead of attaching to the one already running. So the goal wasn't really speed. It was making the right thing the automatic thing. Prerequisites Four tools plus zsh. All four are worth having on their own, and three of them are things you'll reach for daily once installed. Tool Version I'm on What it does here tmux 3.6a The terminal multiplexer. Holds the sessions, windows and panes. fz

Welcome back to the React Mastery Series ! In the previous article, we explored Custom Hooks in React and learned how reusable logic helps developers build scalable and maintainable applications. Today, we will explore one of the most important concepts in modern frontend development: React Routing Almost every real-world React application contains multiple screens: Login Dashboard Profile Settings Reports Transactions Admin panels But React applications are usually built as: Single Page Applications (SPA) So how do we navigate between different pages without refreshing the browser? The answer is React Router What is Client-Side Routing? Traditional websites work like this: User Clicks Link | ↓ Browser Requests New HTML Page | ↓ Server Sends Page | ↓ Browser Reloads Every navigation causes a full page refresh. React Single Page Applications work differently: User Clicks Link | ↓ React Router Intercepts Request | ↓ URL Changes | ↓ React Loads Component | ↓ No Page Refresh This creates a smooth application experience. What is React Router? React Router is a library that enables navigation between different components based on the URL. Example: /login /dashboard /profile /settings Each URL maps to a React component. Example: /login | ↓ Login Component /dashboard | ↓ Dashboard Component Installing React Router For a React application: npm install react-router-dom The package provides: BrowserRouter Routes Route Link Navigate useNavigate useParams Setting Up BrowserRouter The first step is wrapping your application. Example: import { BrowserRouter } from " react-router-dom " ; import App from " ./App " ; ReactDOM . createRoot ( document . getElementById ( " root " )). render ( < BrowserRouter > < App /> </ BrowserRouter >, ); Now React can manage browser navigation. Creating Routes Routes define which component should display for a URL. Example: import { Routes , Route } from " react-router-dom " ; function App () { return ( < Routes > < Route path = "/" element = { < Ho

When I published v2.0.0 , I thought the hard part was over. The CLI could turn Claude artifacts into native Windows applications in a single command. It worked on my machine, the demos looked great, and I was excited to share it. Then people started using it. That's when I realized the difference between building software and shipping software . The bugs only users can find Most of the problems weren't visible in a five-minute demo. Some applications worked perfectly. Others silently lost all of their data after being closed. Some builds succeeded exactly once. The second build failed unless the runtime cache was manually deleted. Everything looked correct... until someone actually tried using it. The rabbit hole What I thought would be a quick patch became a deep dive into things I'd never touched before. Over the course of v3 I ended up learning far more than I expected: Git branching and release workflows Semantic versioning GitHub Actions npm packaging npm pack Runtime integrity verification SHA-256 checksums Neutralino runtime management JavaScript debugging Integration testing None of those were part of the original project idea. Persistent storage finally works This was the biggest challenge. Artifacts using localStorage behaved differently depending on where they were running. Inside Claude everything worked. Inside the generated desktop application... not always. Tracking this down took far longer than writing the original feature. The result is that applications now persist their data correctly across launches without requiring any code changes. If your artifact uses localStorage , it should simply work. Runtime improvements The runtime layer also received a major overhaul. Version 3 now handles: automatic runtime downloads integrity verification cache recovery consecutive builds without manual cleanup Those aren't exciting features to demo, but they're exactly the kinds of improvements that make a tool feel dependable. Better testing I also spent a lot mo

Every automated system receives a particular shape of the world. That shape is expressed through records, documents, events, exceptions, and missing values. If the designers have not identified those forms—and the ways they can become malformed—the machine inherits their ignorance and reproduces it at scale. The question is not simply whether the AI failed. The useful question is whether the human-built system knew what success meant, knew the shape of its data, and knew how to recognize when it was wrong. Start with the shape of the data Before selecting a model, draw the workflow as a sequence of data transformations. What enters each stage? In what form and from what source? Which values are valid, absent, duplicated, stale, delayed, or contradictory? How will each violation be detected? What must the workflow do next? Each data shape needs a corresponding failure model. An unknown here is not merely uncertainty for the machine; it is a measurement failure in the organization. The remedy is to collect the missing data or explicitly design for its absence. Otherwise, the system is being asked to operate in a world its designers have not described. Stabilize the deliverable A system cannot be stabilized around a target that continues to move. The deliverable must be more than an aspiration written in a prompt. It should be expressed as observable conditions and anchored to a representative corpus: examples that are acceptable; examples that are unacceptable; examples that are genuinely ambiguous. Human reviewers should first demonstrate that they can apply those distinctions consistently. If they cannot agree on what success looks like, the model is not being measured against a specification. It is being measured against human disagreement disguised as one. The model is not the system Only then does it become meaningful to place an AI model inside the workflow. The model is one transformation among many: Input → validation → retrieval → normalization → model infere

Welcome back to the React Mastery Series ! In the previous article, we explored useEffect Hook and learned how React handles side effects such as: API calls Timers Event listeners WebSocket connections Cleanup operations Today, we will explore two more powerful React Hooks: useRef and useMemo These Hooks are frequently used in production applications to: Access DOM elements Store values without triggering re-renders Optimize expensive calculations Improve application performance Understanding useRef Hook useRef is a React Hook that allows us to store a value that persists across renders without causing the component to re-render. Syntax: const reference = useRef ( initialValue ); The returned object looks like: { current : initialValue } The value is accessed using: reference . current useRef vs useState A common question: Why do we need useRef when we already have useState? The difference: useState useRef Updates trigger re-render Updates do not trigger re-render Used for UI data Used for storing values React tracks changes React does not track changes Example: const [ count , setCount ] = useState ( 0 ); Updating: setCount ( count + 1 ); causes: State Update | ↓ Component Re-render With useRef: const count = useRef ( 0 ); Updating: count . current ++ ; does: Value Updated | ↓ No Re-render Using useRef to Access DOM Elements One of the most common use cases of useRef is accessing DOM elements directly. Example: import { useRef } from " react " ; function SearchBox () { const inputRef = useRef (); function focusInput () { inputRef . current . focus (); } return ( < div > < input ref = { inputRef } /> < button onClick = { focusInput } > Focus Input </ button > </ div > ); } Flow: Button Click | ↓ focusInput() | ↓ inputRef.current | ↓ Input DOM Element | ↓ focus() Real-World Example: Login Page Imagine a banking login page. When the page loads: Open Login Page | ↓ Username Field Automatically Focused Implementation: useEffect (() => { usernameRef . current . focus ();

Welcome back to the React Mastery Series ! In the previous article, we explored React Rendering and Component Lifecycle . We learned: What causes a component to re-render How React reconciliation works The difference between rendering and DOM updates How lifecycle behavior is handled using Hooks Now let's learn how React applications respond to user interactions. Every modern application depends on events: Clicking buttons Typing into forms Selecting options Submitting data Dragging and dropping elements Keyboard shortcuts React provides a powerful event system to handle all these interactions. What is Event Handling? Event handling is the process of responding to user actions in an application. Examples: User Action | ↓ Event Triggered | ↓ Event Handler Executes | ↓ State Updated | ↓ UI Re-renders Example: A user clicks the "Transfer Money" button: Click Button | ↓ Handle Click Event | ↓ Validate Data | ↓ Call API | ↓ Update UI Events in Traditional JavaScript vs React Traditional JavaScript const button = document . getElementById ( " save " ); button . addEventListener ( " click " , saveData ); You manually: Find the DOM element Attach event listeners Manage updates React React attaches events directly inside JSX. < button onClick = { saveData } > Save </ button > React manages the event registration internally. React Event Syntax React events use: camelCase naming JSX expressions Function references HTML: <button onclick= "save()" > Save </button> React: < button onClick = { save } > Save </ button > Notice: onclick ❌ onClick ✅ Handling Click Events Example: function Button () { function handleClick () { console . log ( " Button clicked " ); } return ( < button onClick = { handleClick } > Click Me </ button > ); } When the user clicks: Click | ↓ handleClick() | ↓ Execute Logic Passing Functions vs Calling Functions A very common beginner mistake. Incorrect < button onClick = { handleClick () } > Save </ button > This executes immediately during rendering. Correc