Now vibe coding, so learning hammer FE ?
《高级工程师死亡螺旋》

标签:
#职业发展 #工程师文化 #工作方法 #心理健康

总结:

文章要点:

1. "高级工程师死亡螺旋"是作者观察到的常见失败模式:工程师在新工作、晋升或大项目开始时,试图"扮演"比自己更资深的角色,设计过于雄心勃勃的方案。

2. 螺旋的典型表现是:工程师消失数周,在站会上给出"积极更新"但实际上没有产出,然后开始告诉自己"需要更努力工作来弥补",最终失眠、抑郁、人际关系受损,导致倦怠、被PIP、辞职等最坏结果。

3. 远程工作和AI编码工具的普及加剧了这一问题:工程师更加孤立,缺乏传统的工作结构和同事间的日常交流,使得"没人知道你在做什么"的情况更容易发生。

4. 破解螺旋的反直觉方法是"降低一级":不要试图表现得比实际级别更高,而是成为最好的队友——做bug修复、帮别人处理繁琐工作、做组织性事务,通过帮助他人来重建动力。

5. 关键 mindset 转变是从"结果导向"转向"动力导向":建立日常 routine,通过每天一点点的工作积累动力,修复与同事的关系,最终获得"耐力"。

6. 核心洞察是:大项目不是靠大努力完成的,而是靠缓慢、稳定、增量的工作——每天、每小时地做,直到成为肌肉记忆。

7. 最终目标是建立可靠性声誉:通过减轻队友和经理的负担来建立信任,然后自然会获得更大的工作机会——因为"你处在建立声誉的生意中,软件只是下游产品"。

8. 作者强调雇主雇佣的是"现在的你",而不是"六个月后你认为你会成为的那个人",因此不需要通过过度努力来证明自己。

URL:
https://sunilpai.dev/posts/the-senior-engineer-death-spiral/ the senior engineer death spiral
《十个防止 AI 代码泛滥的前端项目护栏》

标签:
#前端 #TypeScript #React #AI编程 #代码质量 #ESLint #测试策略 #CI_CD #代码审查 #工程实践

总结:

本文针对 AI 生成代码速度远超人类审查能力的前端项目,提供了一套实用的十项防护清单。核心思路是通过自动化工具链(类型系统、Linter、变异测试、CI 门禁)在代码合并前拦截机械性错误,而非依赖人工逐行审查。

文章要点:

1. 用 OpenAPI 契约替代手写类型:通过 Hey API 等工具从 OpenAPI 规范直接生成 TypeScript 类型、客户端和 Zod 校验,避免 AI 臆造不存在的 API 字段(如 user.fullName),让编译器在构建期就报错。

2. 开启严格 TypeScript 配置:启用 noUncheckedIndexedAccess 等严格标志,让数组索引访问返回 T | undefined,迫使代码显式处理边界情况,减少 AI 常见的"想当然"代码。

3. 把 Linter 当作行为过滤器:使用 SonarJS、react-you-might-not-need-an-effect、vitest/playwright 插件、jsx-a11y 等 ESLint 插件,自动拦截认知复杂度过高、不必要的 Effect、可访问性违规等问题。

4. 设定架构层边界:使用 eslint-plugin-boundaries 或 dependency-cruiser 强制实施分层架构(如 UI 层不得直接访问 API 层),防止 AI 生成的代码逐渐退化为"GitHub 平均水平"的混乱结构。

5. 将重复出现的错误转化为自定义 Linter 规则:当同一种 bug 第二次出现时,立即编写自定义 ESLint 规则禁止该模式。例如禁止在服务层函数中使用 Math.round 和 toFixed,避免双重取整导致的薪资计算错误。

6. 把规则直接喂给 AI 模型:通过项目规则文件(如 .cursor/rules、CLAUDE.md)或技能文件(如 react-doctor),将项目约定、架构决策和禁止模式直接提供给 AI,让模型在生成代码时就遵循规范。

7. 用变异测试验证测试有效性:使用 Stryker 故意破坏代码(翻转运算符、反转条件、交换返回值),检查现有测试是否能捕获这些变异。存活的变异体通常暴露"只测形状不测内容"的无效测试。一个项目约 4,700 个变异体在 6 分钟内完成扫描。

