无形的前端：拯救产品的微小决策

Translated for your language. 阅读原文.

AI-assisted draft.

本文目录

隐形的前端：拯救产品的微小决策

最好的前端工作永远不会出现在演示（demo）中。

我最看重的工作是隐形的。没有人会为它截图。但如果没有这些工作，用户就会流失。你甚至可能永远不知道他们为什么离开。

这些工作发生在缝隙中。发生在页面切换之间，也发生在后端与真实用户之间。

以下是三个通过微小修复防止重大问题的例子。

问题： 前端通过检查一个状态字段来判断登录是否成功。但后端在发送有效 token 的同时，发送了一个 null 状态。尽管用户登录正确，却看到了错误提示。

修复方案： 前端现在改为检查 token 是否存在，而不是检查状态字符串。

教训： 技术规范中一个模糊的字段，会变成用户面前的一扇紧锁的大门。

问题： 用户在新标签页中打开验证链接，而原标签页卡住了。由于第一个标签页没有登录 token，轮询（polling）服务器也会失败。

修复方案： 使用浏览器存储事件（storage event）。当一个标签页更新 localStorage 时，其他所有标签页都会立即收到消息。这是一种免费且即时的标签页同步方式。

问题： “30 秒后重发邮件”的计时器存储在组件状态（component state）中。如果用户刷新页面，计时器就会重置为零。用户会疯狂点击按钮，从而增加了你的邮件发送成本。

修复方案： 不要存储倒计时，而是存储截止时间的时间戳（timestamp）。

通过保存冷却结束的确切时间，计时器在页面刷新后依然有效。通过重新加载页面是无法将其重置的。

• 登录修复保护了用户激活。 • 标签页同步保护了你的转化率。 • 冷却机制保护了你的预算免受滥用。

优秀的工程实践不仅仅是让界面看起来漂亮，更在于对缝隙的极致追求。这些修复工作花费的代码不到五十行。其价值在于发现问题并在正确的地方解决它。