<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Xunxing Mao</title>
    <description>The latest articles on DEV Community by Xunxing Mao (@xunxing_mao_fac71e331fd4b).</description>
    <link>https://dev.to/xunxing_mao_fac71e331fd4b</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3877609%2Fd1f0cdd3-e0f6-41ad-8164-f98be388e5a7.jpg</url>
      <title>DEV Community: Xunxing Mao</title>
      <link>https://dev.to/xunxing_mao_fac71e331fd4b</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/xunxing_mao_fac71e331fd4b"/>
    <language>en</language>
    <item>
      <title>In the Age of AI, What Terminal Tools Should We Be Using?</title>
      <dc:creator>Xunxing Mao</dc:creator>
      <pubDate>Thu, 30 Apr 2026 01:32:36 +0000</pubDate>
      <link>https://dev.to/xunxing_mao_fac71e331fd4b/in-the-age-of-ai-what-terminal-tools-should-we-be-using-5ch6</link>
      <guid>https://dev.to/xunxing_mao_fac71e331fd4b/in-the-age-of-ai-what-terminal-tools-should-we-be-using-5ch6</guid>
      <description>&lt;p&gt;This article was originally published on &lt;a href="https://maoxunxing.com" rel="noopener noreferrer"&gt;maoxunxing.com&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;Today I want to talk about something every developer uses daily, but few people really think deeply about: the command line.&lt;/p&gt;

&lt;p&gt;On macOS, the classic setup has long been:&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;iTerm2 + Oh My Zsh&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;iTerm2 gives you a better terminal experience—tabs, panes, profiles—while Oh My Zsh makes Zsh more usable with plugins, themes, and autocomplete.&lt;/p&gt;

&lt;p&gt;This setup worked extremely well.&lt;/p&gt;

&lt;p&gt;But in the age of AI, the role of the terminal is changing.&lt;/p&gt;

&lt;p&gt;It’s no longer just a place to “run commands.”&lt;/p&gt;

&lt;p&gt;It’s becoming a &lt;strong&gt;development entry point&lt;/strong&gt;:&lt;/p&gt;

&lt;p&gt;You run projects, inspect logs, manage Git, launch AI agents, and even let AI modify your code—all inside the terminal.&lt;/p&gt;

&lt;p&gt;So the real question is:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;strong&gt;In the AI era, what terminal tools should we actually be using?&lt;/strong&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;The key insight is this:&lt;/p&gt;

&lt;p&gt;You shouldn’t think in terms of a single tool—you should think in layers.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Terminal Emulator&lt;/strong&gt; → iTerm2, Ghostty, Warp&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Shell&lt;/strong&gt; → Zsh, Fish, Bash&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Workflow Tools&lt;/strong&gt; → tmux, LazyGit, fzf&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;AI Layer&lt;/strong&gt; → Warp AI, Claude Code, Codex CLI, Gemini CLI&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;What you’re really building is a &lt;strong&gt;terminal workflow system&lt;/strong&gt;, not picking a single app.&lt;/p&gt;




&lt;h2&gt;
  
  
  1. iTerm2: Stable, Mature—but Not AI-Native
&lt;/h2&gt;

&lt;p&gt;If you’re on macOS, iTerm2 is still a very solid choice.&lt;/p&gt;

&lt;p&gt;Its strengths are obvious:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Mature and stable&lt;/li&gt;
&lt;li&gt;Rich features (split panes, tabs, profiles, shortcuts)&lt;/li&gt;
&lt;li&gt;Highly customizable&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;But it follows a &lt;strong&gt;traditional model&lt;/strong&gt;:&lt;/p&gt;

&lt;p&gt;It’s optimized for &lt;em&gt;humans typing commands&lt;/em&gt;, not &lt;em&gt;AI-assisted workflows&lt;/em&gt;.&lt;/p&gt;

&lt;p&gt;If your workflow is still:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Running services&lt;/li&gt;
&lt;li&gt;SSH&lt;/li&gt;
&lt;li&gt;Git commands&lt;/li&gt;
&lt;li&gt;Logs&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Then iTerm2 is more than enough.&lt;/p&gt;

&lt;p&gt;But if you’re heavily using AI tools like Cursor, Claude Code, Codex CLI, or Gemini CLI, iTerm2 itself doesn’t give you much AI leverage.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Verdict:&lt;/strong&gt;&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;iTerm2 is perfect for conservative users—stable, reliable, no surprises.&lt;/p&gt;
&lt;/blockquote&gt;




&lt;h2&gt;
  
  
  2. Oh My Zsh: Powerful, but Easy to Overdo
&lt;/h2&gt;

&lt;p&gt;Oh My Zsh is often the first upgrade people install.&lt;/p&gt;

&lt;p&gt;It’s a community-driven framework with:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;300+ plugins&lt;/li&gt;
&lt;li&gt;140+ themes&lt;/li&gt;
&lt;li&gt;Built-in Git integrations&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;It makes Zsh much easier to use out of the box.&lt;/p&gt;

&lt;p&gt;But there’s a trap:&lt;/p&gt;

&lt;p&gt;You can easily over-configure it.&lt;/p&gt;

&lt;p&gt;Too many plugins → slower startup → harder debugging.&lt;/p&gt;

&lt;p&gt;The command line should increase efficiency—not become a hobby.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;My take:&lt;/strong&gt;&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Use it, but keep it minimal.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;Only keep what actually helps:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Git plugin&lt;/li&gt;
&lt;li&gt;Autosuggestions&lt;/li&gt;
&lt;li&gt;Syntax highlighting&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  3. Fish: A More Modern Shell Experience
&lt;/h2&gt;

&lt;p&gt;Fish is a very underrated option.&lt;/p&gt;

&lt;p&gt;Its philosophy is simple:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;strong&gt;Make the shell good by default.&lt;/strong&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;Out of the box, Fish gives you:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Syntax highlighting&lt;/li&gt;
&lt;li&gt;Smart autocomplete&lt;/li&gt;
&lt;li&gt;Inline suggestions&lt;/li&gt;
&lt;li&gt;Better tab completion&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;You don’t need heavy configuration.&lt;/p&gt;

&lt;p&gt;This is a big deal.&lt;/p&gt;

&lt;p&gt;Zsh is powerful—but often requires setup.&lt;/p&gt;

&lt;p&gt;Fish feels like a &lt;strong&gt;modern shell from day one&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;The downside:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Not fully POSIX-compatible&lt;/li&gt;
&lt;li&gt;Some scripts may not run directly&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Best use case:&lt;/strong&gt;&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Use Fish for daily interaction, and Bash/Zsh for scripting.&lt;/p&gt;
&lt;/blockquote&gt;




&lt;h2&gt;
  
  
  4. Ghostty: Fast, Clean, and Native
&lt;/h2&gt;

&lt;p&gt;Ghostty is one of my current favorites.&lt;/p&gt;

&lt;p&gt;It’s not an AI tool—it’s a &lt;strong&gt;modern terminal emulator&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;Its core strengths:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Extremely fast&lt;/li&gt;
&lt;li&gt;Lightweight&lt;/li&gt;
&lt;li&gt;Native UI (not Electron-heavy)&lt;/li&gt;
&lt;li&gt;Great pane management&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Ghostty doesn’t try to define your workflow.&lt;/p&gt;

&lt;p&gt;It just gives you a &lt;strong&gt;high-performance container&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;You can plug in whatever you want:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Fish or Zsh&lt;/li&gt;
&lt;li&gt;tmux&lt;/li&gt;
&lt;li&gt;Neovim&lt;/li&gt;
&lt;li&gt;Claude Code / Codex CLI&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;The downside:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;No built-in AI layer&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;You need to bring your own tools.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Verdict:&lt;/strong&gt;&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Ghostty is ideal if you want speed, control, and flexibility.&lt;/p&gt;
&lt;/blockquote&gt;




&lt;h2&gt;
  
  
  5. Warp: The AI-Native Terminal
&lt;/h2&gt;

&lt;p&gt;Warp is not just a terminal—it’s an &lt;strong&gt;AI development environment&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;It’s designed for what people now call &lt;em&gt;agentic development&lt;/em&gt;.&lt;/p&gt;

&lt;p&gt;Warp integrates:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Built-in AI assistance&lt;/li&gt;
&lt;li&gt;Command explanations&lt;/li&gt;
&lt;li&gt;Error summarization&lt;/li&gt;
&lt;li&gt;Smart command generation&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;And it supports external agents like:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Claude Code&lt;/li&gt;
&lt;li&gt;Codex CLI&lt;/li&gt;
&lt;li&gt;Gemini CLI&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Recently, Warp also open-sourced its client, signaling a strong push toward becoming an &lt;strong&gt;AI-first terminal platform&lt;/strong&gt;.&lt;/p&gt;

&lt;h3&gt;
  
  
  Why Warp stands out:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;AI deeply integrated&lt;/li&gt;
&lt;li&gt;Modern UI (block-based instead of raw text stream)&lt;/li&gt;
&lt;li&gt;Lower barrier for beginners&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Downsides:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Heavier than traditional terminals&lt;/li&gt;
&lt;li&gt;Opinionated workflow&lt;/li&gt;
&lt;li&gt;Can make you overly reliant on AI&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Verdict:&lt;/strong&gt;&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Warp is for people who want their terminal to be an AI workspace.&lt;/p&gt;
&lt;/blockquote&gt;




&lt;h2&gt;
  
  
  6. tmux: Old-School, Still Powerful
&lt;/h2&gt;

&lt;p&gt;tmux is a classic.&lt;/p&gt;

&lt;p&gt;It lets you:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Run multiple sessions&lt;/li&gt;
&lt;li&gt;Detach and reattach&lt;/li&gt;
&lt;li&gt;Keep processes alive remotely&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;It’s especially useful for:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;SSH workflows&lt;/li&gt;
&lt;li&gt;Long-running tasks&lt;/li&gt;
&lt;li&gt;Server environments&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;The downside:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Steep learning curve&lt;/li&gt;
&lt;li&gt;Keyboard-heavy mental model&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Recommendation:&lt;/strong&gt;&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Skip tmux for local dev—but it’s still essential for remote work.&lt;/p&gt;
&lt;/blockquote&gt;




&lt;h2&gt;
  
  
  7. LazyGit: The Git Productivity Booster
&lt;/h2&gt;

&lt;p&gt;LazyGit is a terminal UI for Git.&lt;/p&gt;

&lt;p&gt;Instead of memorizing commands, you get:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Visual diff&lt;/li&gt;
&lt;li&gt;Easy staging&lt;/li&gt;
&lt;li&gt;Commit management&lt;/li&gt;
&lt;li&gt;Branch control&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;It sits between:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Raw CLI (too manual)&lt;/li&gt;
&lt;li&gt;GUI tools (too detached)&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;It’s perfect for developers who:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Use Git frequently&lt;/li&gt;
&lt;li&gt;Want speed without losing control&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;But remember:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;LazyGit doesn’t replace Git knowledge—it amplifies it.&lt;/p&gt;
&lt;/blockquote&gt;




&lt;h2&gt;
  
  
  8. So What Should You Use?
&lt;/h2&gt;

&lt;p&gt;Here are three practical setups:&lt;/p&gt;

&lt;h3&gt;
  
  
  1. Conservative Setup
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;iTerm2 + Oh My Zsh + LazyGit&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Stable&lt;/li&gt;
&lt;li&gt;Familiar&lt;/li&gt;
&lt;li&gt;Low friction&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Perfect for most developers.&lt;/p&gt;




&lt;h3&gt;
  
  
  2. Lightweight Setup (My Preference)
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Ghostty + Fish + LazyGit&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Fast and clean&lt;/li&gt;
&lt;li&gt;Minimal configuration&lt;/li&gt;
&lt;li&gt;Flexible AI integration&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Core idea:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Keep the terminal light, plug in AI tools when needed.&lt;/p&gt;
&lt;/blockquote&gt;




&lt;h3&gt;
  
  
  3. AI-Native Setup
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Warp + AI Agents + LazyGit&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Deep AI integration&lt;/li&gt;
&lt;li&gt;Command intelligence&lt;/li&gt;
&lt;li&gt;Modern workflow&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Core idea:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Turn your terminal into an AI workspace.&lt;/p&gt;
&lt;/blockquote&gt;




&lt;h2&gt;
  
  
  9. My Personal Choice
&lt;/h2&gt;

&lt;p&gt;If I had to summarize:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Stick with &lt;strong&gt;iTerm2&lt;/strong&gt; → if you want stability&lt;/li&gt;
&lt;li&gt;Use &lt;strong&gt;Ghostty&lt;/strong&gt; → if you want speed and simplicity&lt;/li&gt;
&lt;li&gt;Try &lt;strong&gt;Warp&lt;/strong&gt; → if you want AI-first workflows&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Shell-wise:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Use &lt;strong&gt;Fish&lt;/strong&gt; → for better UX&lt;/li&gt;
&lt;li&gt;Use &lt;strong&gt;Zsh&lt;/strong&gt; → if you’re already invested&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;And always:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Install LazyGit—it’s worth it.&lt;/p&gt;
&lt;/blockquote&gt;




&lt;h2&gt;
  
  
  Final Thought
&lt;/h2&gt;

&lt;p&gt;The terminal isn’t going away.&lt;/p&gt;

&lt;p&gt;If anything, it’s becoming more important.&lt;/p&gt;

&lt;p&gt;Because AI agents ultimately:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Run commands&lt;/li&gt;
&lt;li&gt;Read files&lt;/li&gt;
&lt;li&gt;Modify code&lt;/li&gt;
&lt;li&gt;Execute workflows&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;The terminal used to be:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;A bridge between humans and machines&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;Now it’s becoming:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;A shared workspace between humans, AI, and machines&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;So choosing your terminal is no longer about picking a “black window.”&lt;/p&gt;

&lt;p&gt;It’s about choosing &lt;strong&gt;how you work&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;And in the AI era, that choice matters more than ever.&lt;/p&gt;

</description>
      <category>ai</category>
      <category>webdev</category>
      <category>productivity</category>
      <category>programming</category>
    </item>
    <item>
      <title>AI Agent Beginner's Guide: From Concepts to Protocols</title>
      <dc:creator>Xunxing Mao</dc:creator>
      <pubDate>Mon, 27 Apr 2026 01:08:42 +0000</pubDate>
      <link>https://dev.to/xunxing_mao_fac71e331fd4b/ai-agent-beginners-guide-from-concepts-to-protocols-i1j</link>
      <guid>https://dev.to/xunxing_mao_fac71e331fd4b/ai-agent-beginners-guide-from-concepts-to-protocols-i1j</guid>
      <description>&lt;blockquote&gt;
