用途：为两个分支之间的 UI 改动生成可视化的前后对比，适合在评审 PR 或描述界面改动时使用。
主要能力：通过 git worktree 同时运行基础分支与功能分支；在两个端口分别启动开发服务器；根据改动文件定位受影响页面；对同一页面分别截图作为 before 与 after；输出带截图的对比报告，并标注具体视觉变化。
使用方式：先为基础分支创建工作树，例如 git worktree add /tmp/branch-compare-base main；在基础工作树中以不同端口启动服务，例如 cd /tmp/branch-compare-base && PORT=3001 npm run dev，当前分支保持默认端口 3000。用 git diff main --name-only | grep -E '.(tsx?|jsx?|vue|svelte|css)' 找出改动文件并映射到路由（如 app/dashboard/page.tsx → /dashboard）。对每个受影响页面，先访问 http://localhost:3001/<page> 截图保存为 before，再访问 http://localhost:3000/<page> 截图保存为 after。最后按页面列出前后截图与变化说明。完成后停止基础分支服务器并用 git worktree remove /tmp/branch-compare-base 清理工作树。
适用场景：前端界面改动的分支对比、PR 描述中的视觉证据、响应式改动验证。
限制与提示：建议使用一致的视口尺寸（如 1280×800），移动优先改动可另在 375px 宽度下对比；若应用需要登录，需先在两个端口完成认证。资料未提供该技能的安装方式、依赖要求与收费信息。