-
vh和vw是视口单位，1vh等于视口高度的1%，1vw等于宽度的1%。常用于全屏布局（如height:100vh）、响应式字体（font-size:5vw）和弹性容器（width:90vw;max-width:1200px）。适配移动端时需注意iOSSafari工具栏导致的100vh异常，建议用100dvh替代；避免在多行文本等场景过度使用，应结合max/min属性控制极端情况，确保布局稳定。
-
Tailwind不支持empty:变体，因其未内置结构伪类解析；需用@layercomponents自定义或兄弟元素+:emptyCSS实现，注意DOM空白节点和框架渲染导致的失灵问题。
-
Less无法响应DPR变化，因其为编译时预处理器；image-set()不支持Less变量插值；响应式背景图可用混合器按视口宽度切换；兼顾DPR与宽度需JS动态加class；background-image无懒加载能力，应结合picture/srcset或IntersectionObserver。
-
用let/const替换var不是语法糖而是刚需，因其消除var的函数作用域、变量提升、全局污染及TDZ模糊等问题，避免意外泄露、覆盖、undefined读取等bug，并通过块级作用域和声明即意图提升代码健壮性与可维护性。
-
箭头函数与传统函数最核心区别是this绑定方式不同：箭头函数this词法绑定、不可变，无arguments、不能new调用、无prototype；传统函数this动态绑定，支持arguments、new及call/apply/bind。
-
Provide适合局部树内隔离状态，Pinia适合跨组件需调试持久化的全局状态；二者互补协同，按状态生命周期归属选择：长期有意义归Pinia，仅模块内有效归Provide。
-
Lighthouse评分卡在80分上不去主因是HTML性能瓶颈：DOM节点过多、内联脚本阻塞渲染、document.write残留、服务端模板冗余空格/注释；需控制DOM节点<1500、优化内联资源位置与体积、正确使用preload及响应头配置。
-
结论：HTML规范必须通过自动化工具落地执行。Prettier统一格式、Stylelint约束类名、模板预置注释、空行划分逻辑、注释标准化并强制英文，配合husky预提交校验，才能真正提升协作效率。
-
::marker仅在原生列表项（ul/ol未设list-style:none）上生效，可改color、content等有限属性，不可改margin/padding/display；content支持字符串和counter(list-item)，不支持url()或自定义计数器。
-
倒计时必须用JavaScript实现，HTML无法动态更新；应使用setInterval每秒计算目标时间戳与Date.now()的差值并格式化输出，避免递减变量、整页刷新或innerHTML重写，确保跨浏览器兼容与可访问性。
-
WebRTC本质是逻辑点对点通信，依赖STUN/TURN穿透NAT，但不绕过服务器；受安全上下文、主线程、自动播放策略及WebView兼容性限制；连不上主因ICE候选失败，需配STUN/TURN并确保信令可靠。
-
箭头函数是ES6引入的简洁函数语法，使用=>定义，支持隐式返回且不绑定独立this，而是继承外层作用域的this值。它不能作为构造函数，无prototype属性和arguments对象，需用剩余参数替代。适用于数组方法回调、避免this指向错误的场景，但不可用于需要动态this的对象方法或构造函数中。正确理解其特性可提升代码安全性和可读性。
-
JavaScript递归深度由引擎调用栈容量决定，Chrome约13500层、Firefox约4000–7000层、Safari约20000–25000层；受参数大小、严格模式、嵌套调用及开发者工具影响；推荐改用迭代、微任务或运行时降级保障安全。
-
box-shadow叠太多会卡顿甚至白屏，因每条阴影都需独立模糊、合成与重绘，易致GPU内存溢出或主线程阻塞；单元素建议不超过20条，爆炸效果宜用5–8层+scale动画实现。
-
tbodytr:hover有效需满足：HTML中显式存在tbody标签，且结构符合标准表格（thead/tbody/tfoot）；触屏设备默认不支持hover，需用@media(hover:hover)或touchstart/touchend模拟；避免pointer-events:none、优先级冲突及transition:all引发的布局抖动。
