全屏切换事件需防抖的是后续副作用函数而非事件本身，如 resizeCanvas、renderChart 或高清资源加载；应将防抖应用于具体函数，配合 overflow: hidden 等 CSS 避免布局抖动，并注意定时器清理与上下文绑定。

网页全屏切换（如 `document.fullscreenchange` 或 `fullscreenerror`）本身不高频，但常被误用于触发重绘、尺寸重算或图表渲染等耗时操作，导致视觉抖动或重复执行。防抖不是用来“阻止切换”，而是让后续副作用函数只响应最终稳定状态。

哪些全屏切换场景需要防抖

真正要防抖的，是切换后立刻执行的逻辑，而不是切换事件本身：

• 监听 fullscreenchange 后立即调用 resizeCanvas() 或 renderChart()，而用户反复进入/退出全屏
• 在全屏激活后自动拉取高清资源或重载数据，但未等待状态稳定就发起请求
• 结合 ResizeObserver 响应全屏尺寸变化时，因连续回调造成 canvas 宽高反复设置，引发滚动条闪烁

防抖的核心做法：包装副作用函数

不要把防抖加在事件监听器上，而是加在它要调用的具体函数里。例如：

function updateLayout() {
  canvas.width = window.innerWidth;
  canvas.height = window.innerHeight;
  redraw();
}

const debouncedUpdate = debounce(updateLayout, 250);

document.addEventListener('fullscreenchange', () => {
  if (document.fullscreenElement) {
    debouncedUpdate(); // ✅ 只在稳定后执行一次
  }
});

配合 CSS 避免布局抖动

仅靠防抖还不够。全屏切换可能短暂改变 body 尺寸，触发浏览器滚动机制。建议同步加一条样式规则：

Java调试

通过 JDWP 实现 Java 远程调试：连接远程 JVM、设置断点、单步执行代码、查看变量值、获取调用栈。适用于需要调试远程 Java 应用、排查运行时状态、追踪代码执行流程的场景。 术语注解 JDWP：Java Debug Wire Protocol，Java 调试有线协议（Java 远程调试底层通信协议） remote JVM：远程 Java 虚拟机 step through code：代码单步调试（步入 / 步过 / 步出调试） inspect variables：变量查看 / 变量检视 stac

下载

body {
  overflow: hidden;
  margin: 0;
}

这样可防止因 canvas 尺寸微小变化导致的滚动条闪现，和防抖形成双重保障。

注意定时器清理与上下文绑定

如果页面卸载或组件销毁，记得清除残留定时器，避免内存泄漏：

• 使用带 cancel 方法的防抖实现（如 Lodash 的 debounce(fn, ms) 返回对象含 cancel()）
• 在组件 beforeUnmount（Vue）或 useEffect cleanup（React）中调用 debouncedFn.cancel()
• 确保 this 和参数正确传递——推荐用箭头函数或显式 .bind()，或改用现代写法：debounce((...args) => fn(...args), delay)

Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南