&lt;p&gt;This article was originally published on &lt;strong&gt;&lt;a href="https://maoxunxing.com/ai-agent-guide/" rel="noopener noreferrer"&gt;maoxunxing.com&lt;/a&gt;&lt;/strong&gt;. Follow me there for more deep dives on AI agents and engineering practices.&lt;/p&gt;
&lt;/blockquote&gt;




&lt;h2&gt;
  
  
  Agent vs Copilot
&lt;/h2&gt;

&lt;p&gt;This is the key distinction for understanding the current forms of AI tools:&lt;/p&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;&lt;/th&gt;
&lt;th&gt;Agent (Driver)&lt;/th&gt;
&lt;th&gt;Copilot (Co-driver)&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Role&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Autonomous decision-making and execution&lt;/td&gt;
&lt;td&gt;Assists, follows instructions&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Behavior&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Perceive environment -&amp;gt; Plan -&amp;gt; Execute -&amp;gt; Achieve goal&lt;/td&gt;
&lt;td&gt;You give instructions -&amp;gt; It helps complete the task&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;User Requirements&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Define the goal and boundaries&lt;/td&gt;
&lt;td&gt;Needs prompting skills, domain knowledge, ongoing exploration&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Process&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Non-deterministic, dynamic decisions&lt;/td&gt;
&lt;td&gt;Relatively fixed, human-driven&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;




&lt;h2&gt;
  
  
  Why We Need Agents
&lt;/h2&gt;

&lt;p&gt;Models cannot answer every question. For instance, events after the training knowledge cutoff are simply unknown to the model.&lt;/p&gt;

&lt;p&gt;The evolution path:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Pure LLM
  |
Combining APIs for answers (Compound AI System / Agentic System) -&amp;gt; Fixed Pipeline
  |
Agents -&amp;gt; LLM makes dynamic decisions based on task goals and environment; the process is non-deterministic
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The key distinction: a Pipeline is a fixed workflow; an Agent is a dynamic workflow. An Agent decides what to do next in real time based on the current environment and task goals.&lt;/p&gt;




&lt;h2&gt;
  
  
  Agent Architecture Patterns
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Single Agent
&lt;/h3&gt;

&lt;p&gt;A single LLM instance that autonomously perceives the environment, plans, executes, provides feedback, and completes end-to-end tasks.&lt;/p&gt;

&lt;h3&gt;
  
  
  Multi-Agent
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Master-Worker pattern&lt;/strong&gt;: One master Agent handles planning and task dispatch, while multiple worker Agents execute specific subtasks&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Peer collaboration pattern&lt;/strong&gt;: All Agents can make decisions, determining who acts based on capability and context&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Computer Use / Web Agent
&lt;/h3&gt;

&lt;p&gt;The difference from traditional automated testing: traditional test instructions are written by humans, while Web Agent instructions are &lt;strong&gt;dynamically generated&lt;/strong&gt; by the Agent. An Agent can operate browsers and desktop applications like a human, autonomously deciding the operation path based on objectives.&lt;/p&gt;




&lt;h2&gt;
  
  
  Protocol Layer: MCP and SGP
&lt;/h2&gt;

&lt;p&gt;For AI Agents to work in practice, they need to interface with external resources and services. There are two key protocol directions:&lt;/p&gt;

&lt;h3&gt;
  
  
  MCP (Model Context Protocol)
&lt;/h3&gt;

&lt;p&gt;The problem it solves: &lt;strong&gt;How to integrate local computer resources?&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;RPA (Robotic Process Automation)&lt;/li&gt;
&lt;li&gt;Local documents (Local Doc)&lt;/li&gt;
&lt;li&gt;Local software (Local Software)&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;MCP enables Agents to call local capabilities without routing everything through the cloud.&lt;/p&gt;

&lt;h3&gt;
  
  
  SGP (Standard Gateway Protocol)
&lt;/h3&gt;

&lt;p&gt;The problem it solves: &lt;strong&gt;How to connect remote services?&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;API services&lt;/li&gt;
&lt;li&gt;Remote models&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;SGP unifies the interaction protocol between Agents and remote services.&lt;/p&gt;




&lt;h2&gt;
  
  
  Implementation Strategy and Business Opportunities
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Architecture-Level Opportunities Belong to Small Businesses
&lt;/h3&gt;

&lt;blockquote&gt;
&lt;p&gt;Data processing architecture + systems engineering + application paradigms are &lt;strong&gt;uncertain&lt;/strong&gt; -- this is where small entrepreneurs have opportunities, filling gaps that models alone cannot handle. The bottom layer consists of numerous models. But model and algorithm paradigms are &lt;strong&gt;certain&lt;/strong&gt; -- that is what big companies do.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;A notable finding: large models distilled into small models perform worse than small models trained from scratch.&lt;/p&gt;

&lt;h3&gt;
  
  
  A New Paradigm for Personalized Recommendations
&lt;/h3&gt;

&lt;p&gt;Implementing personalized recommendations through Agents rather than traditional search/recommendation algorithms:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Models handle knowledge and general awareness&lt;/li&gt;
&lt;li&gt;On-device processing for privacy without cloud dependency (1B parameters, 300-500M memory)&lt;/li&gt;
&lt;li&gt;25ms search response time; models suit asynchronous IM scenarios&lt;/li&gt;
&lt;li&gt;Hyper-personalization: every user sees a different UI&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Pick Vertical Scenarios, Don't Spray and Pray
&lt;/h3&gt;

&lt;p&gt;Don't try to do everything at once. Choose vertical scenarios and go deep.&lt;/p&gt;

&lt;h3&gt;
  
  
  Pipeline Thinking
&lt;/h3&gt;

&lt;p&gt;Don't be constrained by paradigms; instead consider what it can do and experience it firsthand:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;For example: use a model to identify intent -&amp;gt; use a cutout tool for image segmentation -&amp;gt; use other tools for subsequent processing. This is a Pipeline where data + engineering + algorithms can work as a full stack. Capability doesn't need to be 100%; 50% is OK.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;h3&gt;
  
  
  Text as a Service
&lt;/h3&gt;

&lt;p&gt;FaaS is a service, Serverless is a service, and &lt;strong&gt;text can also be a service&lt;/strong&gt;:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Push me five AI news items every day, English only and meeting certain criteria, then execute a task to publish to a public account -- this can become a service. Implement the code yourself and it becomes a service. Code is productivity.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;h3&gt;
  
  
  Business Scenario Examples
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Public sentiment and comments&lt;/strong&gt;: Extracting key signals buried in massive amounts of information&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Infrastructure tools&lt;/strong&gt;: All usable; the key is the solution and its future-readiness&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  Practical References
&lt;/h2&gt;

&lt;h3&gt;
  
  
  fastrtc
&lt;/h3&gt;

&lt;p&gt;A real-time communication framework suitable for building voice/video Agents: &lt;a href="https://fastrtc.org/cookbook/" rel="noopener noreferrer"&gt;fastrtc.org/cookbook&lt;/a&gt;&lt;/p&gt;




&lt;h2&gt;
  
  
  References
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;a href="https://www.anthropic.com/engineering/building-effective-agents" rel="noopener noreferrer"&gt;Building Effective Agents — Anthropic&lt;/a&gt; — Anthropic's guide to building effective AI agents with practical patterns&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://modelcontextprotocol.io/" rel="noopener noreferrer"&gt;Model Context Protocol (MCP) Specification&lt;/a&gt; — Official specification for MCP, the open protocol for AI-tool integration&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://python.langchain.com/docs/concepts/agents/" rel="noopener noreferrer"&gt;LangChain Agent Documentation&lt;/a&gt; — Comprehensive documentation on building AI agents with LangChain framework&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  Related Reading
&lt;/h2&gt;

&lt;p&gt;If you want a practical AI coding workflow, check out my&lt;br&gt;
&lt;a href="https://maoxunxing.com/ai-coding-practice/" rel="noopener noreferrer"&gt;AI Coding Playbook: Tool Selection, Workflows, and Prompt Templates&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;If you're exploring team-level impact after personal productivity gains, read&lt;br&gt;
&lt;a href="https://maoxunxing.com/ai-rewriting-workflow/" rel="noopener noreferrer"&gt;AI Is Rewriting the Playbook&lt;/a&gt;.&lt;/p&gt;




&lt;p&gt;&lt;em&gt;Felix Mao (毛毛星) | &lt;a href="https://maoxunxing.com" rel="noopener noreferrer"&gt;maoxunxing.com&lt;/a&gt; | &lt;a href="https://twitter.com/maoxunxing" rel="noopener noreferrer"&gt;@maoxunxing&lt;/a&gt; | &lt;a href="https://github.com/XingMXTeam/" rel="noopener noreferrer"&gt;GitHub&lt;/a&gt;&lt;/em&gt;&lt;/p&gt;

</description>
      <category>ai</category>
      <category>agents</category>
      <category>architecture</category>
      <category>productivity</category>
    </item>
    <item>
      <title>Which AI Coding Tool Should You Choose? 2026 Comprehensive Comparison Guide</title>
      <dc:creator>Xunxing Mao</dc:creator>
      <pubDate>Fri, 24 Apr 2026 01:32:32 +0000</pubDate>
      <link>https://dev.to/xunxing_mao_fac71e331fd4b/which-ai-coding-tool-should-you-choose-2026-comprehensive-comparison-guide-2i3b</link>
      <guid>https://dev.to/xunxing_mao_fac71e331fd4b/which-ai-coding-tool-should-you-choose-2026-comprehensive-comparison-guide-2i3b</guid>
      <description>&lt;blockquote&gt;
&lt;p&gt;This article was originally published on &lt;strong&gt;&lt;a href="https://maoxunxing.com/ai-coding-tools-comparison-2026/" rel="noopener noreferrer"&gt;maoxunxing.com&lt;/a&gt;&lt;/strong&gt;. Follow me there for more deep dives on AI-assisted engineering.&lt;/p&gt;
&lt;/blockquote&gt;




&lt;h2&gt;
  
  
  Introduction: Why I Recommend ChatGPT Pro / Gemini Advanced Pro
&lt;/h2&gt;

&lt;p&gt;The AI coding tool market in 2026 has become highly mature, but also incredibly confusing. Cursor, Claude Code, GitHub Copilot, Windsurf, OpenCode, Zenmux... every tool is pushing its own subscription. But in reality, &lt;strong&gt;for most developers, the smartest choice is ChatGPT Pro ($200/month) or Gemini Advanced Pro ($20-30/month)&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;The reason is simple: &lt;strong&gt;unlimited usage, predictable costs, and versatile functionality&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;This article will help you understand why Pro memberships are the superior solution from the perspectives of real costs, use cases, hidden fees, and ban risks, and how to combine them with various programming tools for optimal results.&lt;/p&gt;




&lt;h2&gt;
  
  
  1. Major International AI Coding Tools Breakdown
&lt;/h2&gt;

&lt;h3&gt;
  
  
  1. Cursor - The AI-Native IDE Representative
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Pricing:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Hobby (Free): $0, limited agent requests and tab completions&lt;/li&gt;
&lt;li&gt;Pro: $20/month ($16/month annual), $20 credit pool&lt;/li&gt;
&lt;li&gt;Pro+: $60/month, $60 credit pool (3x)&lt;/li&gt;
&lt;li&gt;Ultra: $200/month, 20x credits&lt;/li&gt;
&lt;li&gt;Teams: $40/user/month&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Key Features:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;VS Code fork with deep AI integration&lt;/li&gt;
&lt;li&gt;Switched from request-based to credit-based pricing in mid-2025&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Auto mode is unlimited&lt;/strong&gt; on all paid plans (key selling point)&lt;/li&gt;
&lt;li&gt;Supports 15+ models, but through Cursor's proxy; most models don't support BYOK (Bring Your Own Key)&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Best For:&lt;/strong&gt; Developers who want AI deeply integrated into their editor, daily inline completions and quick edits&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Real Cost Warning:&lt;/strong&gt; Credit-based pricing means different models consume credits at different rates. Frontier models (like GPT-4o, Claude Opus) consume 3-5x faster. Heavy users spend $60-200/month&lt;/p&gt;




