最直接方案是轮询index.html并比对script标签src路径：用fetch加时间戳防缓存，DOMParser解析HTML后提取script[src]转Set做差集比较，间隔设5–10分钟，监听页面可见性暂停轮询，检测到变化后提示用户刷新而非自动重载。
浏览器不会自动告诉你页面更新了，必须自己加逻辑检测 HTML 内容变化，否则用户可能一直卡在旧版本里，直到手动强刷或清缓存。
fetch('/?t=xxx') 轮询 index.html 是最直接的方案
核心是比对当前页面的 <script> 标签 src 是否和服务器最新 HTML 里的不一致。Webpack/Vite 打包后 JS 文件名带 hash，只要脚本路径变了，基本就代表有新版本。
- 每次请求加时间戳（如
/?timestamp=1744574220345）防止被浏览器或 CDN 缓存住 - 用
DOMParser解析返回的 HTML 字符串，再用querySelectorAll('script[src]')提取所有带src的脚本路径 - 把路径转成
Set后做差集比较，比字符串全文比对更稳定（避免注释、空格、换行等干扰） - 轮询间隔建议设为 5–10 分钟；太短（如 2 秒）会浪费请求，太长（如 1 小时）可能错过关键更新
别信 ETag / Last-Modified，它们常被服务端逻辑拦住
很多 Nginx 或 Node.js 中间层默认开启协商缓存，但返回 304 Not Modified 时，前端根本收不到新内容，自然无法触发更新判断。
- 检查 Network 面板中 HTML 请求是否真返回了
200和新响应体；如果看到304，说明服务端没放行 - 强制禁用协商缓存：fetch 时加
cache: 'no-cache'，并手动加请求头Cache-Control: no-cache - 某些 CDN（如 Cloudflare）会忽略客户端 Cache-Control，得在后台关掉“智能缓存”或给
/index.html单独配缓存策略为no-store
页面不可见时要暂停轮询，否则白跑还耗电
用户切走标签页、最小化窗口、锁屏时继续发请求，既无意义又影响性能，尤其在移动端会明显增加耗电。
anything-to-html
下载
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
立即学习“前端免费学习笔记（深入）”；
- 监听
document.hidden变化，配合visibilitychange事件控制定时器启停 - 恢复可见时，别立刻重试，先延后 1–2 秒再 fetch，避免和页面初始化抢资源
- 不要依赖
setInterval硬轮询；改用setTimeout链式调用，方便随时中断和重置
swapCache() + reload(true) 是过时写法，别再用了
window.applicationCache 在 Chrome 95+、Firefox 92+ 已彻底移除，且它只适用于老旧的 manifest 方案，和现代打包部署完全不兼容。
- 现在所谓“更新”，本质是 HTML 文件内容变了，不是缓存清单变了
- 检测到差异后，弹窗提示比自动刷新更稳妥；
window.location.reload(true)会丢掉表单输入、滚动位置、WebSocket 连接等上下文 - 如果非要自动刷新，至少加个延迟（如 30 秒倒计时），并允许用户点击按钮提前触发
真正难的不是写几行 fetch，而是让检测逻辑在各种网络环境、CDN 配置、浏览器休眠策略下都可靠运行——尤其是那个看似无害的 304 响应，最容易被忽略，也最常导致“明明发版了，用户就是不更新”。
