PC调试
Chrome控制台调试界面
console.time() 方法是JavaScript中的一个计时器功能，用于测量代码执行的时间。当你开始一个计时器时，你可以给它一个名字，并且在代码执行完毕后，使用相同的名字来停止计时器。这样，浏览器会在控制台输出这段代码执行所花费的时间。
console.time("计时器1");
for (var i = 0; i < 100000; i++) {
// 执行一些操作
}
console.timeEnd("计时器1");
//控制台上显示：计时器1: 0.625 ms
Source Tab
break point 和watch
scope和callback
sourceMap
代码压缩后的调试
通常上线未来安全和 减少体积是不带sourceMap的，那么没有sourceMap怎么映射源码呢？
项目打包时会带上sourceMap(源码地图)，这样产物里是有sourceMap的。上线的时候先把sourceMap上传到另一个平台（比如说监控平台）上传完后删除掉sourceMap，之后再把不带源码地图的产物部署上线即可。这样用户直接是看不到源码的，但收集到的错误就能对应到源码位置了。
Application
performance
performance运用示例
performance->三点->Frame Rendering Stats选中
lighthouse
LargestContentfulPaint(LCP):最大内容绘制,测量加载性能。为了提供良好的用户体验,LCP应在页面首次开始加载后的2.5 秒内发生。 First Input Delay(FID):首次输入延迟, 测量交互性。为了提供良好的用户体验,页面的FID应为100毫秒或更短。 Cumulative Layout Shift(CLS):累积布局偏移,测量视觉稳定性。为了提供良好的用户体验,页面的CLS应保持在0.1.或更少。
移动端调试
真机调试
ios
1.使用Lightning数据线将iPhone与Mac相连
- iPhone开启Web检査器(设置->Safari-> 高級>开启Web检査器) 3.iPhone使用Safari浏览器打开要调试的页面 4.Mac打开Safari浏览器调试(菜单栏一>开发 >iPhone设备名>选择调试页面) 5.在弹出的Safari Developer Tools中调试 注：没有iPhone设备可以在Mac App Store安装Xcode使用其内置的iOS 模似器
Android 1.使用USB数据将手机与电脑相连 2.手机进入开发者模式,勾选USB调试,并允许调试 3.电脑打开Chrome浏览器,在地址栏输入: chrome://inspect/#devices 并勾选 Discover USB devices选项 4.手机允许远程调试,并访问调试页面 5.电脑点击inspect按钮 6.进入调试界面 注：直接使用手机査看,体验更佳
VConsole
代理工具调试
NodeJS调试
Inspector Protocol + Chrome Devtool
第三步如图：
VSCode调试
来的index.js代码->运行 里的 启动调试 ->可以添加断点 再访问服务
常用调试工具
线上即时修改Overrides
保存线上修改的东西，会显示出来修改前后的东西