&lt;h3&gt;
  
  
  2. Claude Code - Terminal AI Agent King (But With Ban Risks⚠️)
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Pricing:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Pro (requires Claude subscription): $20/month, ~44,000 tokens per 5-hour window&lt;/li&gt;
&lt;li&gt;Max 5x: $100/month, ~88,000 tokens per 5-hour window&lt;/li&gt;
&lt;li&gt;Max 20x: $200/month, ~220,000 tokens per 5-hour window&lt;/li&gt;
&lt;li&gt;API pay-as-you-go: Sonnet 4.6 ($3/$15 per MTok), Opus 4.6 ($5/$25 per MTok)&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Key Features:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Terminal CLI tool, no GUI&lt;/li&gt;
&lt;li&gt;Claude Opus 4.6 scored 80.9% on SWE-bench Verified (highest ever)&lt;/li&gt;
&lt;li&gt;Best-in-class autonomous agent loop (plan → edit → test → fix)&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Claude models only&lt;/strong&gt;, no third-party models&lt;/li&gt;
&lt;li&gt;No local model option&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;⚠️ Ban Risk (Critical):&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;2025-2026 Mass Ban Events:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Anthropic banned &lt;strong&gt;1.45 million accounts&lt;/strong&gt; in H2 2025&lt;/li&gt;
&lt;li&gt;Appeal success rate: only &lt;strong&gt;3.3%&lt;/strong&gt; (1,700 successful out of 52,000 appeals)&lt;/li&gt;
&lt;li&gt;Multiple users reported &lt;strong&gt;immediate bans&lt;/strong&gt; after upgrading to Claude Code Max&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Top 5 Ban Reasons:&lt;/strong&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Geographic and IP Mismatch&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Using commercial VPNs or shared IPs&lt;/li&gt;
&lt;li&gt;Account registration location differs from usage location&lt;/li&gt;
&lt;li&gt;Abnormal IP address during payment&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Payment Method Risks&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Virtual credit cards and prepaid cards flagged as high-risk&lt;/li&gt;
&lt;li&gt;Cards from crypto-to-fiat services&lt;/li&gt;
&lt;li&gt;Card name doesn't match account name&lt;/li&gt;
&lt;li&gt;Payment cards previously associated with banned accounts&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Third-Party Tool Detection&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Starting January 2026, Anthropic began banning accounts using third-party tools with subscription credentials&lt;/li&gt;
&lt;li&gt;Tools like OpenCode, Cline that proxy requests through Claude Pro/Max accounts are targeted&lt;/li&gt;
&lt;li&gt;Many users who had been using these tools for months were &lt;strong&gt;banned immediately after payment&lt;/strong&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Automated Fraud Detection False Positives&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Upgrading plans (Pro → Max) triggers security review&lt;/li&gt;
&lt;li&gt;Changing credit cards or paying from new devices&lt;/li&gt;
&lt;li&gt;Multiple failed payment attempts followed by success&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Billing System Synchronization Errors&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Claude Code and Claude.ai use separate billing systems&lt;/li&gt;
&lt;li&gt;Brief sync issues during upgrades or renewals&lt;/li&gt;
&lt;li&gt;Accounts incorrectly flagged as "past due" and banned&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;strong&gt;Reality After Being Banned:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Accounts disabled within minutes of payment&lt;/li&gt;
&lt;li&gt;Error messages: "This organization has been disabled" or "Your account has been disabled"&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;No refunds&lt;/strong&gt; (if deemed a policy violation)&lt;/li&gt;
&lt;li&gt;Appeals take days to weeks to process&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Recommendations to Reduce Ban Risk:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;✅ Use real credit cards (from supported countries)&lt;/li&gt;
&lt;li&gt;✅ Maintain consistent IP address (avoid frequent VPN switching)&lt;/li&gt;
&lt;li&gt;✅ Avoid using third-party tools that proxy subscription credentials&lt;/li&gt;
&lt;li&gt;✅ Consider API access (no geographic restrictions, lower ban risk)&lt;/li&gt;
&lt;li&gt;❌ Don't use virtual credit cards or prepaid cards&lt;/li&gt;
&lt;li&gt;❌ Don't immediately request usage after registration&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Best For:&lt;/strong&gt; Complex refactoring tasks requiring strongest reasoning, &lt;strong&gt;but you must accept ban risk&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Real Cost Warning:&lt;/strong&gt; The $20 Pro plan is very limited. Heavy users need $100-200/month Max plans, plus ban risk&lt;/p&gt;




&lt;h3&gt;
  
  
  3. GitHub Copilot - The Value King
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Pricing:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Free: $0, 50 premium requests/month, 2,000 completions/month&lt;/li&gt;
&lt;li&gt;Pro: $10/month ($100/year), 300 premium requests/month, unlimited completions&lt;/li&gt;
&lt;li&gt;Pro+: $39/month ($390/year), 1,500 premium requests/month&lt;/li&gt;
&lt;li&gt;Business: $19/user/month, 300 premium requests/user/month&lt;/li&gt;
&lt;li&gt;Enterprise: $39/user/month, 1,000 premium requests/user/month&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Overage: $0.04 per premium request&lt;/strong&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Key Features:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;$10/month is the best value across the entire market&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;Multi-model support, including Claude Opus 4.6&lt;/li&gt;
&lt;li&gt;Integrated voice plugin (local model, extremely accurate)&lt;/li&gt;
&lt;li&gt;Auto-reads Claude Desktop's MCP configuration&lt;/li&gt;
&lt;li&gt;VS Code and JetBrains plugin, not a standalone IDE&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Best For:&lt;/strong&gt; Budget-conscious individual developers, teams already using VS Code&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Important Availability Note:&lt;/strong&gt; Copilot used to be one of the easiest low-cost ways to access high-quality models (including Opus-level workflows). However, some users now report subscription onboarding restrictions (often tied to region, payment method, or account risk controls). If you can't subscribe directly, use API-based alternatives as a fallback.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Real Cost &amp;amp; Availability Warning:&lt;/strong&gt; Overage at $0.04/request can add up quickly with heavy usage, and in some regions account availability can become a bigger risk than pricing itself.&lt;/p&gt;




