canva

Canvas 是 HTML5 的绘图区域，需用 JavaScript 获取 2D 上下文（ctx）后绘图；核心步骤是获取 canvas 元素并调用 getContext(‘2d’)；支持矩形、路径、文字等绘制及 requestAnimationFrame 动画。 Canvas…

JavaScript操作Canvas需先获取元素及2D上下文，再设样式、绘图（分路径定义与填充/描边）、清空重绘；须注意beginPath()、width/height设置及requestAnimationFrame动画。 要用 JavaScript 操作画布（），核心是获取 Canvas 元素的 …

JavaScript操作音视频主要通过HTMLMediaElement（audio/video标签）实现基础控制，配合Web Audio API进行精细音频处理，以及MediaDevices与MediaRecorder实现媒体捕获录制，还需注意浏览器自动播放策略限制。 JavaScript 操作音视…

节流和防抖是控制函数执行频率的技术：防抖在事件停止后执行一次，适用于搜索联想、防重复提交；节流按固定间隔执行，适用于滚动监听、拖拽更新。 节流（Throttle）和防抖（Debounce）都是用来控制函数执行频率的技术，核心目标是减少高频触发带来的性能压力，比如滚动、输入、窗口缩放等场景。它们不是互…

防抖只执行最后一次操作，节流按固定频率执行；防抖适用于搜索输入、表单校验等需等待用户完成的场景，节流适用于滚动加载、拖拽响应等需持续但限频的场景。 防抖（Debounce）和节流（Throttle）是 JavaScript 中用来控制高频事件（比如 resize、scroll、input、mouse…

Web Workers 是 JavaScript 在后台线程运行脚本的机制，通过独立隔离的执行环境实现并发，避免阻塞主线程；每个 Worker 有独立上下文、无 DOM 访问权，通信靠 postMessage 和 message 事件，支持结构化克隆与 transferable objects 零拷…

requestAnimationFrame（rAF）不是必须，而是为匹配屏幕刷新节奏、避免丢帧、节省资源；它自动对齐刷新率、页面不可见时暂停、比定时器更精准节能，并保证回调在渲染前执行。 JavaScript动画用 requestAnimationFrame（简称 rAF）不是“必须”，而是为了**…

JavaScript通过canvas和ImageData可实现图像处理，需先加载图片、绘制到canvas、用getImageData获取像素数据，遍历修改后putImageData写回；注意跨域、性能及抗锯齿问题。 JavaScript 本身不直接提供图像处理的高级 API，但通过 元素配合 Can…

虚拟 DOM 是用普通 JavaScript 对象描述真实 DOM 的树形结构，通过 createElement 创建节点、render 渲染、diff+patch 更新；其核心价值在于提升开发体验、跨平台能力与可控性能优化，而非绝对高性能。 JavaScript 实现虚拟 DOM 的核心，是用普通…

基础画图应用核心是通过mousedown、mousemove、mouseup事件配合Canvas 2D上下文实现路径绘制：按下设isDrawing为true并记录起点，移动时转换坐标并连线，抬起时停止；支持笔、线、矩形、圆等工具切换，并可扩展颜色、粗细、撤销等功能。 用 JavaScript 实现一…