弹性算力编排
按 CPU 利用率 65% 触发扩容、30% 触发缩容，冷却窗口 300 秒，避免抖动式反复伸缩。建议为无状态服务设最小 2 副本。
扩容 ≤ 90s缩容冷却 300s
核心能力：五件事把风暴驯成微风
每条能力都附带可核对的门槛值，方便你在评审会上直接对标，而不是凭感觉点头。
数据可视化叙事
一屏只回答一个问题：先看总览卡（可用性、错误率、成本），再下钻到链路追踪。折线图不超过 4 条线，超过就拆图。
首屏 ≤ 5 个指标下钻 ≤ 2 次点击
响应式布局与断点
以 640 / 1024 / 1600 三档断点为主轴，卡片在超大屏升到 3–4 列，窄屏收成单列；容器宽度逐级放宽到 1400–1680px。
断点 3 档点按区 ≥ 44px
动态交互的克制感
hover 抬升 3–4px、过渡 250ms ease-out 即可；渐变文字只用在 H1 与关键数字上，保证正文对比度不低于 4.5:1。
动效 ≤ 450ms对比度 ≥ 4.5:1
成本与安全护栏
按标签（项目/环境/负责人）归集成本，预算告警设在月度额度的 80%；密钥统一进托管，禁止写进镜像与环境变量明文。
预算告警 80%密钥零明文
常见问题：把犹豫说清楚
这些都是团队在迁移与改版时最常问到的，我们按真实经验给出可执行的答复。
渐变风格会不会拖慢首屏？
不会，前提是渐变用 CSS 实现而不是大图。建议：mesh 渐变交给多层 radial-gradient，导出为纯 CSS 约 1–2KB；仅 Hero 保留一张压缩到 200KB 以内的主视觉，其余图片加 loading="lazy"。首屏 LCP 控制在 2.5s 以内。
先从哪条业务链路上云最稳妥？
优先选「读多写少、可回滚」的链路，例如内部报表或图片处理。先在预发跑 2 周，观察错误率与 P95 时延，再灰度 10% → 50% → 100%，每档至少稳定 24 小时。
数据可视化要做到什么程度才够用？
够用的标准是：值班同学能在 30 秒内判断「是不是故障、影响谁、下一步点哪里」。达不到就继续删指标，而不是加图表。建议保留 4 个黄金信号：时延、流量、错误、饱和。
响应式改造要重写全部页面吗？
不必。先把设计令牌（间距、圆角、字号、阴影）抽成 CSS 变量，再改容器与网格，通常能覆盖 70% 以上的页面；剩余长表格页优先做横向滚动或转卡片，别硬压成两列。
团队小、人手少，怎么避免运维失控？
把「能自动的别手动」当铁律：自动扩缩容、自动备份（每日全量 + 小时级增量，保留 14 天）、自动告警收敛（同类告警 5 分钟内合并为一条）。每周花 30 分钟复盘告警，删掉长期不触发的规则。
应用场景：三种真实的云上日常
同样的渐变语言与科技风暴气质，在不同业务里落成不同的密度与节奏。
大促弹性扩容
活动前 2 小时预扩容到日常的 3 倍，压测目标 QPS 为预估峰值的 1.5 倍；结束后按 15 分钟粒度逐步回收，避免成本空转。
预扩容 3×压测 1.5× 峰值
多团队共享成本视图
按项目与环境双层标签归集，月度账单下钻到服务级；设 80% 预算告警，超支前一周自动推送给负责人，减少月底惊喜。
标签 2 层告警 80% 阈值
混合云平滑过渡
保留本地核心库，先把无状态服务搬上云；专线时延控制在 5ms 内，数据同步用增量日志，回滚方案演练每季度至少一次。
专线 ≤ 5ms回滚演练 1 次/季度
实用指导清单：六步把设计稿落成上线页
顺序别跳，每一步都有可验收的量化门槛；卡住时先回到上一步确认，而不是加更多装饰。
先定令牌，再画界面
把间距、圆角、阴影、字号全部写成 CSS 变量并挂在根类上，例如 --sp-4:16px、--r-lg:16px。组件只引用令牌，禁止写死像素值；这样一次改色能全局生效，也避免「同页三种间距」。
渐变控制在 60-30-10
约 60% 用暖中性底色铺底，30% 交给主色，只有 10% 留给强调色。高饱和色只出现在按钮、激活态、关键数字与小图标上，绝不做整屏或整条横幅填充。
图片统一裁切与懒加载
用固定宽高比容器 + object-fit:cover 防布局跳动，Hero 图压缩到 200KB 以内，其余加 loading="lazy"，并写清描述性 alt 方便无障碍读屏。
断点跑满四档再交付
依次验证 1600px、1024px、640px、380px：超大屏容器放宽到 1400–1680px 且卡片升到 3–4 列，窄屏单列堆叠、内边距收到 8–12px，全程不允许出现横向滚动条。
动效与降级一起写
hover 抬升 3–4px、过渡 250ms ease-out 足够；同时写 @media (prefers-reduced-motion:reduce) 把动效压到 0.001ms，照顾对动效敏感的同事。
上线前做一次真实巡检
检查清单：Lighthouse 性能 ≥ 90、正文对比度 ≥ 4.5:1、所有点按区 ≥ 44px、长英文与 URL 不撑破列宽、焦点态可见。任何一项不达标就先修，别急着加新模块。