8. 用 Knip 清理死代码:Knip 可以检测未使用的文件、导出和依赖,配合自定义可达性脚本填补其盲区,防止 AI 生成大量"以防万一"却无人调用的冗余代码。

9. 用 jscpd 检测重复代码:AI 倾向于在不同地方生成几乎相同的逻辑,jscpd 能发现这些重复,提示抽象机会或错误的复制粘贴。

10. 将所有检查强制设为 CI 门禁:上述所有工具(类型检查、Lint、测试、变异测试、重复检测)必须作为 CI 的强制通过项,而非可选建议,确保 AI 生成的代码无法绕过质量关卡。

11. 成本与局限:这些护栏会产生噪音(误报)、规则过时和新人上手摩擦等成本,建议按"类型 → Lint → 测试 → CI"的顺序渐进式推行。同时需注意,这些检查只能捕获机械性错误,无法识别糟糕的品味或错误的抽象。

URL:
https://evilmartians.com/chronicles/ten-anti-ai-slop-moves-for-frontend-projects-going-faster-than-humans-can-review 10 anti-AI slop moves for frontend projects going faster than humans can review—Martian Chronicles, Evil Martians’ team blog
《现代工程价值观:AI 时代的效率与品味》

标签:#软件工程 #AI编程 #代码审查 #团队管理 #技术栈 #开发者体验 #工程管理

总结:
作者 Christoph Nakazawa(cpojer)分享了他近半年完全依赖 AI 编码代理完成多个项目的实战经验,指出编程已从"手写代码"转向"指挥系统生成代码"。文章提炼了 AI 时代仍至关重要的五大工程价值观:强所有权、品味至上、严格约束与快速反馈、代码库即上下文、掌控技术栈,并强调管理需更技术化。作者用数据证明效率提升 3 倍,认为未来瓶颈不再是写代码,而是判断力与品味。

文章要点:
1. **AI 编码已成常态**:作者过去数月多个项目(Vite+、fate、Codiff、Athena Crisis 等)90%-100% 由 AI 编写,代码质量甚至超越手写,且能在几分钟内完成过去数周的工作
2. **Codex CLI 是最佳搭档**:使用 GPT 5.5 high 配合 Codex CLI,配合"先写失败测试再修复"的策略,能极大提高一次性正确率;多项目并行时建议每个项目独立窗口,利用空间记忆提升效率
3. **强所有权比代码更重要**:AI 放大了"懂行"与"不懂行"的差距,小团队(2-3 人)+ 清晰边界 + 独立仓库比大团队协作更高效,审查应聚焦对齐而非代码细节争论
4. **品味是防"垃圾"泛滥的护城河**:AI 能全天候生成大量平庸代码,工程师的核心价值转向判断"什么值得做",团队应花更多时间思考方向而非盲目堆功能
5. **严格约束 = 速度**:把代码规范、自动化测试、快速验证等"护栏"做得越严,AI 迭代越快(1 分钟 vs 60 分钟的差距);工具必须支持增量检查,避免随代码量增长而变慢
6. **代码库即唯一上下文**:将设计文档、产品行为、决策记录全部沉淀在仓库内,让 AI 和人类都能快速理解;代码越简洁、越易读,AI 修复和迭代越高效
7. **自研技术栈重新划算**:过去依赖第三方库是因为手写代码慢,现在 AI 降低了自研成本,掌控核心依赖能避免被外部框架绑架,获得完全的产品体验控制权
8. **保留选择权(Option Value)**:任何架构改动都应保留未来大幅调整的可能性,AI 虽让重构变快,但把自己逼进死胡同依然难以脱身
9. **管理必须更技术化**:执行成本降低后,管理者不能只做方向把控,必须保持领域 expertise,能亲自改代码、做技术决策,"技术型管理"(Tech Lead Management)将成为主流
10. **效率数据惊人**:近 30 天日均提交 770 次、修改 15k 行代码,是两年前的 3 倍;过去手写巅峰一天 1200 行,现在 AI 辅助可达 10 倍且质量更高

URL:
https://cpojer.net/posts/modern-engineering-values Modern Engineering Values
《为特定场景"投影"React:从60KB到7KB的极致裁剪实验》

