使用案例：为代码审查提供视觉辅助

对于前端开发者来说，代码审查不仅关乎逻辑，更关乎最终的视觉呈现。Full Page Screenshot 可以帮助您在 Pull Request (PR) 中清晰地展示 UI 相关的更改，极大地提升审查效率。

为什么截图能加速代码审查？

• 超越代码: 代码本身无法完全展示视觉效果。截图提供了“所见即所得”的证明，让审查者一目了然。
• 清晰的“之前”与“之后”: 在 PR 描述中附上带有标注的截图，可以清晰地展示您修复了什么，或新增了什么。
• 为审查者节省时间: 审查者无需切换分支、拉取代码、安装依赖和本地运行，即可快速了解 UI 变化，从而更快地提供反馈。

操作步骤

第一步：捕获“之前”与“之后”的状态

在您开始编写代码之前，先对当前存在问题的 UI 进行截图，这就是“之前”的状态。完成代码更改后，在本地运行您的应用，并对新的 UI 效果进行截图，这就是“之后”的状态。

第二步：高亮核心变化

在编辑器中，您可以对“之后”的截图进行标注，以突出您的工作成果：

1. 使用箭头和矩形工具: 明确指出您所修复或改进的 UI 元素。
2. 添加文字说明: 如果需要，可以添加简短的文字，解释此项更改的目的或效果。
3. 制作对比图: 您可以将“之前”和“之后”的截图在任何图片编辑工具中拼接成一张对比图，效果更佳。

第三步：附加到您的 Pull Request 中

将处理好的截图上传到您的 Pull Request 描述中。在描述文字中，您可以引导审查者查看截图，例如：“请查看下面的截图，展示了新的布局效果。”

这能帮助团队成员快速抓住您工作的核心价值，并围绕视觉效果给出更精确的反馈。

最佳实践

提示: 对于涉及复杂交互或动画的更改，一张静态截图可能不够。在这种情况下，可以考虑录制一个简短的 GIF 动画，并将其与您的截图一起附加到 PR 描述中，以提供最完整的上下文。