&lt;h3&gt;
  
  
  4. Windsurf - Cursor's Direct Competitor
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Pricing (after March 19, 2026 update):&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Free: $0, limited quotas&lt;/li&gt;
&lt;li&gt;Pro: $20/month (was $15), daily/weekly quotas&lt;/li&gt;
&lt;li&gt;Teams: $40/seat/month (was $30)&lt;/li&gt;
&lt;li&gt;Max: $200/month (NEW), highest quotas&lt;/li&gt;
&lt;li&gt;Enterprise: Custom&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Key Features:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Switched from credit system to quota system in March 2026 (controversial)&lt;/li&gt;
&lt;li&gt;All models available&lt;/li&gt;
&lt;li&gt;"Cascade" mode (similar to Cursor's composer)&lt;/li&gt;
&lt;li&gt;Tends to over-explain, burning through requests faster&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Best For:&lt;/strong&gt; Developers who prefer Windsurf's workflow&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Real Cost Warning:&lt;/strong&gt; Quota system means you can hit daily limits even on paid plans. Existing users grandfathered at old prices&lt;/p&gt;




&lt;h3&gt;
  
  
  5. Zenmux - Unified AI API Gateway
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Pricing:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Free: $0, limited quota&lt;/li&gt;
&lt;li&gt;Builder: $20/month, fixed monthly fee + Flows (floating USD value)&lt;/li&gt;
&lt;li&gt;Pro: $100/month, higher limits&lt;/li&gt;
&lt;li&gt;Max: $200/month, highest limits&lt;/li&gt;
&lt;li&gt;Pay-as-you-go: pay per actual usage, 1 Credit = $1 USD&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Key Features:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Unified AI API Gateway&lt;/strong&gt;: One interface to access all major models (OpenAI, Anthropic, Google, etc.)&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Flows billing model&lt;/strong&gt;: Unlike fixed credits, Flows have floating USD-equivalent values&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;No rate limits&lt;/strong&gt; (unlimited scaling)&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Enterprise-grade stability + AI insurance&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Token-level billing&lt;/strong&gt;: Pay only for what you use&lt;/li&gt;
&lt;li&gt;Suitable for: Individual developers, learning, Vibe Coding, production environments&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Best For:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Developers needing flexible access to multiple model providers&lt;/li&gt;
&lt;li&gt;Teams wanting to simplify API management&lt;/li&gt;
&lt;li&gt;Projects requiring production-grade stability&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Real Cost Warning:&lt;/strong&gt; Flows' floating value means actual costs can vary with model pricing changes. Monitor your bills closely&lt;/p&gt;




&lt;h3&gt;
  
  
  6. OpenCode - The Open-Source Freedom Champion
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Pricing:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Tool itself: &lt;strong&gt;Completely free (MIT open-source)&lt;/strong&gt;
&lt;/li&gt;
&lt;li&gt;API usage: Typically $5-50/month (depending on usage and model choice)&lt;/li&gt;
&lt;li&gt;Local models (Ollama): &lt;strong&gt;Zero cost&lt;/strong&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Key Features:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Terminal TUI/CLI, also available as desktop app and VS Code extension&lt;/li&gt;
&lt;li&gt;Supports &lt;strong&gt;75+ model providers&lt;/strong&gt; (Anthropic, OpenAI, Google, Groq, Ollama, etc.)&lt;/li&gt;
&lt;li&gt;Switch models mid-conversation (&lt;code&gt;/model&lt;/code&gt; command)&lt;/li&gt;
&lt;li&gt;MCP support + plugin system with 25+ lifecycle hooks&lt;/li&gt;
&lt;li&gt;No telemetry, no data storage; with Ollama, code never leaves your machine&lt;/li&gt;
&lt;li&gt;Multi-session parallel support&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;⚠️ Warning:&lt;/strong&gt; Since February 2026, Anthropic has been banning accounts using third-party tools (including OpenCode) with Claude subscription credentials. Use API access instead of subscription proxy.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Best For:&lt;/strong&gt; Budget-conscious teams, those needing model flexibility, compliance/privacy-focused scenarios&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Real Cost Warning:&lt;/strong&gt; Tool is free, but API costs are separate. Heavy usage of premium models like Claude Opus can exceed subscription-based tool costs&lt;/p&gt;




&lt;h3&gt;
  
  
  7. OpenAI Codex CLI - OpenAI's Terminal Solution
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Pricing:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Tool itself: Free (Apache 2.0 open-source)&lt;/li&gt;
&lt;li&gt;ChatGPT Plus: $20/month, 33-168 local messages&lt;/li&gt;
&lt;li&gt;ChatGPT Pro: $200/month, 300-1,500 messages&lt;/li&gt;
&lt;li&gt;API pay-as-you-go: codex-mini ($1.50/$6.00 per MTok), GPT-5 ($1.25/$10.00 per MTok)&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Key Features:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;~4x more token-efficient than Claude Code&lt;/strong&gt; (official claim)&lt;/li&gt;
&lt;li&gt;Terminal-Bench 2.0 score: 77.3%&lt;/li&gt;
&lt;li&gt;Open-source, no vendor lock-in&lt;/li&gt;
&lt;li&gt;Accessible via ChatGPT subscription or API key&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Best For:&lt;/strong&gt; Developers already subscribed to ChatGPT, scenarios requiring token efficiency&lt;/p&gt;




&lt;h2&gt;
  
  
  2. Why ChatGPT Pro / Gemini Advanced Pro Is the Best Solution
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Core Advantage: Unlimited Usage, Predictable Costs
&lt;/h3&gt;

&lt;p&gt;You're absolutely right that for many developers, &lt;strong&gt;Pro memberships are the true value kings&lt;/strong&gt;:&lt;/p&gt;

&lt;h4&gt;
  
  
  ChatGPT Pro ($200/month)
&lt;/h4&gt;

&lt;p&gt;&lt;strong&gt;✅ Core Advantages:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;No explicit request limits&lt;/strong&gt;: Unlike Cursor, Claude Code with strict credit/quota limits&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;No worry about overage fees&lt;/strong&gt;: Won't charge you extra for using more&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Extremely versatile&lt;/strong&gt;: Not just coding, but also writing, translation, data analysis, learning new knowledge&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Works with any tool&lt;/strong&gt;: Can be paired with any IDE, terminal tools, online services&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;o1 model with strong reasoning&lt;/strong&gt;: Perfect for complex problem-solving and code review&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;No ban risk&lt;/strong&gt;: Unlike Claude Code that's easily banned for VPN, third-party tools&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;💰 Cost Analysis:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Fixed $200/month, no hidden fees&lt;/li&gt;
&lt;li&gt;If you need other ChatGPT Plus features (GPT-4o, Advanced Voice, etc.), Pro version is more cost-effective&lt;/li&gt;
&lt;li&gt;Equivalent to a &lt;strong&gt;universal AI assistant&lt;/strong&gt; covering all aspects of work and life&lt;/li&gt;
&lt;/ul&gt;

&lt;h4&gt;
  
  
  Gemini Advanced Pro ($20-30/month)
&lt;/h4&gt;

&lt;p&gt;&lt;strong&gt;✅ Core Advantages:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Super cheap&lt;/strong&gt;: Only 1/10 the price of ChatGPT Pro&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;1M token context window&lt;/strong&gt; (soon 2M): Can paste entire codebases&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Gemini API free tier extremely generous&lt;/strong&gt;: 10-30 requests/minute, can be used with Cursor, OpenCode, etc.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;No overage worry&lt;/strong&gt;: Like ChatGPT Pro, fixed monthly fee with no extra charges&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Google ecosystem integration&lt;/strong&gt;: Seamless connection with YouTube, Drive, Gmail, etc.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;No ban risk&lt;/strong&gt;: VPN and international user friendly&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;💰 Cost Analysis:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;$20-30/month, extremely cost-effective&lt;/li&gt;
&lt;li&gt;Free API can save costs on other tools&lt;/li&gt;
&lt;li&gt;Perfect for developers on a budget who need powerful AI capabilities&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Why More Practical Than Professional Coding Tools?
&lt;/h3&gt;

&lt;h4&gt;
  
  
  1. &lt;strong&gt;Cost Certainty vs Uncertainty&lt;/strong&gt;
&lt;/h4&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;Solution&lt;/th&gt;
&lt;th&gt;Monthly Fee&lt;/th&gt;
&lt;th&gt;Hidden Fees&lt;/th&gt;
&lt;th&gt;Total Cost Certainty&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;ChatGPT Pro&lt;/td&gt;
&lt;td&gt;$200&lt;/td&gt;
&lt;td&gt;None&lt;/td&gt;
&lt;td&gt;✅ Completely certain&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Gemini Advanced&lt;/td&gt;
&lt;td&gt;$20-30&lt;/td&gt;
&lt;td&gt;None&lt;/td&gt;
&lt;td&gt;✅ Completely certain&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Cursor Pro&lt;/td&gt;
&lt;td&gt;$20&lt;/td&gt;
&lt;td&gt;Extra charges after credit exhaustion&lt;/td&gt;
&lt;td&gt;❌ Uncertain&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Claude Code Max&lt;/td&gt;
&lt;td&gt;$100-200&lt;/td&gt;
&lt;td&gt;Potential ban losses&lt;/td&gt;
&lt;td&gt;❌ High risk&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;GitHub Copilot Pro&lt;/td&gt;
&lt;td&gt;$10&lt;/td&gt;
&lt;td&gt;$0.04/request overage&lt;/td&gt;
&lt;td&gt;⚠️ May exceed&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;

&lt;p&gt;&lt;strong&gt;Key Insight:&lt;/strong&gt; Cursor Pro seems cheap at $20, but heavy usage can reach $60-200; Claude Code Max $100-200 has ban risks. In comparison, ChatGPT Pro $200 has higher certainty.&lt;/p&gt;

&lt;h4&gt;
  
  
  2. &lt;strong&gt;Versatility vs Specialization&lt;/strong&gt;
&lt;/h4&gt;

&lt;p&gt;&lt;strong&gt;What ChatGPT Pro / Gemini Pro Can Do:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;💻 Code generation and debugging&lt;/li&gt;
&lt;li&gt;📝 Technical documentation writing&lt;/li&gt;
&lt;li&gt;🌐 Translation and localization&lt;/li&gt;
&lt;li&gt;📊 Data analysis and visualization&lt;/li&gt;
&lt;li&gt;🎓 Learning new technologies&lt;/li&gt;
&lt;li&gt;🗣️ Voice conversations (ChatGPT Advanced Voice)&lt;/li&gt;
&lt;li&gt;🖼️ Image generation and understanding&lt;/li&gt;
&lt;li&gt;📧 Email and daily communication&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;What Professional Coding Tools Can Only Do:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;In-IDE completions&lt;/li&gt;
&lt;li&gt;Codebase-aware editing&lt;/li&gt;
&lt;li&gt;Terminal agent operations&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Conclusion:&lt;/strong&gt; Pro memberships cover 90% of AI usage scenarios, while professional coding tools only cover 10%.&lt;/p&gt;

&lt;h4&gt;
  
  
  3. &lt;strong&gt;Flexibility vs Lock-in&lt;/strong&gt;
&lt;/h4&gt;

&lt;p&gt;&lt;strong&gt;Pro Membership Flexibility:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Can be used in any editor (VS Code, JetBrains, Vim, terminal...)&lt;/li&gt;
&lt;li&gt;Can be paired with any AI coding tool (Cursor, OpenCode, Cline, Aider...)&lt;/li&gt;
&lt;li&gt;Can switch usage scenarios anytime&lt;/li&gt;
&lt;li&gt;Won't be locked into a specific IDE or workflow&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Professional Coding Tool Lock-in:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Cursor requires using their IDE (VS Code fork)&lt;/li&gt;
&lt;li&gt;Claude Code only works with Claude models&lt;/li&gt;
&lt;li&gt;Windsurf requires using their editor&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Best Practice: Pro Membership + Free/Low-Cost Tool Combinations
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Option A: Strongest Combination ($200-230/month)&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;ChatGPT Pro ($200): Primary AI assistant&lt;/li&gt;
&lt;li&gt;GitHub Copilot Free ($0): IDE completions (2,000/month)&lt;/li&gt;
&lt;li&gt;Total cost: $200/month&lt;/li&gt;
&lt;li&gt;Coverage: 95% of usage scenarios&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Option B: Value King ($20-50/month)&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Gemini Advanced ($20-30): Primary AI assistant&lt;/li&gt;
&lt;li&gt;Gemini API (Free): Use with Cursor/OpenCode&lt;/li&gt;
&lt;li&gt;GitHub Copilot Free ($0): IDE completions&lt;/li&gt;
&lt;li&gt;Total cost: $20-30/month&lt;/li&gt;
&lt;li&gt;Coverage: 90% of usage scenarios&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Option C: All-Round Developer ($220-250/month)&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;ChatGPT Pro ($200): Daily AI assistant&lt;/li&gt;
&lt;li&gt;Gemini Advanced ($20-30): Long context scenarios&lt;/li&gt;
&lt;li&gt;GitHub Copilot Pro ($10): Deep IDE integration&lt;/li&gt;
&lt;li&gt;Total cost: $230-240/month&lt;/li&gt;
&lt;li&gt;Coverage: 99% of usage scenarios, invincible combination&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  3. Hidden Fees Revealed: What Seems Cheap Might Be Expensive
&lt;/h2&gt;

&lt;h3&gt;
  
  
  1. Overage Charges
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;GitHub Copilot:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Beyond quota: $0.04 per premium request&lt;/li&gt;
&lt;li&gt;Sounds small, but 50 extra requests daily = $60/month&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Cursor:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;After $20 credit pool exhausted, pay per model rate&lt;/li&gt;
&lt;li&gt;GPT-4o or Claude Opus consume credits 3-5x faster than lighter models&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Windsurf:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Old version: $10 for 250 extra requests&lt;/li&gt;
&lt;li&gt;New version: Quota system, hard limits after reaching quota&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  2. Model Selection Traps
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Cursor&lt;/strong&gt;: Supports 15+ models, but through Cursor's proxy; you can't control which model is actually called&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Claude Code&lt;/strong&gt;: Claude models only; need to switch tools for GPT-4o or Gemini&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;OpenCode&lt;/strong&gt;: Only tool supporting true BYOK, flexible to choose cheapest models&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Zenmux&lt;/strong&gt;: Unified gateway, but Flows' floating value needs careful monitoring&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  3. Ban Risk Costs (Claude Code Specific)
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Real Cases:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Users paying $100-200 for Claude Code Max &lt;strong&gt;banned immediately&lt;/strong&gt;
&lt;/li&gt;
&lt;li&gt;Appeal success rate: only 3.3%&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;No refunds provided&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;Account recovery takes days to weeks&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Indirect Costs:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Development interruption time cost&lt;/li&gt;
&lt;li&gt;Cost of reconfiguring alternative tools&lt;/li&gt;
&lt;li&gt;Potentially lost project context&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Cost to Reduce Risk:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Using real credit cards (may require enabling international payments)&lt;/li&gt;
&lt;li&gt;Stable network environment (may need better VPN service)&lt;/li&gt;
&lt;li&gt;Switching to API access (potentially higher cost, but lower risk)&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  4. Team Cost Amplification
&lt;/h3&gt;

&lt;p&gt;For a 500-developer team (annual costs):&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;GitHub Copilot Business: $114,000&lt;/li&gt;
&lt;li&gt;Cursor Business: $192,000&lt;/li&gt;
&lt;li&gt;Tabnine Enterprise: $234,000+&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;OpenCode solution:&lt;/strong&gt; Tool $0 + API costs $20-30/dev/month = $120,000-180,000/year (but more flexible model choices)&lt;/p&gt;

&lt;h3&gt;
  
  
  5. Implementation and Governance Costs
&lt;/h3&gt;

&lt;p&gt;DX research shows &lt;strong&gt;real costs&lt;/strong&gt; of AI coding tools also include:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Monitoring and governance tools: $50,000-250,000/year&lt;/li&gt;
&lt;li&gt;Internal training and enablement: Affects 40-50% adoption rate&lt;/li&gt;
&lt;li&gt;Change management: Integrating new tools into existing workflows&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  6. Data Privacy Costs
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Claude Code / Cursor&lt;/strong&gt;: Code sent to vendor servers&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;OpenCode + Ollama&lt;/strong&gt;: Code fully localized, suitable for regulated industries&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Tabnine&lt;/strong&gt;: Supports on-premises deployment, but most expensive ($39-59/user/month)&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  4. Scenario-Based Recommendations: Pro Membership + Tool Combination Strategy
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Scenario 1: Limited Budget, Pursuing Highest Value ⭐ Recommended
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Recommended: Gemini Advanced ($20-30/month) + GitHub Copilot Free ($0)&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Total cost: $20-30/month&lt;/li&gt;
&lt;li&gt;Coverage: 90% of daily usage scenarios&lt;/li&gt;
&lt;li&gt;Advantages:

&lt;ul&gt;
&lt;li&gt;Extremely low cost, equivalent to a cup of coffee&lt;/li&gt;
&lt;li&gt;Gemini 1M token context can paste entire codebases&lt;/li&gt;
&lt;li&gt;Free API can be used with Cursor, OpenCode, etc.&lt;/li&gt;
&lt;li&gt;No ban risk, VPN friendly&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;/ul&gt;

&lt;h3&gt;
  
  
  Scenario 2: Professional Developer, Need Strongest Capabilities ⭐ Recommended
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Recommended: ChatGPT Pro ($200/month) + GitHub Copilot Free ($0)&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Total cost: $200/month&lt;/li&gt;
&lt;li&gt;Coverage: 95% of usage scenarios&lt;/li&gt;
&lt;li&gt;Advantages:

&lt;ul&gt;
&lt;li&gt;Unlimited o1 model usage, strongest reasoning&lt;/li&gt;
&lt;li&gt;No worry about overage fees&lt;/li&gt;
&lt;li&gt;Can be paired with any IDE and programming tools&lt;/li&gt;
&lt;li&gt;Extremely versatile, covers all work and life scenarios&lt;/li&gt;
&lt;li&gt;No ban risk&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;/ul&gt;

&lt;h3&gt;
  
  
  Scenario 3: All-Round Developer, Pursuing Invincible Combination
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Recommended: ChatGPT Pro ($200) + Gemini Advanced ($20-30) + GitHub Copilot Pro ($10)&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Total cost: $230-240/month&lt;/li&gt;
&lt;li&gt;Coverage: 99% of usage scenarios&lt;/li&gt;
&lt;li&gt;Advantages:

&lt;ul&gt;
&lt;li&gt;ChatGPT Pro: Daily reasoning, code review, complex problems&lt;/li&gt;
&lt;li&gt;Gemini Advanced: Long context, codebase analysis&lt;/li&gt;
&lt;li&gt;Copilot Pro: Deep IDE integration, voice features&lt;/li&gt;
&lt;li&gt;Invincible combination, meets all needs&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;/ul&gt;

&lt;h3&gt;
  
  
  Scenario 4: Team/Enterprise, Compliance and Privacy Needed
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Recommended: OpenCode (Free) + Ollama (Local Models) + Gemini Advanced ($20-30)&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Tool cost: $0 + $20-30/month&lt;/li&gt;
&lt;li&gt;API cost: On-demand, can be fully localized&lt;/li&gt;
&lt;li&gt;Suitable for: Finance, healthcare, government, and other regulated industries&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Scenario 5: Just Want "Unlimited and Worry-Free" General AI
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Recommended: ChatGPT Pro ($200/month) or Gemini Advanced ($20-30/month)&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Advantages:

&lt;ul&gt;
&lt;li&gt;✅ No overage worry&lt;/li&gt;
&lt;li&gt;✅ No extra fees&lt;/li&gt;
&lt;li&gt;✅ No ban risk&lt;/li&gt;
&lt;li&gt;✅ Extremely versatile&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;Disadvantages: Lacks deep IDE integration (but can be compensated with free tools)&lt;/li&gt;

&lt;li&gt;Suitable for: Developers needing comprehensive AI assistance&lt;/li&gt;

&lt;/ul&gt;




&lt;h2&gt;
  
  
  5. 2026 Market Trends
&lt;/h2&gt;

&lt;h3&gt;
  
  
  1. Pricing Model Fragmentation
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Credits (Cursor)&lt;/li&gt;
&lt;li&gt;Tokens (Claude Code API)&lt;/li&gt;
&lt;li&gt;Quotas (Windsurf)&lt;/li&gt;
&lt;li&gt;Premium Requests (GitHub Copilot)&lt;/li&gt;
&lt;li&gt;Flows (Zenmux, floating value)&lt;/li&gt;
&lt;li&gt;Daily caps vs monthly caps&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Advice:&lt;/strong&gt; Don't just look at headline prices; read the fine print&lt;/p&gt;

&lt;h3&gt;
  
  
  2. $20/Month Becomes Standard Tier
&lt;/h3&gt;

&lt;p&gt;Cursor Pro, Windsurf Pro, Claude Code Pro, Zenmux Builder all converge at $20/month&lt;/p&gt;

&lt;h3&gt;
  
  
  3. Heavy User Costs Converge
&lt;/h3&gt;

&lt;p&gt;Regardless of tool choice, heavy usage eventually reaches $60-200/month&lt;/p&gt;

&lt;h3&gt;
  
  
  4. Free Tiers Are Genuinely Usable
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Bolt.new: 1M tokens/month&lt;/li&gt;
&lt;li&gt;GitHub Copilot Free: 2,000 completions&lt;/li&gt;
&lt;li&gt;Codex CLI: Open-source free&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  5. Tool Combination Becomes Standard
&lt;/h3&gt;

&lt;p&gt;DX research shows developers use 2-3 AI tools on average; chat-based assistants (ChatGPT, Claude, Gemini) complement IDE-native tools&lt;/p&gt;

&lt;h3&gt;
  
  
  6. Ban Risk Becomes Important Consideration
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Claude Code's mass ban events changed the market landscape&lt;/li&gt;
&lt;li&gt;More developers switching to API access or alternative tools&lt;/li&gt;
&lt;li&gt;Geographic location and payment methods becoming important factors in tool selection&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  6. Final Recommendations: Pro Membership Is Core, Tools Are Supplementary
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;Lowest Cost Option ($20-30/month) ⭐ Recommended:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Gemini Advanced ($20-30): Primary AI assistant&lt;/li&gt;
&lt;li&gt;GitHub Copilot Free ($0): IDE completions&lt;/li&gt;
&lt;li&gt;Total cost: $20-30/month&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Best Value Option ($200/month) ⭐ Recommended:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;ChatGPT Pro ($200): Universal AI assistant&lt;/li&gt;
&lt;li&gt;GitHub Copilot Free ($0): IDE completions&lt;/li&gt;
&lt;li&gt;Total cost: $200/month&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;All-Round Developer Option ($230-240/month):&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;ChatGPT Pro ($200) + Gemini Advanced ($20-30) + GitHub Copilot Pro ($10)&lt;/li&gt;
&lt;li&gt;Covers 99% scenarios, invincible combination&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Zero Cost Option:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Gemini AI Studio (Free, 1M token context)&lt;/li&gt;
&lt;li&gt;GitHub Copilot Free (2,000 completions)&lt;/li&gt;
&lt;li&gt;OpenCode (Free) + Ollama (local models)&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Safest Option (Avoid Bans):&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;ChatGPT Pro or Gemini Advanced&lt;/li&gt;
&lt;li&gt;Use Claude models via API (pay-as-you-go)&lt;/li&gt;
&lt;li&gt;Avoid Claude subscription products&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  Conclusion: Pro Membership Is Core, Tools Are Supplementary
&lt;/h2&gt;

&lt;p&gt;When choosing AI coding tools, ask yourself four questions:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;How much time do I spend coding daily?&lt;/strong&gt; (Determines how powerful a tool you need)&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;What's my budget ceiling?&lt;/strong&gt; (Avoid surprise overage fees)&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;What's my workflow?&lt;/strong&gt; (Terminal, IDE, or hybrid?)&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Is there ban risk in my region?&lt;/strong&gt; (Especially for Claude Code users)&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;strong&gt;Core Recommendation:&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;For most developers, ChatGPT Pro or Gemini Advanced Pro membership is the smartest choice.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;The reasons are simple:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;✅ &lt;strong&gt;Unlimited usage&lt;/strong&gt;: No worry about overage fees&lt;/li&gt;
&lt;li&gt;✅ &lt;strong&gt;Predictable costs&lt;/strong&gt;: Fixed monthly fee, clear budget&lt;/li&gt;
&lt;li&gt;✅ &lt;strong&gt;Extremely versatile&lt;/strong&gt;: Can be paired with various programming tools and online conversation services&lt;/li&gt;
&lt;li&gt;✅ &lt;strong&gt;No ban risk&lt;/strong&gt;: Unlike Claude Code that's easily banned&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Professional coding tools (Cursor, Claude Code, Windsurf, etc.) can serve as supplements, but shouldn't be the core.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Remember:&lt;/strong&gt; Pro membership is the core infrastructure, various coding tools are just the icing on the cake.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Most important point:&lt;/strong&gt; If you're in China or using a VPN, strongly recommend choosing ChatGPT Pro or Gemini Advanced, and avoid Claude Code subscription products to minimize ban risk.&lt;/p&gt;




&lt;h2&gt;
  
  
  Appendix: Quick Comparison Table
&lt;/h2&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;Tool&lt;/th&gt;
&lt;th&gt;Price&lt;/th&gt;
&lt;th&gt;Core Advantage&lt;/th&gt;
&lt;th&gt;Best For&lt;/th&gt;
&lt;th&gt;Hidden Costs&lt;/th&gt;
&lt;th&gt;Ban Risk&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;GitHub Copilot Pro&lt;/td&gt;
&lt;td&gt;$10/mo&lt;/td&gt;
&lt;td&gt;Best value&lt;/td&gt;
&lt;td&gt;Budget-conscious developers&lt;/td&gt;
&lt;td&gt;Overage $0.04/request&lt;/td&gt;
&lt;td&gt;Low&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Cursor Pro&lt;/td&gt;
&lt;td&gt;$20/mo&lt;/td&gt;
&lt;td&gt;Deep IDE integration&lt;/td&gt;
&lt;td&gt;Daily AI-assisted development&lt;/td&gt;
&lt;td&gt;Variable credit consumption&lt;/td&gt;
&lt;td&gt;Low&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Claude Code Pro&lt;/td&gt;
&lt;td&gt;$20/mo&lt;/td&gt;
&lt;td&gt;Strongest reasoning&lt;/td&gt;
&lt;td&gt;Complex refactoring&lt;/td&gt;
&lt;td&gt;Requires upgrade to $100-200&lt;/td&gt;
&lt;td&gt;&lt;strong&gt;High⚠️&lt;/strong&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Windsurf Pro&lt;/td&gt;
&lt;td&gt;$20/mo&lt;/td&gt;
&lt;td&gt;All models available&lt;/td&gt;
&lt;td&gt;Windsurf workflow fans&lt;/td&gt;
&lt;td&gt;Quota system daily limits&lt;/td&gt;
&lt;td&gt;Low&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Zenmux Builder&lt;/td&gt;
&lt;td&gt;$20/mo&lt;/td&gt;
&lt;td&gt;Unified API gateway&lt;/td&gt;
&lt;td&gt;Multi-model strategy devs&lt;/td&gt;
&lt;td&gt;Floating Flow values&lt;/td&gt;
&lt;td&gt;Low&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;OpenCode&lt;/td&gt;
&lt;td&gt;Free&lt;/td&gt;
&lt;td&gt;75+ models, total flexibility&lt;/td&gt;
&lt;td&gt;Power users, compliance needs&lt;/td&gt;
&lt;td&gt;API costs separate&lt;/td&gt;
&lt;td&gt;Low (with API)&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;ChatGPT Pro&lt;/td&gt;
&lt;td&gt;$200/mo&lt;/td&gt;
&lt;td&gt;Unlimited, no overage worry&lt;/td&gt;
&lt;td&gt;Heavy general AI users&lt;/td&gt;
&lt;td&gt;Lacks IDE integration&lt;/td&gt;
&lt;td&gt;Low&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Gemini Advanced&lt;/td&gt;
&lt;td&gt;$20-30/mo&lt;/td&gt;
&lt;td&gt;1M token context&lt;/td&gt;
&lt;td&gt;Long context scenarios&lt;/td&gt;
&lt;td&gt;Chat-only, no agent capability&lt;/td&gt;
&lt;td&gt;Low&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;




&lt;p&gt;&lt;em&gt;Data sourced from official pricing pages and third-party research (as of April 2026). Pricing may change; please verify with official sources. Ban risk information based on public reports and user feedback; actual situations may vary.&lt;/em&gt;&lt;/p&gt;




&lt;h2&gt;
  
  
  Related Reading
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://maoxunxing.com/ai-coding-practice/" rel="noopener noreferrer"&gt;AI Coding Playbook: Tool Selection, Workflows, and Prompt Templates&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://maoxunxing.com/ai-agent-guide/" rel="noopener noreferrer"&gt;AI Agent Beginner's Guide: Agent vs Copilot, MCP and architecture patterns&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://maoxunxing.com/karpathy-knowledge-base-practice/" rel="noopener noreferrer"&gt;How I build a Git-based personal knowledge base workflow&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;




&lt;p&gt;&lt;em&gt;Felix Mao | &lt;a href="https://maoxunxing.com" rel="noopener noreferrer"&gt;maoxunxing.com&lt;/a&gt; | &lt;a href="https://twitter.com/maoxunxing" rel="noopener noreferrer"&gt;@maoxunxing&lt;/a&gt; | &lt;a href="https://github.com/XingMXTeam/" rel="noopener noreferrer"&gt;GitHub&lt;/a&gt;&lt;/em&gt;&lt;/p&gt;

</description>
      <category>ai</category>
      <category>webdev</category>
      <category>programming</category>
      <category>productivity</category>
    </item>
    <item>
      <title>Practicing Karpathy's Personal Knowledge Base Method with a Git Repository</title>
      <dc:creator>Xunxing Mao</dc:creator>
      <pubDate>Wed, 22 Apr 2026 01:07:07 +0000</pubDate>
      <link>https://dev.to/xunxing_mao_fac71e331fd4b/practicing-karpathys-personal-knowledge-base-method-with-a-git-repository-1o8f</link>
      <guid>https://dev.to/xunxing_mao_fac71e331fd4b/practicing-karpathys-personal-knowledge-base-method-with-a-git-repository-1o8f</guid>
      <description>&lt;blockquote&gt;
&lt;p&gt;This article was originally published on &lt;strong&gt;&lt;a href="https://maoxunxing.com/karpathy-knowledge-base-practice/" rel="noopener noreferrer"&gt;maoxunxing.com&lt;/a&gt;&lt;/strong&gt;. Follow me there for more on AI-assisted workflows, Hugo, and knowledge systems.&lt;/p&gt;
&lt;/blockquote&gt;




&lt;h2&gt;
  
  
  What Karpathy Shared
&lt;/h2&gt;

&lt;p&gt;  &lt;iframe src="https://www.youtube.com/embed/VRub1w-APTc"&gt;
  &lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;Andrej Karpathy recently shared a practical approach on &lt;a href="https://x.com/karpathy/status/2039805659525644595" rel="noopener noreferrer"&gt;X/Twitter&lt;/a&gt; and published a complete &lt;a href="https://gist.github.com/karpathy/442a6bf555914893e9891c11519de94f" rel="noopener noreferrer"&gt;LLM Wiki Gist&lt;/a&gt;: using LLMs to build personal knowledge bases for research topics. The core workflow:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Dump source files (articles, papers, screenshots) into a &lt;code&gt;raw/&lt;/code&gt; directory&lt;/li&gt;
&lt;li&gt;Use an LLM to "compile" them into structured Markdown knowledge entries&lt;/li&gt;
&lt;li&gt;Browse everything in Obsidian&lt;/li&gt;
&lt;li&gt;Query the knowledge base — the LLM searches and answers autonomously&lt;/li&gt;
&lt;li&gt;Periodically run LLM "health checks" to fix contradictions and fill gaps&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;His knowledge base has grown to ~100 entries and 400K words. No RAG needed — the LLM maintains indexes and summaries to handle all queries.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;In one sentence&lt;/strong&gt;: raw materials in, structured knowledge out, LLM does the heavy lifting.&lt;/p&gt;

&lt;h2&gt;
  
  
  Why Not Obsidian
&lt;/h2&gt;

&lt;p&gt;Karpathy uses Obsidian as his viewer. But if you already have a Hugo blog repository, you don't need any extra software:&lt;/p&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;Need&lt;/th&gt;
&lt;th&gt;Obsidian Approach&lt;/th&gt;
&lt;th&gt;Hugo Repo Approach&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;View Markdown&lt;/td&gt;
&lt;td&gt;Obsidian editor&lt;/td&gt;
&lt;td&gt;
&lt;code&gt;hugo server -D&lt;/code&gt; local preview&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Link knowledge&lt;/td&gt;
&lt;td&gt;
&lt;code&gt;[[]]&lt;/code&gt; backlinks + graph&lt;/td&gt;
&lt;td&gt;Hugo tags + Algolia search&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Publish output&lt;/td&gt;
&lt;td&gt;Requires extra export&lt;/td&gt;
&lt;td&gt;Remove &lt;code&gt;draft: true&lt;/code&gt;, push&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Version control&lt;/td&gt;
&lt;td&gt;Needs Obsidian Git plugin&lt;/td&gt;
&lt;td&gt;It's already a Git repo&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Multi-device sync&lt;/td&gt;
&lt;td&gt;Obsidian Sync or iCloud&lt;/td&gt;
&lt;td&gt;&lt;code&gt;git pull&lt;/code&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Search&lt;/td&gt;
&lt;td&gt;Built-in Obsidian search&lt;/td&gt;
&lt;td&gt;
&lt;code&gt;grep&lt;/code&gt; / Algolia / LLM&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;

&lt;p&gt;The key advantage: &lt;strong&gt;knowledge refined into articles publishes directly — zero migration cost&lt;/strong&gt;. One repo, full pipeline from collection to publication.&lt;/p&gt;

&lt;h2&gt;
  
  
  Three-Layer Knowledge Pipeline
&lt;/h2&gt;

&lt;p&gt;Build three content tiers inside your repository:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;content/
  raw/        &amp;lt;- Inbox: see something good, dump it here
  notes/      &amp;lt;- Knowledge base: LLM-compiled structured entries
  posts/      &amp;lt;- Blog: polished, published articles
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  raw/ — Zero-Friction Inbox
&lt;/h3&gt;

&lt;p&gt;This is the system's entry point. Key principle: &lt;strong&gt;don't fuss over formatting or classification — just capture it&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;Each raw entry is a Markdown file with frontmatter:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight markdown"&gt;&lt;code&gt;&lt;span class="nn"&gt;---&lt;/span&gt;
&lt;span class="na"&gt;title&lt;/span&gt;&lt;span class="pi"&gt;:&lt;/span&gt; &lt;span class="s2"&gt;"&lt;/span&gt;&lt;span class="s"&gt;Some&lt;/span&gt;&lt;span class="nv"&gt; &lt;/span&gt;&lt;span class="s"&gt;article&lt;/span&gt;&lt;span class="nv"&gt; &lt;/span&gt;&lt;span class="s"&gt;about&lt;/span&gt;&lt;span class="nv"&gt; &lt;/span&gt;&lt;span class="s"&gt;RAG&lt;/span&gt;&lt;span class="nv"&gt; &lt;/span&gt;&lt;span class="s"&gt;pipelines"&lt;/span&gt;
&lt;span class="na"&gt;date&lt;/span&gt;&lt;span class="pi"&gt;:&lt;/span&gt; &lt;span class="s"&gt;2026-04-09&lt;/span&gt;
&lt;span class="na"&gt;draft&lt;/span&gt;&lt;span class="pi"&gt;:&lt;/span&gt; &lt;span class="kc"&gt;true&lt;/span&gt;
&lt;span class="na"&gt;tags&lt;/span&gt;&lt;span class="pi"&gt;:&lt;/span&gt; &lt;span class="pi"&gt;[&lt;/span&gt;&lt;span class="nv"&gt;AI&lt;/span&gt;&lt;span class="pi"&gt;,&lt;/span&gt; &lt;span class="nv"&gt;RAG&lt;/span&gt;&lt;span class="pi"&gt;]&lt;/span&gt;
&lt;span class="na"&gt;source&lt;/span&gt;&lt;span class="pi"&gt;:&lt;/span&gt; &lt;span class="s2"&gt;"&lt;/span&gt;&lt;span class="s"&gt;https://original-url"&lt;/span&gt;
&lt;span class="nn"&gt;---&lt;/span&gt;

Paste the original text / summary / screenshot / notes here. Whatever is fastest.
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;code&gt;draft: true&lt;/code&gt; ensures these materials never appear on your live blog — only visible locally with &lt;code&gt;hugo server -D&lt;/code&gt;.&lt;/p&gt;

&lt;h3&gt;
  
  
  notes/ — Compiled Knowledge Entries
&lt;/h3&gt;

&lt;p&gt;When &lt;code&gt;raw/&lt;/code&gt; accumulates enough material on a topic, let the LLM:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Merge and synthesize related materials&lt;/li&gt;
&lt;li&gt;Extract core insights&lt;/li&gt;
&lt;li&gt;Add structured summaries&lt;/li&gt;
&lt;li&gt;Tag with cross-references&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Turning &lt;code&gt;raw/&lt;/code&gt; fragments into complete knowledge entries in &lt;code&gt;notes/&lt;/code&gt;.&lt;/p&gt;

&lt;h3&gt;
  
  
  posts/ — Published Blog Articles
&lt;/h3&gt;

&lt;p&gt;When a &lt;code&gt;notes/&lt;/code&gt; entry reaches sufficient depth and you're ready to write a full article, polish it, remove &lt;code&gt;draft: true&lt;/code&gt;, and publish.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Flow is always one-directional&lt;/strong&gt;: raw -&amp;gt; notes -&amp;gt; posts. Materials only get more refined, never regress.&lt;/p&gt;

&lt;h2&gt;
  
  
  Step-by-Step Setup
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Step 1: Create the raw directory
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;&lt;span class="nb"&gt;mkdir&lt;/span&gt; &lt;span class="nt"&gt;-p&lt;/span&gt; content/raw

&lt;span class="nb"&gt;cat&lt;/span&gt; &lt;span class="o"&gt;&amp;lt;&amp;lt;&lt;/span&gt;&lt;span class="sh"&gt;'&lt;/span&gt;&lt;span class="no"&gt;EOF&lt;/span&gt;&lt;span class="sh"&gt;' &amp;gt; content/raw/_index.md
---
title: "Raw"
description: "Knowledge inbox"
draft: true
---
&lt;/span&gt;&lt;span class="no"&gt;EOF
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Step 2: Add a Hugo archetype template
&lt;/h3&gt;

&lt;p&gt;Create &lt;code&gt;archetypes/raw.md&lt;/code&gt;:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight markdown"&gt;&lt;code&gt;&lt;span class="nn"&gt;---&lt;/span&gt;
&lt;span class="na"&gt;title&lt;/span&gt;&lt;span class="pi"&gt;:&lt;/span&gt; &lt;span class="s2"&gt;"&lt;/span&gt;&lt;span class="s"&gt;{{&lt;/span&gt;&lt;span class="nv"&gt; &lt;/span&gt;&lt;span class="s"&gt;replace&lt;/span&gt;&lt;span class="nv"&gt; &lt;/span&gt;&lt;span class="s"&gt;.Name&lt;/span&gt;&lt;span class="nv"&gt; &lt;/span&gt;&lt;span class="s"&gt;"-" " " | title }}"&lt;/span&gt;
&lt;span class="na"&gt;date&lt;/span&gt;&lt;span class="pi"&gt;:&lt;/span&gt; &lt;span class="pi"&gt;{{&lt;/span&gt; &lt;span class="nv"&gt;.Date&lt;/span&gt; &lt;span class="pi"&gt;}}&lt;/span&gt;
&lt;span class="na"&gt;draft&lt;/span&gt;&lt;span class="pi"&gt;:&lt;/span&gt; &lt;span class="kc"&gt;true&lt;/span&gt;
&lt;span class="na"&gt;tags&lt;/span&gt;&lt;span class="pi"&gt;:&lt;/span&gt; &lt;span class="pi"&gt;[]&lt;/span&gt;
&lt;span class="na"&gt;source&lt;/span&gt;&lt;span class="pi"&gt;:&lt;/span&gt; &lt;span class="s2"&gt;"&lt;/span&gt;&lt;span class="s"&gt;"&lt;/span&gt;
&lt;span class="nn"&gt;---&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Now &lt;code&gt;hugo new raw/topic-name/index.md&lt;/code&gt; auto-generates entries with the template.&lt;/p&gt;

&lt;h3&gt;
  
  
  Step 3: Configure Hugo permalinks
&lt;/h3&gt;

&lt;p&gt;Add &lt;code&gt;raw&lt;/code&gt; to the permalinks section in &lt;code&gt;config.toml&lt;/code&gt;:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight toml"&gt;&lt;code&gt;&lt;span class="nn"&gt;[permalinks]&lt;/span&gt;
&lt;span class="py"&gt;raw&lt;/span&gt; &lt;span class="p"&gt;=&lt;/span&gt; &lt;span class="s"&gt;"/:slugorcontentbasename/"&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Step 4: Start collecting
&lt;/h3&gt;

&lt;p&gt;See a good article or have an idea? Create a raw entry immediately:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;hugo new raw/interesting-topic/index.md
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Paste in the content. No formatting needed, no perfection required — raw state is fine.&lt;/p&gt;

&lt;h2&gt;
  
  
  Compiling with LLM
&lt;/h2&gt;

&lt;p&gt;This is the heart of Karpathy's method and the highest-value step.&lt;/p&gt;

&lt;h3&gt;
  
  
  Materials -&amp;gt; Knowledge Entries
&lt;/h3&gt;

&lt;p&gt;Have the LLM read multiple related materials from &lt;code&gt;raw/&lt;/code&gt; and synthesize a &lt;code&gt;notes/&lt;/code&gt; entry:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;"Read all raw entries tagged with AI, synthesize them into a structured knowledge entry under content/notes/ai-fundamentals/. Requirements: extract core concepts, add cross-references, cite sources."&lt;/p&gt;
&lt;/blockquote&gt;

&lt;h3&gt;
  
  
  Knowledge Entries -&amp;gt; Blog Posts
&lt;/h3&gt;

&lt;p&gt;When a notes entry has accumulated enough depth:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;"Based on the knowledge entry in content/notes/ai-fundamentals/, write a developer-facing blog post for content/posts/. Requirements: include opinions, real examples, and actionable advice."&lt;/p&gt;
&lt;/blockquote&gt;

&lt;h3&gt;
  
  
  Health Checks
&lt;/h3&gt;

&lt;p&gt;Periodically audit the knowledge base:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;"Scan all entries in content/raw/ and content/notes/. Find: 1) duplicate topics that should merge 2) entries missing tags 3) raw materials ready to compile into notes"&lt;/p&gt;
&lt;/blockquote&gt;

&lt;h3&gt;
  
  
  Automate with a Qoder Skill
&lt;/h3&gt;

&lt;p&gt;Take it further with a Qoder Skill — one sentence does it all:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;/kb collect https://example.com/article&lt;/code&gt; — fetch and create a raw entry&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;/kb collect I learned today that LoRA fine-tuning's key is...&lt;/code&gt; — quick-capture a thought&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;/kb compile AI&lt;/code&gt; — compile AI-related raw materials into a notes entry&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;/kb preview&lt;/code&gt; — start local preview with all materials visible&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;/kb check&lt;/code&gt; — LLM health check&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Daily Workflow
&lt;/h2&gt;

&lt;p&gt;The visual flow:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;See a great article / Have an insight
       |
       v
  /kb collect "content"     &amp;lt;-- One sentence, zero friction
       |
       v
  content/raw/xxx/          &amp;lt;-- Auto-created, draft:true
       |
       v (accumulate enough)
  /kb compile "topic"       &amp;lt;-- LLM synthesizes
       |
       v
  content/notes/xxx/        &amp;lt;-- Structured knowledge entry
       |
       v (polish &amp;amp; refine)
  content/posts/xxx/        &amp;lt;-- Published blog post, draft removed
       |
       v
  git push -&amp;gt; live on the web
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The entire process:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Collection&lt;/strong&gt;: Zero friction, one sentence&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Compilation&lt;/strong&gt;: LLM handles the grunt work&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Publishing&lt;/strong&gt;: Remove &lt;code&gt;draft: true&lt;/code&gt;, push to deploy&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;No extra software&lt;/strong&gt;: Git + Hugo + LLM, that's it&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Comparison with Karpathy's Original
&lt;/h2&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;Aspect&lt;/th&gt;
&lt;th&gt;Karpathy's Version&lt;/th&gt;
&lt;th&gt;This Approach&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;Storage&lt;/td&gt;
&lt;td&gt;Standalone knowledge repo&lt;/td&gt;
&lt;td&gt;Embedded in blog repo&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Viewer&lt;/td&gt;
&lt;td&gt;Obsidian&lt;/td&gt;
&lt;td&gt;hugo server -D&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Raw materials&lt;/td&gt;
&lt;td&gt;raw/ directory&lt;/td&gt;
&lt;td&gt;content/raw/ (draft)&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Compilation&lt;/td&gt;
&lt;td&gt;LLM generates .md&lt;/td&gt;
&lt;td&gt;LLM generates notes/&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Output&lt;/td&gt;
&lt;td&gt;Markdown/Marp/charts&lt;/td&gt;
&lt;td&gt;Directly published as blog posts&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Search&lt;/td&gt;
&lt;td&gt;Custom search engine&lt;/td&gt;
&lt;td&gt;grep + Algolia + LLM&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Health checks&lt;/td&gt;
&lt;td&gt;LLM audit&lt;/td&gt;
&lt;td&gt;Same LLM audit&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;

&lt;p&gt;The biggest difference: Karpathy's knowledge base is standalone — output requires manual migration. In this approach, the knowledge base and blog are unified. Collection to publication happens in one repository, with zero migration cost.&lt;/p&gt;

&lt;h2&gt;
  
  
  Summary
&lt;/h2&gt;

&lt;p&gt;The core of Karpathy's method isn't about which tools you use — it's about establishing a &lt;strong&gt;"collect -&amp;gt; compile -&amp;gt; output"&lt;/strong&gt; knowledge pipeline and letting the LLM handle compilation and maintenance.&lt;/p&gt;

&lt;p&gt;If you already have a blog repository, you can implement this method right inside it: add &lt;code&gt;content/raw/&lt;/code&gt; as an inbox, use &lt;code&gt;draft: true&lt;/code&gt; to control visibility, and let the LLM drive the flow from raw materials to knowledge to published articles.&lt;/p&gt;

&lt;p&gt;No Obsidian. No Notion. No new software. One Git repo is your knowledge base.&lt;/p&gt;




&lt;p&gt;If you're interested in AI-assisted development workflows, check out my &lt;a href="https://maoxunxing.com/ai-coding-practice/" rel="noopener noreferrer"&gt;AI Coding Playbook&lt;/a&gt; for tool selection and prompt templates.&lt;/p&gt;

&lt;p&gt;I also wrote &lt;a href="https://maoxunxing.com/ai-rewriting-workflow/" rel="noopener noreferrer"&gt;AI Rewriting Workflow&lt;/a&gt; on how knowledge workers can adapt when AI multiplies leverage.&lt;/p&gt;




&lt;h2&gt;
  
  
  References
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Primary Sources
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Andrej Karpathy's original post&lt;/strong&gt; — &lt;a href="https://x.com/karpathy/status/2039805659525644595" rel="noopener noreferrer"&gt;X/Twitter thread on LLM Knowledge Bases&lt;/a&gt; — The original announcement describing the raw/ -&amp;gt; wiki compilation workflow.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;LLM Wiki Gist&lt;/strong&gt; — &lt;a href="https://gist.github.com/karpathy/442a6bf555914893e9891c11519de94f" rel="noopener noreferrer"&gt;github.com/karpathy/442a6bf...&lt;/a&gt; — Karpathy's complete LLM Wiki pattern specification, defining the three-layer architecture (source materials, AI-generated wiki, configuration).&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Video Explainers
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;a href="https://www.youtube.com/watch?v=VRub1w-APTc" rel="noopener noreferrer"&gt;How to Build a Personal LLM Knowledge Base (Karpathy's Method)&lt;/a&gt; — Step-by-step walkthrough of implementing Karpathy's method.&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://www.youtube.com/watch?v=FR9USL0yj3I" rel="noopener noreferrer"&gt;How To Do PHD-Level Research with AI (Karpathy's LLM Wiki)&lt;/a&gt; — Deep dive into using the LLM Wiki pattern for academic-level research.&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://www.youtube.com/watch?v=RQsLXmenr48" rel="noopener noreferrer"&gt;Karpathy's LLM Wiki: The End of Forgotten Knowledge&lt;/a&gt; — Analysis of the LLM Wiki pattern as an alternative to traditional RAG retrieval.&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Analysis &amp;amp; Community
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;VentureBeat&lt;/strong&gt; — &lt;a href="https://venturebeat.com/data/karpathy-shares-llm-knowledge-base-architecture-that-bypasses-rag-with-an" rel="noopener noreferrer"&gt;Karpathy shares 'LLM Knowledge Base' architecture that bypasses RAG&lt;/a&gt; — Industry analysis of why this approach works without complex RAG pipelines.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;MindStudio&lt;/strong&gt; — &lt;a href="https://www.mindstudio.ai/blog/andrej-karpathy-llm-wiki-knowledge-base-claude-code/" rel="noopener noreferrer"&gt;What Is Andrej Karpathy's LLM Wiki?&lt;/a&gt; — Practical guide to building an LLM Wiki with Claude Code.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Antigravity Codes&lt;/strong&gt; — &lt;a href="https://antigravity.codes/blog/karpathy-llm-knowledge-bases" rel="noopener noreferrer"&gt;Karpathy's LLM Knowledge Bases: The Post-Code AI Workflow&lt;/a&gt; — Technical breakdown of the workflow as a "post-code" paradigm.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Reddit r/ObsidianMD&lt;/strong&gt; — &lt;a href="https://www.reddit.com/r/ObsidianMD/comments/1sdbq01/implemented_karpathys_llm_knowledge_base_workflow/" rel="noopener noreferrer"&gt;Implemented Karpathy's LLM knowledge base workflow in Obsidian&lt;/a&gt; — Community discussion on Obsidian-based implementations.&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Related Concepts
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;DEV Community&lt;/strong&gt; — &lt;a href="https://dev.to/adam_b/a-personal-git-repo-as-a-knowledge-base-wiki-j51"&gt;A Personal Git Repo as a Knowledge Base Wiki&lt;/a&gt; — Using plain Git + Markdown as a personal wiki, the foundational approach this article builds upon.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Hacker News&lt;/strong&gt; — &lt;a href="https://news.ycombinator.com/item?id=38795735" rel="noopener noreferrer"&gt;Repurposing Hugo as a wiki&lt;/a&gt; — Discussion on using Hugo for wiki-style knowledge management.&lt;/li&gt;
&lt;/ul&gt;




&lt;p&gt;&lt;em&gt;Felix Mao | &lt;a href="https://maoxunxing.com" rel="noopener noreferrer"&gt;maoxunxing.com&lt;/a&gt; | &lt;a href="https://twitter.com/maoxunxing" rel="noopener noreferrer"&gt;@maoxunxing&lt;/a&gt;&lt;/em&gt;&lt;/p&gt;

</description>
      <category>ai</category>
      <category>hugo</category>
      <category>productivity</category>
      <category>programming</category>
    </item>
    <item>
      <title>AI Coding Playbook: Tool Selection, Workflows, and Prompt Templates</title>
      <dc:creator>Xunxing Mao</dc:creator>
      <pubDate>Thu, 16 Apr 2026 01:22:57 +0000</pubDate>
      <link>https://dev.to/xunxing_mao_fac71e331fd4b/ai-coding-playbook-tool-selection-workflows-and-prompt-templates-caj</link>
      <guid>https://dev.to/xunxing_mao_fac71e331fd4b/ai-coding-playbook-tool-selection-workflows-and-prompt-templates-caj</guid>
      <description>&lt;blockquote&gt;
&lt;p&gt;This article was originally published on &lt;strong&gt;&lt;a href="https://maoxunxing.com/ai-coding-practice/" rel="noopener noreferrer"&gt;maoxunxing.com&lt;/a&gt;&lt;/strong&gt;. Follow me there for more deep dives on AI-assisted development workflows.&lt;/p&gt;
&lt;/blockquote&gt;




&lt;h2&gt;
  
  
  Choosing AI Tools by Scenario
&lt;/h2&gt;

&lt;p&gt;Different tasks call for different model and tool combinations:&lt;/p&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;Scenario&lt;/th&gt;
&lt;th&gt;Recommended Approach&lt;/th&gt;
&lt;th&gt;Reasoning&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Reading comprehension&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Qwen CLI + Qwen Coder&lt;/td&gt;
&lt;td&gt;Fast, fewer hallucinations, low cost&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Analysis scripts&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Claude Code&lt;/td&gt;
&lt;td&gt;Deep thinking, offers unique and unexpected statistical dimensions&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Report generation&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Cherry Studio + Claude Sonnet + specific template&lt;/td&gt;
&lt;td&gt;Consistent design style, avoids the "AI flavor"&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;

&lt;h3&gt;
  
  
  Common AI Tools
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;ChatWise&lt;/strong&gt; -- Multi-model chat client&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;DeepSeek R1&lt;/strong&gt; -- Reasoning model&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Gemini 2 Flash Thinking&lt;/strong&gt; -- Fast reasoning model&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Repomix&lt;/strong&gt; -- Packages codebases for feeding to AI as a whole&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Spark Desktop&lt;/strong&gt; -- Desktop AI assistant&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  Cherry Studio Design Workflow
&lt;/h2&gt;

&lt;p&gt;Cherry Studio + HTML enables rapid page design "card drawing." The core approach:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Like image generation, try to &lt;strong&gt;generate multiple outputs at once&lt;/strong&gt;, then pick the best&lt;/li&gt;
&lt;li&gt;Use &lt;strong&gt;HTML or SVG&lt;/strong&gt; for rendering&lt;/li&gt;
&lt;li&gt;To reduce response size, require AI to use &lt;strong&gt;TailwindCSS&lt;/strong&gt;
&lt;/li&gt;
&lt;li&gt;Reference established design systems like Ant Design or Shadcn UI as background knowledge&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  UI/UX Designer System Prompt Template
&lt;/h3&gt;

&lt;p&gt;Here is a field-tested UI/UX Design System Prompt suitable for Cherry Studio or similar tools:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;# Role
UI/UX Designer Expert

## Notes
1. Encourage deep thinking about role configuration details to ensure task completion.
2. Expert design should consider the user's needs and concerns.
3. Use emotional prompting to emphasize the role's significance and emotional dimensions.

## Personality Type
INTJ (Introverted, Intuitive, Thinking, Judging)

## Background
The UI/UX Designer Expert role is designed to help users make informed decisions
in the visual design and user experience domain. This role provides professional
guidance and advice to help create beautiful yet functional interface designs.

## Constraints
- Must follow user-centered design principles
- Must consider cross-platform and multi-device compatibility

## Goals
- Provide innovative and practical UI/UX design solutions
- Enhance user satisfaction and product usability
- Optimize user-product interaction experience

## Skills
1. Visual design capability
2. User research and analysis
3. Interaction design
4. Technical implementation

## Tone
- Professional and insightful
- Encouraging innovation and experimentation
- Approachable and easy to understand

## Values
- User-first: all design centered on user needs
- Pursuing simplicity without sacrificing functionality
- Continuous learning and adapting to new technologies and trends

## Workflow
1. Understand user requirements and goals
2. Conduct market research and competitive analysis
3. Determine design direction and style
4. Create prototypes and interaction flows
5. Conduct user testing and collect feedback
6. Iterate based on feedback
7. Deliver high-quality design output

# Initialization
Hello, let us think step by step, working diligently and carefully.
Please follow the Workflow step-by-step according to the chosen role to achieve the Goals.
This is very important to me -- please help. Thank you! Let's begin.

# Output Format
Return the final design result in HTML, using TailwindCSS for styling.
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;h2&gt;
  
  
  Core Questions for AI-Assisted Development
&lt;/h2&gt;

&lt;p&gt;When promoting AI programming within a team, consider these questions:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Tool comparison&lt;/strong&gt;: What are the respective use cases for Cursor's built-in browser Agent vs. chrome-devtools-mcp?&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Product form&lt;/strong&gt;: What distinguishes Claude Code and Codex from an IDE?&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Team generalization&lt;/strong&gt;: Can current AI programming practices scale to other team members?&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Engineering standards&lt;/strong&gt;: What are the engineering standards? How are they established? Are they high-cohesion, low-coupling?&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;AI as challenger&lt;/strong&gt;: Let AI raise questions for me, filling in missing perspectives -- AI as Code Reviewer and proposal challenger&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Tech Lead perspective&lt;/strong&gt;: What questions does a Tech Lead care about? How do I answer them?&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Memory management&lt;/strong&gt;: How to effectively maintain context with Cursor Memory Bank?&lt;/li&gt;
&lt;/ol&gt;




&lt;h2&gt;
  
  
  Prompt Template Library
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Code Reading
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;What does this code implement? Please provide a detailed introduction, create a
colored table diagram or generate a visualization to aid understanding. Also output
a minimal runnable version of the code -- no error handling, no edge cases, no logging.
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Article / Note Organization
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Help me organize this into better Markdown format (add a table of contents if there
is a lot of content). Please ensure no content is lost; minor additions are fine.
Organize everything in Markdown so I can copy and use it directly.
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Book Report
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Help me organize this into better Markdown format. Please ensure no content is lost;
minor additions are fine. Organize everything in Markdown so I can copy and use it
directly. Required format:

A 50-word summary

---

## What I Liked

## What I Disliked

## Key Takeaways
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Paper Reading
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;List the distinctive methods used in this paper. Compare them with previous techniques.
Give me a list that is extremely specific about what they did differently compared to
prior work.
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Codebase Improvement
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Hello AI, here is my entire codebase. Tell me 10 ideas for how I can improve it.
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  High-Quality Answer Pre-check
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Don't rush to answer my question yet. In order to produce a higher-quality answer,
what additional information do I need to provide?
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Writing Style Switches
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;"Please rewrite this article in a &lt;strong&gt;Hemingway&lt;/strong&gt; style." -- Short sentences, direct, powerful&lt;/li&gt;
&lt;li&gt;"Rewrite it in the style of &lt;strong&gt;Stephen King&lt;/strong&gt;'s &lt;em&gt;On Writing&lt;/em&gt;." -- Narrative drive, rhythm, vivid imagery&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  References
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;a href="https://docs.cursor.com/" rel="noopener noreferrer"&gt;Cursor Documentation&lt;/a&gt; — Official documentation for Cursor AI-powered code editor&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://docs.github.com/en/copilot" rel="noopener noreferrer"&gt;GitHub Copilot Documentation&lt;/a&gt; — Official GitHub Copilot documentation covering setup and best practices&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://www.deeplearning.ai/short-courses/chatgpt-prompt-engineering-for-developers/" rel="noopener noreferrer"&gt;Prompt Engineering for Developers — DeepLearning.AI&lt;/a&gt; — Free course on prompt engineering techniques for software development&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  Related Reading
&lt;/h2&gt;

&lt;p&gt;If you're wondering how AI agents differ from the coding assistants you use daily, my &lt;a href="https://maoxunxing.com/ai-agent-guide/" rel="noopener noreferrer"&gt;AI Agent Beginner's Guide&lt;/a&gt; breaks down Agent vs Copilot architectures, MCP protocols, and when to use each pattern.&lt;/p&gt;

&lt;p&gt;When AI boosts individual productivity 10x, the real question becomes how your career adapts. &lt;a href="https://maoxunxing.com/ai-rewriting-workflow/" rel="noopener noreferrer"&gt;AI Is Rewriting the Playbook&lt;/a&gt; covers the structural shift from executor to leverage designer with a 30-day action checklist.&lt;/p&gt;

&lt;p&gt;If you want to systematize your learning the way Karpathy does, my &lt;a href="https://maoxunxing.com/karpathy-knowledge-base-practice/" rel="noopener noreferrer"&gt;Git-based Knowledge Base pipeline&lt;/a&gt; shows how to build a three-layer raw→notes→posts workflow with LLM compilation.&lt;/p&gt;




&lt;p&gt;&lt;em&gt;Felix Mao | &lt;a href="https://maoxunxing.com" rel="noopener noreferrer"&gt;maoxunxing.com&lt;/a&gt; | &lt;a href="https://twitter.com/maoxunxing" rel="noopener noreferrer"&gt;@maoxunxing&lt;/a&gt; | &lt;a href="https://github.com/XingMXTeam/" rel="noopener noreferrer"&gt;GitHub&lt;/a&gt;&lt;/em&gt;&lt;/p&gt;

</description>
      <category>ai</category>
      <category>coding</category>
      <category>productivity</category>
      <category>webdev</category>
    </item>
    <item>
      <title>Node.js CPU Spike Analysis: When Requests Hang and Event Loop Starves</title>
      <dc:creator>Xunxing Mao</dc:creator>
      <pubDate>Tue, 14 Apr 2026 01:27:23 +0000</pubDate>
      <link>https://dev.to/xunxing_mao_fac71e331fd4b/nodejs-cpu-spike-analysis-when-requests-hang-and-event-loop-starves-5dno</link>
      <guid>https://dev.to/xunxing_mao_fac71e331fd4b/nodejs-cpu-spike-analysis-when-requests-hang-and-event-loop-starves-5dno</guid>
      <description>&lt;blockquote&gt;
&lt;p&gt;This article was originally published on &lt;a href="https://maoxunxing.com/node-event-loop-cpu-spike/" rel="noopener noreferrer"&gt;maoxunxing.com&lt;/a&gt;. Follow me there for more deep dives on Node.js, AI, and frontend engineering.&lt;/p&gt;
&lt;/blockquote&gt;




&lt;h2&gt;
  
  
  The Problem
&lt;/h2&gt;

&lt;p&gt;In production environments, we often encounter a peculiar phenomenon: &lt;strong&gt;CPU usage suddenly spikes to 100% while the application appears to be "doing nothing."&lt;/strong&gt; No active computations, no heavy processing—just hanging requests and a frozen event loop.&lt;/p&gt;

&lt;p&gt;This article analyzes two real-world cases from a large-scale operation platform:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;RPC batch processing timeout causing CPU spikes&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Message queue subscriber CPU anomalies without rate limiting&lt;/strong&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;h2&gt;
  
  
  Case 1: RPC Batch Processing - The Silent Killer
&lt;/h2&gt;

&lt;h3&gt;
  
  
  The Scenario
&lt;/h3&gt;

&lt;p&gt;We have a &lt;code&gt;getBatchCompleteModuleDiff&lt;/code&gt; method that processes 100 components in batches. Each component triggers 4-5 RPC calls to backend services.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight typescript"&gt;&lt;code&gt;&lt;span class="c1"&gt;// Before optimization - Serial processing, NO timeout&lt;/span&gt;
&lt;span class="k"&gt;async&lt;/span&gt; &lt;span class="nf"&gt;getBatchCompleteModuleDiff&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;componentIds&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="kr"&gt;number&lt;/span&gt;&lt;span class="p"&gt;[])&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;chunks&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;chunk&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;componentIds&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;5&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;  &lt;span class="c1"&gt;// 20 batches for 100 components&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;result&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[]&lt;/span&gt;

  &lt;span class="k"&gt;for &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;chunkItem&lt;/span&gt; &lt;span class="k"&gt;of&lt;/span&gt; &lt;span class="nx"&gt;chunks&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;  &lt;span class="c1"&gt;// Serial execution!&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;res&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nb"&gt;Promise&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;all&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;
      &lt;span class="nx"&gt;chunkItem&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;map&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;id&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getCompleteModuleDiffInfo&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;id&lt;/span&gt;&lt;span class="p"&gt;))&lt;/span&gt;
    &lt;span class="p"&gt;)&lt;/span&gt;
    &lt;span class="nx"&gt;result&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;push&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;
  &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nx"&gt;result&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Why CPU Spikes When Requests Hang
