-
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等选项，删除则覆盖过期时间。
-
order属性仅对Grid或Flex容器的直接子项生效，父容器必须设置display:grid（或inline-grid），否则无效；其值默认为0，数值越小越靠前，负数合法；order相同时按HTML源顺序排列；它改变视觉及可访问性顺序，影响tab键焦点和屏幕阅读器朗读；不支持CSS过渡，动画需用transform模拟。
-
CSS径向渐变用radial-gradient()实现，至少需两个颜色，可指定形状（circle/ellipse）、尺寸（如farthest-corner）和位置（atxy），支持多色与色标控制，现代浏览器均兼容。
-
可用记事本、TextEdit（设为纯文本）、VSCode等编辑HTML，保存为UTF-8无BOM；双击打开可预览，但开发推荐LiveServer或python3-mhttp.server；路径须相对于HTML文件，注意大小写和404错误。
-
JavaScript创建自定义事件需用CustomEvent构造函数（可带detail数据）、dispatchEvent触发（支持元素或document广播）、addEventListener监听（通过e.detail获取数据），注意冒泡、取消及内存泄漏。
-
侧滑删除菜单用transform而不用left或margin，因其触发硬件加速、避免重排卡顿；需配合will-change、overflow:hidden、精准贝塞尔过渡及touchmove实时计算位移，并处理框架响应式冲突与iOS/安卓兼容性问题。
-
用dataset存状态比class更可靠，IntersectionObserver替代scroll监听，getBoundingClientRect需校正缩放与iframe偏移，React/Vue中key要稳定、ref要延迟读取，状态更新需分数据层、视图层、时机钩子三层协同。
