-
用响应式断点控制列数时，需确保断点与设备视口精确匹配，如md起始于768px，避免卡在临界值；卡片高度不一致应设min-h或grid-auto-rows-min；间距优先用gap而非padding；SSR中须保证Grid子元素结构一致。
-
$patch是Pinia推荐的批量更新store状态方式，支持对象式和函数式两种用法：对象式用于同层级字段的精准合并更新，函数式适用于基于当前state计算新值的场景，兼具性能、安全与类型友好性。
-
浏览器通过name和autocomplete属性协同识别用户名输入框，其中autocomplete="username"是关键信号，且用户名框必须位于密码框之前。
-
按钮状态切换不自然的主因是未在默认状态中定义transition，导致进出动画不一致；应显式声明需过渡的属性、统一各交互态的过渡参数，并排查样式覆盖与属性兼容性问题。
-
ReactHooks与ContextAPI进阶用法包括：1.useState处理复杂数据时保持不可变性，useEffect精准管理依赖和清理副作用；2.自定义Hook如useLocalStorage提升逻辑复用；3.ContextAPI结合useMemo优化深层传参性能；4.useReducer管理复杂状态流，配合Context实现轻量全局状态。合理组合可构建健壮易维护的中小型应用架构。
-
响应式颜色设计需结合设备特性、用户偏好与可访问性，通过CSS相对颜色函数、系统色值、媒体查询及自定义属性，实现跨屏幕的智能适配，提升可读性与视觉一致性。
-
块级元素默认独占一行且可设宽高和四向边距，行内元素默认水平排列、宽高无效、仅左右边距生效；嵌套时行内元素不能直接包含块级元素，修改display值会改变其布局行为与限制。
-
CSSanimation不支持自动串联关键帧，多段动画需通过多个独立animation声明配合animation-delay错峰触发，并设fill-mode为forwards以保持状态。
-
闭包是函数作用域链自然保留的结果：外层函数返回内层函数，内层函数引用外层变量，且外层执行完后内层仍可调用；如createCounter中count被持续持有，而foo中bar立即调用则不构成闭包。
-
Map适合键类型不固定的场景，支持任意类型键；Set用于去重和存在性判断，性能优于数组includes；二者不可直接JSON序列化，且需注意旧环境兼容性。
-
小程序无法直接运行HTML5的<script>标签，因不支持原生DOM渲染；JS插件需兼容小程序运行时，避免依赖WebAPI，应通过npm引入并适配网络、存储等API。
-
Grid项z-index生效需先创建层叠上下文：必须设置position（如relative）且z-index不为auto，或用will-change/opacity/transform等触发；单纯改grid-column等布局属性时will-change无效；优先用DOM顺序、轨道错位或伪元素控制层级。
-
正确处理Flexbox溢出需结合overflow:hidden与flex属性，关键在于设置子元素min-width:0、flex:1及text-overflow:ellipsis，确保内容可收缩且文本溢出时截断，尤其在嵌套布局中更应规范使用以避免撑开容器。
-
用background-image替代list-style实现跨浏览器一致的列表符号：SVG背景图+background-position:left0.35emcenter+padding-left:1.5em，IE11需双重URL编码。
-
JavaScript迭代器无内置关闭机制，需开发者通过return()方法或手动.close()释放资源；生成器自动触发finally，异步迭代器return()应返回Promise，关键资源须提供显式清理接口。