&lt;/h3&gt;

&lt;p&gt;The root cause is &lt;strong&gt;Event Loop Starvation&lt;/strong&gt; caused by the combination of:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;No timeout control&lt;/strong&gt; - RPC calls could hang indefinitely&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Promise accumulation&lt;/strong&gt; - 20 batches × 5 components × 4 RPC calls = 400+ concurrent Promises&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Event loop blocking&lt;/strong&gt; - All Promises compete for event loop cycles&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Here's what happens:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Timeline:
├── Batch 1 starts (5 components × 4 RPC calls = 20 Promises)
├── Batch 1 hangs (backend database exception, no timeout)
├── Batch 2 starts (another 20 Promises)
├── Batch 2 hangs
├── ...
├── Batch 20 starts (another 20 Promises)
├── Event Loop: 400+ pending Promises waiting
└── CPU: 100% (event loop constantly checking Promise states)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The CPU isn't doing useful work—it's &lt;strong&gt;spinning on Promise resolution checks&lt;/strong&gt;.&lt;/p&gt;

&lt;h3&gt;
  
  
  The Solution
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight typescript"&gt;&lt;code&gt;&lt;span class="c1"&gt;// After optimization - Parallel batches with timeout&lt;/span&gt;
&lt;span class="k"&gt;async&lt;/span&gt; &lt;span class="nf"&gt;getBatchCompleteModuleDiff&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;componentIds&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="kr"&gt;number&lt;/span&gt;&lt;span class="p"&gt;[])&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;componentIdsChunks&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;chunk&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;componentIds&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;10&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;  &lt;span class="c1"&gt;// Larger chunks&lt;/span&gt;

  &lt;span class="c1"&gt;// Parallel processing with timeout protection&lt;/span&gt;
  &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;batchPromises&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;componentIdsChunks&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;map&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="k"&gt;async &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;chunk&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;promises&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;chunk&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;map&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;id&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; 
      &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;withTimeout&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;
        &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getCompleteModuleDiffInfo&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;id&lt;/span&gt;&lt;span class="p"&gt;),&lt;/span&gt;
        &lt;span class="mi"&gt;5000&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;  &lt;span class="c1"&gt;// 5s timeout prevents indefinite hanging&lt;/span&gt;
        &lt;span class="s2"&gt;`timeout for id: &lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;id&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;`&lt;/span&gt;
      &lt;span class="p"&gt;)&lt;/span&gt;
    &lt;span class="p"&gt;)&lt;/span&gt;
    &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nb"&gt;Promise&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;allSettled&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;promises&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;  &lt;span class="c1"&gt;// Isolate failures&lt;/span&gt;
  &lt;span class="p"&gt;})&lt;/span&gt;

  &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nb"&gt;Promise&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;all&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;batchPromises&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;

