-
用newSet()替换权限数组可将权限判定从O(n)降为平均O(1)；支持原子增删、自动去重、批量同步及链式组合判断，提升性能与安全性。
-
HTML乱码根本原因是文件实际编码与<metacharset="UTF-8">声明不一致，必须同步修正二者；<meta>须置于<head>最前且无BOM/空格干扰，HTTP响应头charset优先级更高，外部资源也需统一UTF-8无BOM。
-
直接在@media中重写grid-template-columns即可响应式切换：小屏用1fr单列，中屏用repeat(2,minmax(300px,1fr))，大屏用repeat(auto-fit,minmax(350px,1fr))，优先以minmax()配合fr实现弹性列宽，避免固定像素导致溢出。
-
要消除动画首帧延迟，需用will-change精准预告即将变化的transform或opacity等可合成属性，并在交互时动态添加、动画结束立即移除，配合DevTools验证图层是否真正生成。
-
mix-blend-mode是元素内容与下方堆叠上下文（如父背景、兄弟元素、video等）的混合，生效关键在于结构：需同级定位+下方有可混合内容，且避免isolation、opacity、filter等隐式创建层叠上下文的属性。
-
ARIA属性必须在HTML原生语义无法表达组件行为或状态时精准补位；如自定义下拉需role="listbox"+aria-expanded+aria-activedescendant，模态框需role="dialog"+aria-modal="true"+aria-labelledby，动态内容区用aria-live="polite"，且须JS同步更新状态。
-
直接写input,select,textarea{...}会因浏览器默认样式差异大、伪元素遗漏、可访问性破坏及影响自定义组件而引发问题；应分类型重置、保留焦点样式、用带前缀的appearance:none并限定作用域。
-
::selection仅支持color、background-color、text-shadow等极少数属性；需注意user-select控制、选择器优先级、全局作用域、浏览器前缀及移动端兼容性问题。
-
JavaScript事件委托是将子元素事件绑定到父元素，利用事件冒泡和event.target识别目标，可减少监听器数量、节省内存、支持动态元素、降低DOM访问开销、简化逻辑维护。
-
最轻量图片对比滑块用HTML+CSS+JS实现：两张图绝对定位叠放，range控件实时绑定clip-pathinset裁切（推荐--p变量写法），监听input事件；需等图片onload后初始化，处理加载失败、宽高比不一致、移动端touch-action及Safari兼容性问题。
-
Canvas频繁绘制导致内存泄漏的典型表现是页面卡顿、FPS下降、JS堆持续增长且GC后不回落，主因是每帧新建Image/Canvas/路径对象未释放引用，或事件监听器未解绑；应复用离屏canvas、ImageBitmap缓存、对象池及前置样式设置，并避免getImageData、measureText等高频分配操作。
-
应使用addEventListener('dblclick')而非ondblclick属性，因后者存在this指向错误、无法传参、不可移除、框架不兼容及浏览器双击判定差异等问题；正确做法是绑定'dblclick'事件并配合节流处理单双击冲突，移动端需用pointerdown自行实现双击检测。
-
装饰性图片必须写空alt属性（alt=""），不可省略alt或使用无意义描述；其指纯视觉美化、不传递关键信息的图片，如分隔线、背景花纹等。
-
按需拷贝（LazyClone）是延迟深拷贝机制，仅在写操作触及具体区域时才复制对应数据，其余部分共享原始只读内存，实现写时复制语义。
-
纯HTML无法实现鼠标跟随，必须用JavaScript监听mousemove事件获取clientX/clientY坐标并动态更新元素transform或left/top样式，CSS仅能辅助过渡动画和视觉表现，无法读取鼠标实时位置。
为什么？符合 HTML 标准img 标签必须有 src 属性，否则是无效的 HTML。即使图片是装饰性的，也应保留 img 标签。无障碍访问（WCAG）
如果图片是装饰性的，不需描述内