前端技术分享会 · 门禁异常版

完蛋,我门禁刷不开了

我这个每天写按钮、表单、列表和弹窗的前端,是不是已经被优化到门外了?

AI 生成 UI 与前端责任边界的拼贴海报
门口复盘 很多前端人的嘴替:前端还剩下什么?

嘴上说“挺好的,提效工具嘛”。

心里想:“它再提效两轮,我是不是就该提桶了”。

AI 解决的是“更快生成”。
前端还要负责“真的能用”。
先别装 看到 AI 五分钟生成后台系统,心里咯噔一下很正常。
抓住矛盾 它能一口气写十个文件,但线上出问题不会替你进群。
落回工作 把 AI 生成的不确定产物,变成可上线、可解释、可回归的交付。

这个咯噔一下,其实有四层。

01

AI 一分钟生成表单,字段名还起得比我认真。

我还在查 disabled 和 readonly,它已经写完新增、编辑、详情。

被压缩的不是前端,而是只写标准页面的溢价。

拆清楚以后会发现,焦虑不是情绪问题,而是价值坐标开始移动了。

AI 已经进工作流,但还没进责任链。

不是只有前端自己慌:工具层已经接受,结果层还要验证。

84%

工具层已经接受:开发者已经使用或计划使用 AI。

46%

结果层仍然谨慎:不信任 AI 输出准确性的人更多。

33%

真正放心的人更少:信任 AI 输出准确性的比例更低。

DORA

DORA 2026 洞察:速度收益背后还有验证税和集成成本。

在中国我们不说“AI 写好了”,我们说“先跑一遍回归”。

先划一条线:AI 生成页面,不等于交付前端。

  • 页面能打开,不代表字段语义是对的。
  • 接口请求成功,不代表回显、权限、异常都接住了。
  • 当前页面没报错,不代表共享组件影响清楚了。
  • Demo 就算给到夯,交付也可能拉完了。
Demo 页面与真实交付复杂度的舞台隐喻图

既然页面不等于交付,价值就会迁移。

01

从写页面,迁到定义语义

按钮、字段、列表都能生成,但“这个字段到底代表什么、在哪些状态下能改”仍然需要人讲清楚。

02

从堆代码,迁到建模型

默认态之外,还有 loading、empty、error、编辑回显、权限不足、重复提交和旧响应覆盖。

03

从比手速,迁到控风险

AI 让改动更快出现,也让错误更快扩散。前端要把影响范围、验证路径和上线风险拦在提交前。

页面基础,交付就不基础。所以焦虑真正指向的不是“我还会不会写代码”,而是“我能不能负责一个结果”。

AI 最有用的地方,不是替我敲键盘。

Use 01

先读链路

让 AI 画出入口、store、接口、组件和提交路径,把“页面怪怪的”变成可追踪链路。

Use 02

再补状态

让它追问 loading、empty、error、编辑回显、权限、重复提交和旧响应覆盖。

Use 03

最后列风险

一种很新的协作方式:让它专门找方案可能错在哪里,把“可能会炸”变成提交前的验证清单。

案例不用多,讲透哪里需要人兜底。

案例一

按钮 UI 很基础,状态机这一块有说法的。

按钮 UI 很简单,难的是谁能点、什么状态能点、重复点怎么办、点完流向哪里。

AI 的位置

把角色、状态、动作、按钮可见性和接口副作用拆成矩阵,再生成条件渲染和用例。

人的价值

确认权限、幂等、审计、埋点和失败恢复路径,别被同名按钮骗到。

五个问题,把 AI 产出验成交付。

真正的松弛感不是相信 AI,而是知道自己验过。

前端在模糊需求和交付责任之间降低不确定性的链路图
01

AI 能写到哪一步?

低风险重复活可以放手,高风险改动要人主导:权限、资金、发布、共享组件先别闭眼交。

02

默认态之外还有什么?

loading、empty、error、回显、权限、重复提交、旧响应覆盖,少一个都可能被群里@。

03

上下文给够了吗?

入口、接口、字段语义、组件边界、不能改的范围、验收标准,别让 AI 靠脑补开工。

04

哪些路径必须亲自回归?

“看起来能跑”不算过。碰到公共组件、hooks、store 或 schema,就先写清回归路径。

05

这次坑能留下什么?

不要只说“修好了”。留一句下次能触发的 lesson,让一次返工变成下次的提醒。

别和 AI 比手速。

AI 让产出更快,但交付仍然要有人负责。万物皆可 AI,但责任不能全自动。前端人的价值,是把真实系统里的不确定性一层一层降下来。

以后我们不再只靠“写了多少页面”证明自己,而是靠:能拆状态、能讲清业务、能提前列风险、能把 AI 的产出验到可以上线、还能把经验沉淀成下次不用重踩的坑。

我 chovy,你蒸馏 skill 给我蒸馏好的啊!

悄悄话

温暖的同事变成冰冷的 skill,那下一个小压缩包不会是我吧?

后来一想,倒也不用先把自己吓住。与其担心别人来蒸馏我,不如我先把自己这些年攒下来的经验,慢慢整理成 AI 也能听懂的版本。
01

有点慌,也正常

毕竟谁也不想一觉醒来,发现自己从“某某老师”变成了“某某规则 v1.0”。

02

攒一点说明书

有些 bug 上,我和 AI 也算低山臭水遇知音;平时那些 review 直觉和排障习惯,可以悄悄攒成自己的 AI 使用说明书。

03

人还是热的

skill 只是保温杯。真正值钱的,还是你下次遇到新问题时,继续判断、继续负责、继续进化。

所以我现在更愿意把自我蒸馏当成一件小事:每天留一点判断给未来的自己,也顺手让 AI 少装几次新人。

续费友情票

如果刚才有那么一两句给到夯,让你觉得“诶,这个前端还没有完全被优化”,那我就厚着脸皮申请一张友情票。

  1. 01 友情票一张 数量不限,投递随缘。投完不用截图,我会靠空气里的善意感知到。
  2. 02 诚意一整份 没有奶茶券,没有抽奖码,只有一个努力不让大家坐牢的下午。
  3. 03 谢谢不打烊 投我,感谢;不投,也感谢。成年人最大的体面,就是把票数和同事情分分开。

票可以不投,诚意先放这儿了。要是愿意投我一票,我会假装很淡定,然后偷偷开心一整天。