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

完蛋,我门禁刷不开了

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

AI 生成 UI 与前端责任边界的拼贴海报
门口复盘 认真想想:前端还剩下什么?

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

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

AI 解决的是“更快生成”。
前端还要负责“真的能用”。
先别装 看到 AI 五分钟生成后台系统,心里咯噔一下很正常。
抓住矛盾 它能一口气写十个文件,但线上出问题不会替你进群。
落回工作 把“完了要炸”翻译成上下文、边界、验证和 lesson。

四种焦虑,说出来就没那么体面了。

01

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

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

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

大家都在用 AI,但还没有完全信它。

46%

Stack Overflow 2025:开发者不信任 AI 工具输出准确性。

75%

DORA 2025.2:认为 AI 对个人生产力有正向影响。

39%

DORA 2025.2:对 AI 输出质量只有一点信任或不信任。

68%

JetBrains:预计雇主未来会要求 AI 工具熟练度。

AI 把产能提前给你了,但没有把责任一起拿走。

AI 生成页面,不等于交付前端。

  • 数据从哪里来,字段语义是什么?
  • 权限、编辑态、回显和异常怎么处理?
  • 共享组件修改会影响哪些页面?
  • 测试环境、UAT、生产分支怎么走?
Demo 页面与真实交付复杂度的舞台隐喻图

先冷静:不是神化 AI,也不是安慰自己。

Boundary 01

不是 AI 永远不能交付。

上下文、契约和测试越完整,AI 越能接住真实工作。

Boundary 02

不是会用 AI 就自然变强。

模糊需求直接丢给 AI,常常只是把返工也提效了。

Boundary 03

不是所有前端都安全。

上下文少、责任轻、重复度高的工作,最容易被压缩。

四个业务案例:先看哪里会炸。

案例一

远程下拉,不是“请求一下列表”这么简单

请求成功,页面没动。问题通常藏在渲染链路里。

AI 的正确位置

沿着 schema → FormItem → Select → options 查数据到底写到哪里。

人的价值

判断渲染源、过期请求、编辑态回显和共享表单影响。

方向:把不确定性降下来。

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

从写 UI,到定义状态

默认态最好写,难的是异常态。

02

从接接口,到理解业务语义

前端是用户看到业务的最后一层解释器。

03

从改 bug,到守边界

知道改了哪里,也知道没碰哪里。

30 天计划:每天练一个真实小问题。

第 1 周

让 AI 帮你读代码

先画入口、store、接口、组件、提交链路。

第 2 周

让 AI 做提交前 review

重点查状态残留、异步竞态、回显和权限。

第 3 周

让 AI 补用户状态

补 loading、空数据、错误恢复和重复提交。

第 4 周

让 AI 写 lesson

把一次问题沉淀成下次可复用的判断。

别急着和 AI 比手速。

人的价值,是把真实系统里的不确定性降下来。

焦虑不是敌人。它有时候是在提醒你:这里还有一块不确定性没有被处理。

Prompt 小抄:会后可带走。

不知道从哪里开始
先不要写代码。
请拆成:业务语义、页面状态、接口链路、验证清单。
最后指出最大的不确定性。
怕改炸共享组件
先分析影响范围。
按当前页面、同类组件、全局回归风险列出。
最后给最小改动建议。
不放心 AI 方案
反过来审查方案。
专门找它可能错的地方。
重点看上下文、业务语义、异步竞态、权限和回归。
沉淀经验
写成 lesson。
提炼成一句下次可复用的判断。
格式:问题、根因、方案、经验、文件。