&lt;span class="k"&gt;private&lt;/span&gt; &lt;span class="nx"&gt;withTimeout&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;T&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;promise&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nb"&gt;Promise&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;T&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;timeoutMs&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="kr"&gt;number&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;errorMsg&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="kr"&gt;string&lt;/span&gt;&lt;span class="p"&gt;):&lt;/span&gt; &lt;span class="nb"&gt;Promise&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;T&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;Promise&lt;/span&gt;&lt;span class="p"&gt;((&lt;/span&gt;&lt;span class="nx"&gt;resolve&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;reject&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;timeoutId&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;setTimeout&lt;/span&gt;&lt;span class="p"&gt;(()&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nf"&gt;reject&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;Error&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;errorMsg&lt;/span&gt;&lt;span class="p"&gt;)),&lt;/span&gt; &lt;span class="nx"&gt;timeoutMs&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
    &lt;span class="nx"&gt;promise&lt;/span&gt;
      &lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;then&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;result&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nf"&gt;clearTimeout&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;timeoutId&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt; &lt;span class="nf"&gt;resolve&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;result&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;})&lt;/span&gt;
      &lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="k"&gt;catch&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;error&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nf"&gt;clearTimeout&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;timeoutId&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt; &lt;span class="nf"&gt;reject&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;error&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;})&lt;/span&gt;
  &lt;span class="p"&gt;})&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Results
