-
纯CSSGrid无法实现真正瀑布流,因grid-auto-rows+span依赖预知高度、不自动避让空白、列间不联动,仅适用于内容高度稳定且无动态变化的SSR场景。
-
粘性定位卡顿主因是放大页面既有性能问题:父容器设overflow:hidden/flex/grid、sticky元素内含动态高度或width:100vw等,导致滚动时频繁回流;应避免这些属性,用contain:layout隔离,并精简样式与DOM结构。
-
JavaScript通过canvas和ImageData可实现图像处理,需先加载图片、绘制到canvas、用getImageData获取像素数据,遍历修改后putImageData写回;注意跨域、性能及抗锯齿问题。
-
vertical-align能解决图片下方空白,但仅在img为inline或inline-block且父容器非flex/grid时生效;它对齐行框底边而非父容器,bottom值最稳定可靠,失效常因父级margin、HTML空白符或图片自身留白所致。
-
通过调整position和z-index控制层叠顺序,确保目标元素位于顶层可点击;利用pointer-events:none实现点击穿透,auto恢复交互,从而精确管理重叠元素的响应行为。
-
必须用MiniCssExtractPlugin替换style-loader才能提取独立CSS文件,生产环境启用splitChunks配置cacheGroups实现公共样式合并,Vite默认支持自动CSS分割无需手动配置。
-
Reflect.get用于运行时取值(支持receiver),Object.getOwnPropertyDescriptor用于查询属性元信息;Proxy中应优先使用Reflect方法以确保语义正确和行为可组合。
-
requestAnimationFrame能匹配60FPS,因其在每帧重绘前执行回调,且浏览器以约16.67ms间隔刷新;正确用法包括节流调用、读写分离、移出耗时操作、结合观察者API,并避免与setTimeout混用或用setInterval替代。
-
系统外观颜色不可靠,因其由操作系统和浏览器联合解释,导致跨平台表现差异大、不支持CSS变量管理、高对比度模式下易失效,且构建工具可能静默丢弃;应改用语义化自定义属性(如--text-ui)配合媒体查询实现可控配色。
-
结论:别碰body的margin,用容器元素包裹内容并设margin或padding更可控;因浏览器对body默认外边距不一致,重置会引发外边距合并等不可预期问题。
-
“查看网页源代码”只显示服务器返回的原始HTML,而JS动态修改的DOM需用“检查”查看Elements面板;curl默认无Cookie/User-Agent且不执行JS,故与浏览器源码不同;移动端需借助桌面DevTools调试。
-
let和const从根源上解决var的三大问题:作用域混乱、变量覆盖、声明前误用;它们具块级作用域、不提升、禁止重复声明、支持TDZ,并确保for循环中每次迭代绑定独立变量。
-
page-break-marks并非标准CSS属性,也未被任何主流浏览器支持;它源于对出版软件裁切标记的误迁,@page规则仅支持尺寸、边距等基础打印控制,无法生成物理裁切线。
-
在Vue3组合式API中,app.mount()返回的是根组件实例(而非应用实例),只有通过该实例才能访问setup()中暴露的响应式数据;直接操作app.timer无效,正确做法是保存mount()的返回值并更新其属性。在Vue3组合式API中,`app.mount()`返回的是根组件实例(而非应用实例),只有通过该实例才能访问`setup()`中暴露的响应式数据;直接操作`app.timer`无效,正确做法是
-
最简可行轮播图需用原生JS控制transform:translateX()与setInterval,确保不跳帧、响应及时、索引取模防越界;手动操作后重置定时器;无缝轮播靠首尾复制DOM;触摸滑动用rAF节流+touchend判定。