Routing Showcase

這些範例適合放在貼文、issue 或 README 片段中，快速說明為什麼 route 要小而可檢查。

視覺預覽

這段影片只是讓頁面不那麼單調的視覺輔助，不是互動 Demo，也不是實際操作教學。真正的 route before/after 範例在下方。

API 合約同步

Before：

Over-route: backend-developer, api-designer, openapi-contract-generation-skill, openapi-to-typescript, database-optimizer, frontend-design, qa-test-planner

After：

Route: API / Contract lifecycle > Backend-to-frontend sync
Use SKILL: api-designer, openapi-contract-generation-skill, openapi-to-typescript, qa-test-planner

Vue 瀏覽器 regression

Before：

Over-route: vue-expert, frontend-design, browser, playwright, qa-test-planner, api-designer, database-optimizer

After：

Route: Frontend / Vue / UI > Browser regression > State persistence
Use SKILL: vue-expert, systematic-debugging, playwright, qa-test-planner

文件 source-map 清理

Before：

Over-route: code-documenter, spec-miner, frontend-design, devops-engineer, qa-test-planner, github

After：

Route: Documentation / Source map > Link and provenance cleanup
Use SKILL: code-documenter, spec-miner

Database migration 與效能風險

Before：

Over-route: database-schema-designer, sql-pro, database-optimizer, devops-engineer, api-designer, qa-test-planner, frontend-design

After：

Route: Database / Schema and performance > Migration plus query review
Use SKILL: database-schema-designer, sql-pro, database-optimizer, qa-test-planner

Release 與 connector closeout

Before：

Over-route: finishing-a-development-branch, github, receiving-code-review, systematic-debugging, devops-engineer, code-documenter, commit-work

After：

Route: Release / Closeout > GitHub-backed readiness check
Use SKILL: finishing-a-development-branch, github, code-documenter