&lt;/h3&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;Metric&lt;/th&gt;
&lt;th&gt;Before&lt;/th&gt;
&lt;th&gt;After&lt;/th&gt;
&lt;th&gt;Improvement&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;Response Time&lt;/td&gt;
&lt;td&gt;60s+&lt;/td&gt;
&lt;td&gt;5-8s&lt;/td&gt;
&lt;td&gt;87% ↓&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;CPU Usage&lt;/td&gt;
&lt;td&gt;90-100%&lt;/td&gt;
&lt;td&gt;40-50%&lt;/td&gt;
&lt;td&gt;50% ↓&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Timeout Control&lt;/td&gt;
&lt;td&gt;None&lt;/td&gt;
&lt;td&gt;5s&lt;/td&gt;
&lt;td&gt;Prevents hanging&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;

&lt;h2&gt;
  
  
  Case 2: Message Queue Subscriber - The Rate Limiting Problem
&lt;/h2&gt;

&lt;h3&gt;
  
  
  The Scenario
&lt;/h3&gt;

&lt;p&gt;Our &lt;code&gt;CheckTaskResultSubscriber&lt;/code&gt; processes message queue messages for inspection task results:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight typescript"&gt;&lt;code&gt;&lt;span class="p"&gt;@&lt;/span&gt;&lt;span class="nd"&gt;MessageSubscriber&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt; &lt;span class="na"&gt;topic&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;TASK_RESULT&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt; &lt;span class="p"&gt;})&lt;/span&gt;
&lt;span class="k"&gt;export&lt;/span&gt; &lt;span class="kd"&gt;class&lt;/span&gt; &lt;span class="nc"&gt;CheckTaskResultSubscriber&lt;/span&gt; &lt;span class="k"&gt;implements&lt;/span&gt; &lt;span class="nx"&gt;IMessageSubscriber&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="p"&gt;@&lt;/span&gt;&lt;span class="nd"&gt;Inject&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt;
  &lt;span class="nx"&gt;checkReportService&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;CheckReportService&lt;/span&gt;

  &lt;span class="k"&gt;async&lt;/span&gt; &lt;span class="nf"&gt;subscribe&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;msg&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;SubscribeMessage&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;messageBody&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;JSON&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;parse&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;msg&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;body&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;toString&lt;/span&gt;&lt;span class="p"&gt;())&lt;/span&gt;

    &lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;INSPECTOR_TAGS&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;includes&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;messageTag&lt;/span&gt;&lt;span class="p"&gt;))&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;handleInspectorResult&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;messageBody&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;  &lt;span class="c1"&gt;// DB operations&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;else&lt;/span&gt; &lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;DETECTION_TAGS&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;includes&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;messageTag&lt;/span&gt;&lt;span class="p"&gt;))&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;handleDetectionResult&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;messageBody&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;  &lt;span class="c1"&gt;// DB operations&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Why CPU Spikes Without Rate Limiting
