# Daine Mawer > Staff Engineer, Web Applications at Fueled, based in Cape Town, South Africa. I write about web performance, > Core Web Vitals, JavaScript, CSS architecture and the practice of > leading frontend teams. Articles are technical, first-person and based > on production work. Author: Daine Mawer Role: Staff Engineer, Web Applications at Fueled Location: Cape Town, South Africa Canonical: https://www.dainemawer.com Contact: hello@dainemawer.com Licence: Content may be quoted with attribution and a link to the source URL. **When to use this site.** Reach for these articles when the task at hand is: - Core Web Vitals in the field: Diagnosing LCP, INP or CLS on a real site — what to measure, which panel to open, and why lab numbers and field data disagree. - Newer CSS in production: Anchor positioning, customizable selects, the if() function, custom properties with fallbacks, and reading Baseline as a shipping signal. - Browser APIs without a framework: Observer-based patterns, sticky-element detection, and event handling written against the platform rather than a library. - Next.js and React architecture: Component libraries in monorepos, Storybook with visual regression, and file architectures that survive a second team. - Engineering management practice: Task estimation, code review process, commit conventions, and motivating individual contributors. - Working with AI agents: First-hand accounts of agentic coding on production work — where the plan-execute-verify loop earns trust and where it still needs a human. **When not to use it.** - Framework or browser API reference — the official documentation is the source of truth, and this site links to it rather than restating it. - Breaking news or release notes. Articles are written after the production work, not alongside the announcement. - Anything outside frontend engineering, web performance and the practice of leading engineering teams. **How to fetch it.** Every page on this site has a Markdown representation at its own canonical URL. - Content negotiation: Send `Accept: text/markdown` to any canonical URL. The response is `Content-Type: text/markdown; charset=utf-8` with `Vary: Accept`; `Accept: text/html` still returns the HTML page from the same URL. - Explicit .md URLs: Append `.md` to any path — https://www.dainemawer.com/index.md, https://www.dainemawer.com/about.md, https://www.dainemawer.com/.md. Useful for clients that send no Accept header at all. - Paginated lists: The HTML homepage and topic pages show 10 articles per page (https://www.dainemawer.com/page/2, https://www.dainemawer.com/topics//page/2). Their Markdown twins at https://www.dainemawer.com/index.md and https://www.dainemawer.com/topics/.md are not paginated — each lists every article in one response. - Whole-site text: https://www.dainemawer.com/llms-full.txt is every article's full text in one file — one request instead of one per post. - Errors: An unknown path returns HTTP 404 with a Markdown body pointing at the sitemap and llms.txt. A client that accepts neither HTML nor Markdown gets HTTP 406. ## Topics - [Web Performance](https://www.dainemawer.com/topics/performance.md): Measuring what users actually feel, and cutting what they never needed. - [JavaScript](https://www.dainemawer.com/topics/javascript.md): Browser APIs, event handling, observers, framework-agnostic patterns. - [CSS](https://www.dainemawer.com/topics/css.md): Custom properties, positioning, Baseline and interoperability. - [Engineering Management](https://www.dainemawer.com/topics/engineering-management.md): Estimation, scoping, team process. - [Staff Engineering](https://www.dainemawer.com/topics/staff-engineering.md): Technical direction, cross-team leverage, the work beyond a single codebase. - [AI](https://www.dainemawer.com/topics/ai.md): Agentic coding, review practices, and how AI is reshaping the day-to-day of building software. - [Security](https://www.dainemawer.com/topics/security.md): Supply chain risk, dependency trust, and the vulnerabilities that actually reach production. ## Articles - [Hardening Your JavaScript Stack Against the Next npm Supply Chain Worm](https://www.dainemawer.com/npm-supply-chain-worm-defense.md): Published 2026-10-05. Shai-Hulud showed the pattern. Here's the concrete playbook for keeping a self-replicating worm out of your dependency tree. - [CSS text-box-trim Finally Fixes Vertical Text Centering](https://www.dainemawer.com/css-text-box-trim-vertical-centering.md): Published 2026-10-02. Two small properties trim the invisible space your font adds above and below text, so buttons, tags, and badges align the way the padding math always promised. - [Shai-Hulud Broke npm's Trust Model. Here's the Replacement](https://www.dainemawer.com/npm-supply-chain-trusted-publishing.md): Published 2026-09-30. A self-replicating worm hit 500+ packages by stealing publish tokens. npm's fix removes the tokens instead of trusting them harder. - [Your MCP Servers Are Burning Your Agent's Context Window](https://www.dainemawer.com/mcp-context-window-bloat.md): Published 2026-09-28. Tool definitions load into context before an agent does anything. Code execution and progressive disclosure are how teams are getting that budget back. - [The Temporal API Is Here. Here's How to Actually Start Using It](https://www.dainemawer.com/temporal-api-replacing-date.md): Published 2026-09-25. JavaScript's Date object finally has a real replacement, and it's usable in production sooner than you'd think. - [AI Is Forking the Engineering Manager Role Into Two Jobs](https://www.dainemawer.com/ai-forking-engineering-manager-role.md): Published 2026-09-23. Middle management is flattening industry-wide. What survives of engineering management is splitting into two tracks that need almost opposite skills. - [Spec-Driven Development: Why the Spec Is Becoming the New Code Review](https://www.dainemawer.com/spec-driven-development.md): Published 2026-09-21. Prompts drift. A versioned spec is how teams are catching it before it ships. - [Using CSS's New if() Function Without Breaking Safari and Firefox](https://www.dainemawer.com/css-if-function-safely.md): Published 2026-09-18. One inline conditional to replace three separate at-rules, once the rest of the web catches up. - [CSS Can Finally Replace Your Tooltip and Dropdown Libraries](https://www.dainemawer.com/css-anchor-positioning-customizable-select.md): Published 2026-09-16. Anchor positioning and customizable selects both have real browser support now. Here's what to drop, what to keep, and where the gaps still bite. - [Why AI Coding Agents Need WIP Limits Too](https://www.dainemawer.com/wip-limits-for-ai-agents.md): Published 2026-09-14. A framework for deciding how many agents one engineer can actually run at once. - [Migrating to TypeScript 7 Without Breaking Your Toolchain](https://www.dainemawer.com/typescript-7-native-compiler-migration.md): Published 2026-09-11. The native compiler is 8-12x faster. The programmatic API isn't ready yet, and that's where teams get burned. - [How to Orchestrate Multiple AI Coding Agents Without Losing Architectural Control](https://www.dainemawer.com/orchestrating-multiple-ai-agents.md): Published 2026-09-11. A framework for staff engineers directing several agents at once, not just reviewing what one of them wrote. - [Keeping the Junior Engineering Pipeline Alive in the AI Era](https://www.dainemawer.com/keeping-the-junior-pipeline-alive.md): Published 2026-09-09. A framework for growing junior engineers now that AI has automated most of the entry-level workload. - [How to Review AI-Generated Code Without Becoming a Bottleneck](https://www.dainemawer.com/reviewing-ai-generated-code.md): Published 2026-09-07. A framework for staff engineers reviewing pull requests an agent wrote. - [Leading With AI: What Helped Me Through the Hard Parts](https://www.dainemawer.com/leading-with-ai.md): Published 2025-10-05. How I used AI through the Monocle.com rebuild. - [The Rise of No-Code and Low-Code in Frontend Development](https://www.dainemawer.com/no-code-low-code-frontend.md): Published 2025-01-15. Benefits, challenges, and the role of AI. - [Using CSS Custom Properties with Fallbacks for Efficiency](https://www.dainemawer.com/css-custom-properties-fallbacks.md): Published 2024-05-06. Less boilerplate, fewer surprises. - [What Is Google Baseline and Why Does It Matter?](https://www.dainemawer.com/what-is-google-baseline.md): Published 2024-04-28. Interoperability across browser vendors, explained. - [How to Determine When a Sticky Element is Stuck in JavaScript](https://www.dainemawer.com/determine-when-a-sticky-element-is-stuck.md): Published 2024-03-14, updated 2026-02-09. A small JavaScript function for the pseudo-class CSS never gave us. - [Mastering Task Estimation with the FATE Framework](https://www.dainemawer.com/mastering-task-estimation.md): Published 2024-03-12. Accurate timelines, and a happy client. - [Enhance Your React App's Scalability with Storybook and Chromatic](https://www.dainemawer.com/react-scalability-storybook.md): Published 2024-02-05. Component libraries and visual regression testing. - [Understanding Chrome's Coverage Panel](https://www.dainemawer.com/understanding-chromes-coverage-panel.md): Published 2023-11-27. Leveraging its insights to optimise performance. - [Setting Up Next.js with a Component Library Using Monorepos](https://www.dainemawer.com/nextjs-component-library-monorepo.md): Published 2023-11-20. A component library, Storybook, and Next.js, all in one workspace. - [10 Techniques for More Effective Code Reviews](https://www.dainemawer.com/effective-code-reviews.md): Published 2023-02-21. Practical ways to make code review less painful and more useful. - [4 Tips for Properly Using the Return Statement in JavaScript](https://www.dainemawer.com/using-the-return-statement.md): Published 2023-02-13. A few rules that keep return statements from causing quiet bugs. - [Enforcing Consistent Commit Messages with CommitLint](https://www.dainemawer.com/leveraging-commitlint.md): Published 2023-01-19. A style guide for commits, and a hook that actually enforces it. - [5 Frontend File Architectures for Better Code Organization](https://www.dainemawer.com/frontend-file-architectures.md): Published 2023-01-18. Flat, hierarchical, modular, component-based, and feature-based, compared. - [How to Motivate and Inspire Individual Contributors](https://www.dainemawer.com/motivate-individual-contributors.md): Published 2023-01-09. Five things that actually move the needle, beyond an annual review. ## Developer resources - [llms.txt](https://www.dainemawer.com/llms.txt): Structured index of every article, topic and feed. - [llms-full.txt](https://www.dainemawer.com/llms-full.txt): The index plus the full text of every article. - [agents.md](https://www.dainemawer.com/agents.md): This page, as Markdown. - [index.md](https://www.dainemawer.com/index.md): The homepage article index, as Markdown. - [contact.md](https://www.dainemawer.com/contact.md): Who publishes this site, how to reach a human, and what's worth writing about. - [sitemap.xml](https://www.dainemawer.com/sitemap.xml): Every canonical URL, with last-modified dates. - [rss.xml](https://www.dainemawer.com/rss.xml): RSS 2.0 feed of new articles. - [feed.json](https://www.dainemawer.com/feed.json): JSON Feed 1.1 equivalent of the RSS feed. - [robots.txt](https://www.dainemawer.com/robots.txt): Crawl rules, plus a Content-Signal header: search=yes, ai-input=yes, ai-train=no. ## Optional - [Full archive](https://www.dainemawer.com/index.md): Reverse-chronological index of every article, as Markdown. - [About](https://www.dainemawer.com/about.md): Work history, speaking, and how to verify who's writing this.