标签:#前端 #工程化 #React #TanStackStart #AICoding #PerformanceOptimization #Vite #RSC #BundleSize

总结:
TanStack作者Tanner Linsley发现React 19在Vite打包后仍占约60KB gzip,远大于TanStack全家桶总和。受"代码即物化视图"理念启发,他借助AI代理在一天内生成了一个针对TanStack Start需求定制的React"投影"——保留完整公共API,但移除并发调度、时间切片等不需要的功能,核心仅7.08KB gzip。该项目已在其个人博客和tanstack.com生产环境运行,JS体积减少33%至85%,渲染性能提升2到3倍,验证了当代码生成成本骤降时,为特定场景定制依赖库投影的可行性。

文章要点:
- 作者发现React打包后仍有约60KB,比TanStack全家桶加起来还"胖",成了整个技术栈里"最不能删却又最大块头"的存在
- 本想用Preact"瘦身",但它和React 19在use()、服务端动作、hydration等边缘地带已经"渐行渐远",补丁叠补丁让人望而却步
- 一个超酷的观点启发了他:如果写代码能像查数据库一样"按需生成",那代码本身只是"理念"的一种展示形式,我们完全可以为不同场景生成不同版本的React
- 借助AI代理,只用一天就"捏"出了一个迷你版React,保留了你熟悉的hooks、JSX、Suspense和SSR,但扔掉了并发调度、时间切片这些TanStack Start用不上的"重型装备"
- 设计得像乐高一样:7KB核心底座 + 8个可插拔功能(context、suspense、portal等),不需要的模块在构建时直接替换成空实现,不会混进最终包
- 真刀真枪上了生产环境:个人博客JS少了三分之一,首屏快了近两成;tanstack.com这种"重火力"站点也成功扛住,客户端JS砍掉近1MB
- 作者抛出思考题:当定制一个库的成本从几个月降到几天,继续默认 shipped 全套通用库,反而成了一种需要掂量的选择
- 他强调这不是要"取代React",更像是Linux发行版或歌曲混音——同一个内核,根据不同听众的口味调出不同版本

文章URL:https://tannerlinsley.com/posts/projecting-react Projecting React
《AI编码代理生产级工程技能集》

标签:#AI辅助编程 #开发工具 #AI_Agent #工程规范 #ClaudeCode #Cursor #代码审查 #测试驱动开发 #CI_CD

总结:
这是一个为AI编码代理(如Claude Code、Cursor、GitHub Copilot等)设计的生产级工程技能仓库,由Addy Osmani维护。它将资深工程师在真实项目中的工作流、质量门禁和最佳实践编码为20个结构化技能,覆盖从需求定义到上线发布的完整开发生命周期,让AI代理在每次编码时都能保持一致的专业水准,避免走"最短路径"而跳过测试、审查等关键环节。

文章要点:
- 六阶段开发流水线:从Define(定义需求)→ Plan(拆解任务)→ Build(增量编码)→ Verify(验证测试)→ Review(质量门禁)→ Ship(安全发布),像工厂流水线一样规范AI的每一步动作
- 7个斜杠命令即开即用:/spec写需求文档、/build增量开发、/test跑测试、/review代码审查……输入命令就能自动激活对应的技能组合,非常顺手
- 20个实战技能全覆盖:从API设计、前端工程、TDD测试驱动,到性能优化、安全加固、Git工作流、CI/CD自动化,每个技能都自带步骤清单、验证标准和"反找借口"表格(比如AI想跳过测试时,会被技能里的反驳论据怼回去😄)
- 多工具无缝兼容:Claude Code一键插件安装,Cursor复制到rules目录,Gemini CLI、Windsurf、GitHub Copilot、Kiro等主流AI编程工具都能直接用,技能就是纯Markdown,通吃所有支持系统提示词的代理
- Google工程文化落地:融入了Hyrum定律、Beyonce规则、测试金字塔、Chesterton围栏等Google实战智慧,不是泛泛而谈的理论,而是嵌入到每一步工作流中的可执行标准

文章URL:https://github.com/addyosmani/agent-skills GitHub - addyosmani/agent-skills: Production-grade engineering skills for AI coding agents.
 
 
Back to Top