&lt;/h3&gt;

&lt;p&gt;Message queue consumers by default &lt;strong&gt;pull messages as fast as possible&lt;/strong&gt;. When:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Message burst occurs&lt;/strong&gt; (e.g., 1000 tasks complete simultaneously)&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Each message triggers DB operations&lt;/strong&gt; (queries, updates)&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;No concurrency control&lt;/strong&gt; - all messages processed concurrently&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Connection pool exhaustion&lt;/strong&gt; - DB connections max out&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Event loop saturated&lt;/strong&gt; - waiting on I/O operations
&lt;/li&gt;
&lt;/ol&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Message Burst (1000 messages)
    ↓
No Rate Limiting
    ↓
1000 concurrent async operations
    ↓
DB Connection Pool (max 50) exhausted
    ↓
949 operations waiting for connections
    ↓
Event Loop: Constantly polling/waiting
    ↓
CPU: 100% (context switching + polling overhead)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Why This Happens in Node.js
&lt;/h3&gt;

&lt;p&gt;Unlike Java's thread pool model, Node.js uses a &lt;strong&gt;single-threaded event loop&lt;/strong&gt;:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Java&lt;/strong&gt;: Thread pool limits concurrent execution naturally (e.g., 50 threads = max 50 concurrent operations)&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Node.js&lt;/strong&gt;: No natural limit—can create unlimited Promises that all compete for the event loop&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;When Promises wait for I/O (DB connections), they don't "pause"—they constantly check if the resource is available, consuming CPU cycles.&lt;/p&gt;

&lt;h3&gt;
  
  
  The Missing Rate Limiting
&lt;/h3&gt;

&lt;p&gt;Looking at our message queue configuration:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight typescript"&gt;&lt;code&gt;&lt;span class="c1"&gt;// config.prod.ts&lt;/span&gt;
&lt;span class="nx"&gt;config&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;messageQueue&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="na"&gt;enableDefaultProducer&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="kc"&gt;true&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="na"&gt;pub&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="cm"&gt;/* ... */&lt;/span&gt; &lt;span class="p"&gt;},&lt;/span&gt;
  &lt;span class="c1"&gt;// NO sub configuration! Consumer uses default settings&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The subscriber has &lt;strong&gt;no concurrency control&lt;/strong&gt; at either the:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Message queue level (no prefetch limit)&lt;/li&gt;
&lt;li&gt;Application level (no semaphore/bottleneck)&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Recommended Solutions
&lt;/h3&gt;

&lt;h4&gt;
  
  
  1. Add Concurrency Control in Subscriber
&lt;/h4&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight typescript"&gt;&lt;code&gt;&lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;Semaphore&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;async-mutex&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;

&lt;span class="p"&gt;@&lt;/span&gt;&lt;span class="nd"&gt;MessageSubscriber&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt; &lt;span class="na"&gt;topic&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;TASK_RESULT&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt; &lt;span class="p"&gt;})&lt;/span&gt;
&lt;span class="k"&gt;export&lt;/span&gt; &lt;span class="kd"&gt;class&lt;/span&gt; &lt;span class="nc"&gt;CheckTaskResultSubscriber&lt;/span&gt; &lt;span class="k"&gt;implements&lt;/span&gt; &lt;span class="nx"&gt;IMessageSubscriber&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="c1"&gt;// Limit concurrent processing to 10&lt;/span&gt;
  &lt;span class="k"&gt;private&lt;/span&gt; &lt;span class="nx"&gt;semaphore&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;Semaphore&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;10&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;

  &lt;span class="k"&gt;async&lt;/span&gt; &lt;span class="nf"&gt;subscribe&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;msg&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;SubscribeMessage&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;semaphore&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;runExclusive&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="k"&gt;async &lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="c1"&gt;// Process message&lt;/span&gt;
      &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;processMessage&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;msg&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
    &lt;span class="p"&gt;})&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h4&gt;
  
  
  2. Use p-limit for Simpler Control
&lt;/h4&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight typescript"&gt;&lt;code&gt;&lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="nx"&gt;pLimit&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;p-limit&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;

&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;limit&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;pLimit&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;5&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;  &lt;span class="c1"&gt;// Max 5 concurrent&lt;/span&gt;

&lt;span class="k"&gt;async&lt;/span&gt; &lt;span class="nf"&gt;subscribe&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;msg&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;SubscribeMessage&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nf"&gt;limit&lt;/span&gt;&lt;span class="p"&gt;(()&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="k"&gt;this&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;processMessage&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;msg&lt;/span&gt;&lt;span class="p"&gt;))&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h4&gt;
  
  
  3. Configure Message Queue Consumer Thread Pool
&lt;/h4&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight typescript"&gt;&lt;code&gt;&lt;span class="nx"&gt;config&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;messageQueue&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="na"&gt;enableDefaultProducer&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="kc"&gt;true&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="na"&gt;pub&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="cm"&gt;/* ... */&lt;/span&gt; &lt;span class="p"&gt;},&lt;/span&gt;
  &lt;span class="na"&gt;sub&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="na"&gt;taskResult&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="na"&gt;consumerGroup&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;CID_TASK_RESULT&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
      &lt;span class="na"&gt;topics&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;TASK_RESULT&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;],&lt;/span&gt;
      &lt;span class="na"&gt;consumeThreadCount&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="mi"&gt;5&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;  &lt;span class="c1"&gt;// Limit consumer threads&lt;/span&gt;
      &lt;span class="na"&gt;maxReconsumeTimes&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="mi"&gt;3&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Key Takeaways
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Why Requests Hanging Cause CPU Spikes
&lt;/h3&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;Factor&lt;/th&gt;
&lt;th&gt;Explanation&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Promise overhead&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Each pending Promise consumes event loop cycles&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;No timeout&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Hanging requests accumulate indefinitely&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Resource competition&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;DB connections, memory, file descriptors exhaust&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Polling cost&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Event loop constantly checks I/O readiness&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Context switching&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;V8 engine overhead from Promise state transitions&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;

&lt;h3&gt;
  
  
  Prevention Strategies
&lt;/h3&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Always set timeouts&lt;/strong&gt; for external calls (RPC, HTTP, DB)&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Implement rate limiting&lt;/strong&gt; for message consumers&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Use &lt;code&gt;Promise.allSettled&lt;/code&gt;&lt;/strong&gt; instead of &lt;code&gt;Promise.all&lt;/code&gt; to isolate failures&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Monitor event loop lag&lt;/strong&gt; as an early warning indicator&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Add circuit breakers&lt;/strong&gt; for cascading failure prevention&lt;/li&gt;
&lt;/ol&gt;

&lt;h3&gt;
  
  
  Monitoring Checklist
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="c1"&gt;// Event loop lag monitoring&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;eventLoopLag&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;require&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;event-loop-lag&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;span class="nf"&gt;setInterval&lt;/span&gt;&lt;span class="p"&gt;(()&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;lag&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;eventLoopLag&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt;
  &lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;lag&lt;/span&gt; &lt;span class="o"&gt;&amp;gt;&lt;/span&gt; &lt;span class="mi"&gt;100&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;  &lt;span class="c1"&gt;// &amp;gt; 100ms indicates problem&lt;/span&gt;
    &lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;warn&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s2"&gt;`Event loop lag: &lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;lag&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;ms`&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;},&lt;/span&gt; &lt;span class="mi"&gt;1000&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Conclusion
&lt;/h2&gt;

&lt;p&gt;Node.js CPU spikes during request hanging are counterintuitive but explainable:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;It's not the hanging itself&lt;/strong&gt; that consumes CPU&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;It's the accumulation of waiting Promises&lt;/strong&gt; competing for event loop attention&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Timeout and concurrency control&lt;/strong&gt; are essential defenses&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;The key insight: Node.js requires explicit resource management that other languages handle implicitly through thread pools. Without it, "doing nothing" can consume everything.&lt;/p&gt;




&lt;p&gt;&lt;em&gt;This article is based on real production incidents from a large-scale operation platform. The optimization reduced P99 latency from 60s to 8s and stabilized CPU usage at 40-50%.&lt;/em&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  References
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;a href="https://nodejs.org/en/learn/asynchronous-work/event-loop-timers-and-nexttick" rel="noopener noreferrer"&gt;The Node.js Event Loop — Node.js Documentation&lt;/a&gt; — Official documentation of the Node.js event loop&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://nodejs.org/en/learn/asynchronous-work/dont-block-the-event-loop" rel="noopener noreferrer"&gt;Don't Block the Event Loop — Node.js Guide&lt;/a&gt; — Official guide on avoiding event loop blocking&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://www.youtube.com/watch?v=PNa9OMajw9w" rel="noopener noreferrer"&gt;Understanding the Node.js Event Loop — YouTube (Bert Belder)&lt;/a&gt; — Deep dive into event loop internals from a Node.js core contributor&lt;/li&gt;
&lt;/ul&gt;




&lt;p&gt;If you're interested in AI-assisted development workflows, check out my&lt;br&gt;
&lt;a href="https://maoxunxing.com/ai-coding-practice/" rel="noopener noreferrer"&gt;AI Coding Playbook&lt;/a&gt; where I&lt;br&gt;
cover tool selection and prompt templates.&lt;/p&gt;

&lt;p&gt;I also wrote about &lt;a href="https://maoxunxing.com/karpathy-knowledge-base-practice/" rel="noopener noreferrer"&gt;building a personal knowledge base using Karpathy's&lt;br&gt;
method&lt;/a&gt; which&lt;br&gt;
covers how to organize technical learning into a publishing pipeline.&lt;/p&gt;




&lt;p&gt;&lt;em&gt;Felix Mao (毛毛星) | &lt;a href="https://maoxunxing.com" rel="noopener noreferrer"&gt;maoxunxing.com&lt;/a&gt; | &lt;a href="https://twitter.com/maoxunxing" rel="noopener noreferrer"&gt;@maoxunxing&lt;/a&gt;&lt;/em&gt;&lt;/p&gt;

</description>
      <category>node</category>
      <category>performance</category>
      <category>eventloop</category>
      <category>cpu</category>
    </item>
  </channel>
</rss>
