-
页脚贴不住底部的最优解是用flex布局配合margin-top:auto。将html和body设为height:100%，body设为display:flex、flex-direction:column，main设flex:1，footer设margin-top:auto即可。
-
用双层Map实现命名空间隔离的EventBus，第一层以namespace为key，第二层以eventtype为key存储回调数组；addListener、emit、off均需传入namespace参数确保隔离性。
-
JavaScript动态改样式有三条路径：直接修改元素style对象适用于临时单次内联控制；切换className适合复用、可维护及响应式场景；操作CSSStyleSheet规则适合运行时生成主题或全局变量注入。
-
Next.js通过getServerSideProps在服务端动态获取数据并渲染HTML，实现SSR，提升首屏性能与SEO；它非React替代品，而是增强层，自动处理路由、数据获取等，区别于CSR的空HTML+JS渲染。
-
CLS是唯一官方布局稳定性指标，需用PerformanceObserver监听layout-shift并设buffered:true；通过entry.sources或affectedElements定位异常元素，聚合上报时过滤hadRecentInput为true的条目，累加value值判断是否超0.1阈值。
-
懒加载核心是按需触发资源加载，推荐用IntersectionObserver替代scroll监听，配合loading="lazy"实现渐进增强，组件懒加载需结合代码分割与视口观察，且必须处理失败fallback。
-
首先通过监听touchstart、touchmove、touchend事件实现手势识别，具体包括滑动、长按、双击和缩放等操作。记录触摸坐标并计算位移与时间差，结合阈值判断手势类型。例如滑动手势需比较起始与结束位置的偏移量，长按通过定时器检测持续触摸，双击判断两次点击间隔与距离，缩放则依据两指间距离变化。示例代码展示了左右滑动检测逻辑：在touchstart记录起点，touchend时计算水平位移，若水平差大于30且垂直差小于50，根据方向输出swipeleft或swiperight。注意事项包括设置pas
-
路由守卫不直接判断超时，需结合时间状态管理和守卫拦截：1.全局监听交互事件刷新localStorage中lastActive时间戳；2.checkSessionTimeout()函数计算并返回超时布尔值；3.router.beforeEach中调用该函数，超时则清token并跳转登录页；另配定时器每60秒兜底检测。
-
transition-delay不继承，必须逐级显式设置；需用后代选择器配合CSS变量统一管理，并结合opacity/visibility实现平滑过渡，避免display切换中断动画。
-
auto在grid中等价于min-content而非弹性值；实现自适应列宽应使用minmax(min-content,1fr)，而非minmax(auto,1fr)或单独auto。
-
闭包不能实现动态上下文自愈或跨环境执行，仅作为轻量封装工具参与；它可封装环境检测结果、绑定上下文快照、隔离校验逻辑，支撑可观测性驱动的决策层。
-
高性能栈应采用预分配数组+整型栈顶索引实现，push/pop均为O(1)原子操作，避免动态分配、装箱和分支预测失败，注重缓存友好与硬件对齐。
-
@layer能压制!important是因其引入了独立于选择器权重和!important的新层叠维度，浏览器按“层顺序→层内规则顺序→选择器权重”逐级计算，后声明的层内样式自然覆盖先声明层中的!important规则。
-
原生<inputtype="date">宽度无法直接用width:100%撑开，因浏览器为其设定了默认min-width（如Chrome约130px），需显式设置min-width:0和box-sizing:border-box才能生效；Flex布局中同样需min-width:0配合flex:1；Safari兼容性最差，建议优先考虑自定义方案。
-
仅写appearance:none无法清除iOS输入框内阴影，必须搭配-webkit-appearance:none和background-color:transparent、border:1pxsolidtransparent、outline:none、padding与line-height显式设置这4+关键项，否则阴影照旧。
