AI Agent 幫你跑購物和 UI 測試，工程師的四層架構拆解

四層架構讓瀏覽器 agent 從一次性 script 變成系統：skill 定義能力，agent 規模化，command 編排，Justfile 統一呼叫。文章也解釋 CLI 比 MCP 省 token 的具體原因。 ⭐ 文章深度讀：四層架構讓 agent 從一次性 script 變成可複用系統的完整設計邏輯 → https://heymaibao.com/ai-agent-browser-automation-ui-testing-four-layer-architecture/ 📝 懶人包 ∙ Claude Code 有兩種瀏覽器工具，各有取捨：內建的 --chrome flag 直接用你現有的瀏覽器 session，有登入狀態、cookie，但一次只能跑一個；Playwright CLI (一個開源的瀏覽器自動化工具) 支援 headless 無頭模式，可以同時跑多個 session，Bowser 把兩者都整合進同一套系統。 ∙ 技能只是能力，Agent 才是讓能力規模化的地方。Dan 的四層架構把各層分工講得很清楚：第一層 skill 給工具，第二層 agent 給專門化流程，第三層 commands 給編排，第四層 Justfile 給可重用的一鍵呼叫。 ∙ CLI 明確比 MCP server 省 token 且更彈性。Dan 的說法是：MCP server 消耗大量 token，而且你只能照 server 建立者的方式用它；CLI 讓你自己包裝，自己決定要怎麼用。這是一個可以直接套用的工程判斷。 ∙ 我的觀點：Dan 說「程式碼已完全商品化」不是在說廢話。他的意思是，當用 AI 生成程式碼變得輕而易舉，真正稀缺的能力移位了，移到「如何設計 agent 系統」、「如何把工具組合成可複用的工作流」。這個洞察直接對應到他系統的每一個設計決策，從為什麼要分四層，到為什麼要用 CLI 而不是 MCP。不是每個人都需要照著建一個一樣的 Bowser，但這個思考框架值得借用。 📚 參考資料 Bowser Browser Automation System — IndieDevDan → https://youtu.be/efctPj6bjCY