安全清理HTML5旧代码需先识别验证再替换，不可直接删除注释脚本；须检查实际使用的HTML5元素及属性、polyfill依赖、内联脚本中的Web API调用，并通过多浏览器回归测试确保功能完整。
HTML5 项目中如何安全清理旧代码和冗余资源
直接删 index.html 里注释掉的 IE6 兼容脚本？不行。旧 HTML5 项目往往混着条件注释、废弃的 document.write、过时的 polyfill（比如 html5shiv）、已下线的 CDN 链接，还有被遗忘的 data-* 属性或自定义事件监听器。清理不是删除，是识别 + 验证 + 替换。
先查清哪些 HTML5 特性实际被用到了
盲目移除 <video> 或 <canvas> 相关逻辑，可能让某个报表页白屏。必须确认当前 DOM 中真实存在的 HTML5 元素及其依赖：
- 打开浏览器 DevTools → Elements 面板，搜索
<section>、<article>、<time>等语义化标签，看是否仅作结构装饰，还是被 JS 选中（如document.querySelector('time[data-updated]')） - 全局搜索项目源码中的
querySelector、getElementById，检查是否引用了 HTML5 新增属性（如dataset、contentEditable） - 运行
console.log([...document.querySelectorAll('[data-],[contenteditable],[draggable]')])，快速定位仍在起作用的 HTML5 属性节点
polyfill 和兼容层怎么判断还能不能删
很多旧项目在 <head> 里硬塞了 html5shiv.js、respond.js、甚至整段 if (!window.addEventListener) 判断。是否可删，取决于你的真实支持范围：
- 如果项目已明确放弃 IE9 及以下（查看
browserlist或统计后台 UA），html5shiv和respond.js可全量移除 - 检查
package.json中browserslist字段，若含ie 11，则需保留core-js/stable中针对Promise、Array.from的垫片，但可删掉fetch的 polyfill（IE11 原生不支持，但若项目没用fetch就别留） - 搜索
require('es6-promise')或import 'whatwg-fetch'，只删那些对应功能从未被调用的引入
script 标签里的内联逻辑最容易漏掉
旧项目常把初始化逻辑写在 HTML 底部 <script> 块里，没有模块封装，也没 source map。这类代码最危险，删错一行就导致整个页面交互失效：
立即学习“前端免费学习笔记（深入）”；
- 逐个检查
<script>标签内容，特别关注是否操作了localStorage、sessionStorage、history.pushState—— 这些是 HTML5 Web Storage / History API 的典型使用痕迹 - 查找
addEventListener('pageshow')、addEventListener('beforeunload')，它们依赖 HTML5 页面生命周期事件，删前要确认无缓存/退出确认逻辑 - 用
performance.getEntriesByType('navigation')在控制台验证当前页面是否启用了performance.navigation（已废弃），若返回空数组且无相关判断逻辑，可安全删掉所有performance.navigation.type === 1类判断
真正难的不是找到该删什么，而是确认“它没在某个隐藏分支流程里被间接触发”。上线前务必在低版本 Chrome/Firefox 和最新 Safari 上做回归，重点测表单提交、视频播放、离线缓存开关这几类 HTML5 强相关路径。
