-
可使用float属性实现HTML元素左右浮动布局，配合clear清除影响、伪元素解决父容器塌陷，或用flexbox、CSSGrid等现代方案替代。
-
应使用JavaScript动态获取fixed广告真实高度并实时同步至文章末尾容器的padding-bottom，同时用占位元素兜底，兼顾安全区适配与布局健壮性。
-
IE10需用-ms-flexbox整套旧语法：display:-ms-flexbox、-ms-flex-pack、-ms-flex-direction等，不支持flex-wrap和三值-ms-flex，且属性值严格限定。
-
justify-content:space-between未生效的常见原因包括父容器未设display:flex、子元素过少（需≥2个）、子元素被设为flex:00100%或margin:auto抢占控制权，以及column方向下父容器缺少明确高度；其与space-around、space-evenly的核心区别在于首尾子元素是否留白；IE11不支持space-evenly，且对flex:1和flex-wrap:wrap兼容性差。
-
WebSocket是JavaScript实现实时通信最常用方式，基于单TCP全双工协议，低延迟高效率；需监听open/error/close事件管理状态，用readyState判断连接阶段，send前确保状态为OPEN，支持文本/JSON/Blob收发，主动close防泄漏，并需服务端配套支持。
-
watchEffect是Vue3中自动追踪依赖并执行副作用的工具，支持返回清理函数以销毁旧实例、重建新实例，需配合onBeforeUnmount防止组件卸载时内存泄漏。
-
Terser是现代JavaScript压缩的默认选择，UglifyJS因不支持可选链、空值合并等新语法且压缩率低而被淘汰；Webpackv5+已内置Terser，无需安装uglifyjs-webpack-plugin，应通过terserOptions自定义配置。
-
现代DOM操作首选querySelector系列，支持CSS选择器语法，querySelector返回首个匹配元素，querySelectorAll返回静态NodeList；操作class用classListAPI更安全可靠；事件绑定用addEventListener并善用事件委托；修改内容优先用textContent防XSS，data属性用dataset访问。
-
Flexbox容器内文字不会自动随容器缩放，必须通过clamp()配合容器查询或ResizeObserver实现响应式字号。
-
分页加载的核心是按需获取、动态追加，需维护page、hasMore、loading状态，通过滚动监听触发fetch请求并拼接数据，注意防重复、防错乱、状态同步。
-
Vue3推荐使用模板而非Render函数，因其可被编译器静态分析并生成优化的BlockTree，实现细粒度更新；而Render函数为运行时JavaScript，无法参与Block构建，导致更新退化为传统vnodediff。
-
打字机效果需用@keyframes动画width至具体值（如12ch），禁用auto/fit-content；光标用border-right闪烁，避免::after；混排文本宜按字符数设时长或steps()；ch单位不兼容旧版Safari需@supports降级为em。
-
本文详解如何修复计算器上层输入表格在移动端水平溢出的问题，核心是为表单控件设置相对宽度（百分比）、结合媒体查询与语义化布局，确保所有输入字段自动适配小屏幕。
-
Lighthouse自定义指标是通过UserTimingAPI在页面中插入以user-开头的mark和measure，用于监控特定业务逻辑耗时。开发者可在性能报告中查看这些指标，结合CI/CD实现持续性能追踪，确保关键路径性能可控可优化。
-
JavaScript通过document.cookie读写Cookie，其本质是需手动解析拼接的字符串；读取需split分隔并解码value，设置需拼接key=value及expires/path/domain等选项，删除则覆盖过期时间。
