倒计时必须实时计算差值而非累减，用date.now()与服务端时间戳相减；bootstrap栅格需用.col-auto+min-width防数字抖动；bootstrap-datetimepicker不适用于倒计时。
倒计时别用 setInterval 累减，必须实时算差值
浏览器切到后台标签页时，setInterval 会被节流甚至暂停，导致倒计时跳变、负数或直接卡住。真实场景下用户可能离开页面几分钟再回来，这时靠“每秒减1”完全不可靠。
正确做法是每次重绘都用 Date.now() 和服务端下发的截止时间戳（如 deadlineTimestamp）做减法：
-
deadlineTimestamp必须是毫秒级数字，不是字符串或Date对象——避免重复解析开销 - 每次调用都算
Math.max(0, deadlineTimestamp - Date.now())，再拆解为天/时/分/秒 - 首次渲染要立刻执行一次
updateCountdown()，否则首屏空白 - 定时器用
setInterval(updateCountdown, 1000)即可，不用更短间隔（精度无提升，徒增 CPU）
Bootstrap 栅格怎么防倒计时数字抖动
数字宽度随值变化（比如“9”比“10”窄），直接放 .col-2 或 .col-sm-1 会导致跳动，尤其在 iPhone SE 这类窄屏上还可能换行。
实操要点：
- 每个数字块外层用
.col-auto，内部加text-center+ 行内样式style="min-width: 56px;" - 字体大小用
font-size: clamp(1.25rem, 4vw, 2.5rem)，比单纯display-6更稳 - 单位文字（“天”“时”）用
<small class="text-muted"></small>，视觉权重不能压过数字 - 避免用
flex布局强行对齐——不同数字渲染宽度仍不一致，抖动照旧
bootstrap-datetimepicker 真的适合倒计时？
不适合。这个插件本质是「时间选择器」，不是倒计时工具。它依赖 jQuery 和 Bootstrap CSS，核心功能是让用户点选日期+时间，和倒计时逻辑无关。
常见误用场景：
- 想用它初始化一个倒计时目标时间 → 其实只需后端吐个时间戳，前端自己算
- 以为它内置倒计时 UI → 它连进度条都没有，更别说自动刷新
- 引入它只为获取
moment.js支持 → 现代项目应优先用原生Date.parse()或Intl.DateTimeFormat
它的优势在于轻量（Gzip 后
倒计时结束时三件事必须同步做
归零后只改 DOM 文字是典型错误。用户可能点着按钮才看到“00:00”，提交却失败，体验断裂。
必须原子化处理：
- 调用
clearInterval(timerId)—— 不清理会持续触发已销毁节点的更新，内存泄漏 -
buttonEl.disabled = true+class="opacity-50 cursor-not-allowed"—— 禁用状态要真禁用，不能只靠 CSS 隐藏 - 替换整个倒计时容器内容，比如把
<div class="countdown">...</div>替成<div class="text-success">活动已结束</div>，而不是只改里面数字
时间精度、DOM 稳定性、交互状态这三者只要漏掉一环，倒计时就从功能变成 bug 源头。
