VS Code中引入.js文件后Chrome页面无响应，Live Server故障求助

• 检查JS文件中的死循环/无限递归：这是页面无响应最常见的原因。仔细排查代码里的while/for循环，确认是否有明确的终止条件；检查递归函数是否设置了正确的退出逻辑。可以在循环/递归内部添加console.log()，打开Chrome控制台观察是否一直在输出重复内容。

• 排查同步阻塞操作：如果JS里有长时间运行的同步计算（比如超大数组遍历、复杂数学运算），或者未关闭的alert()/prompt()弹窗，会直接阻塞浏览器主线程。把这类操作拆分成异步任务（用setTimeout或requestIdleCallback），或者关闭遗留的弹窗。

• 清理Live Server缓存：有时候Live Server会缓存旧的JS文件，导致修改后的代码未生效。按Ctrl+Shift+R强制刷新Chrome页面，或者在VS Code设置中搜索「Live Server: Disable Cache」并勾选，禁用缓存。

• 调整script标签加载方式：默认的同步加载会让JS执行阻塞HTML渲染，导致页面假死。给script标签添加defer或async属性：

  <script src="your-script.js" defer></script>
  

  defer会在HTML解析完成后再执行JS，不会阻塞渲染。

• 利用Chrome开发者工具定位问题：

  • 打开F12控制台，查看是否有未捕获的报错；
  • 切换到Performance面板，点击录制按钮后刷新页面，停止录制后查看哪个任务占用了大量主线程时间，定位到具体的JS代码段。

• 检查内存泄漏问题：如果JS里存在全局变量滥用、重复绑定事件监听等情况，会导致内存占用持续升高最终卡死页面。打开Chrome的Memory面板，录制内存快照，排查异常增长的内存对象。

• 构建最小复现案例：新建一个空白HTML文件，只引入一个空的JS文件，确认页面正常；然后逐步将原JS代码片段复制进去，每添加一段就测试一次，直到出现无响应，快速定位问题代码。

内容的提问来源于stack exchange，提问作者Deepak Singh