-
命名应采用“前缀+功能+状态”组合（如user-profile-card），避免通用名冲突；scoped样式对动态DOM和第三方slot无效，需手动加唯一class或用CSS-in-JS；后代选择器易失控，推荐单一class或一级BEM嵌套；媒体查询和伪类须包裹在组件class内以防全局污染。
-
路由别名（alias）的核心作用是让同一组件响应多个URL路径且地址栏保持不变；配置需配合具体path，支持数组多别名及带参数别名，但path为'/'时alias无效；与redirect本质区别在于alias不改变URL，而redirect会跳转并重写URL。
-
手绘风格页面需CSS模拟质感与canvas绘图结合；坐标须用getBoundingClientRect()计算，禁用offsetLeft；线条要抖动、圆头、禁抗锯齿；纹理优先SVG；移动端需preventDefault()和touchAction:none。
-
用rgba()控制遮罩背景透明度，别用opacity；后者会使子元素变透明、文字发虚、点击失效，而rgba()仅影响背景，子元素保持清晰可交互。
-
F型浏览模式是用户视线在网页上自然形成的热区路径，HTML需将关键信息置于左上、用语义化标签明确层级，CSS通过对比度、留白和排版节奏强化该路径，而非机械套用F形布局。
-
需用ResetCSS或NormalizeCSS统一浏览器默认样式差异，前者清零所有样式从零构建，后者保留语义化表现并修正跨浏览器不一致问题，推荐优先使用Normalize.css并置于样式表最前加载。
-
应监听mousemove或touchmove（依设备能力探测），将归一化坐标存入:root的CSS变量（如--mouse-x-pct），CSS中用background-position:var(--mouse-x-pct)%var(--mouse-y-pct)%或transform:translate(var(--mouse-x),var(--mouse-y))实现平滑响应，注意单位一致、防抖及移动端preventDefault。
-
position:absolute未按父元素定位是因为父元素未提供定位上下文；必须给父元素显式设置position:relative（或其他非static值）才能使其成为定位参照物。
-
break-inside:avoid在打印时失效，主要因它仅对块级容器生效，且要求父容器为BFC、子元素为块级；inline、flex、float、absolute元素及tr/td/li等均不支持，需改用break-before/after或page-break-*兼容处理。
-
在HTML中添加TwitterCards需在head中设置meta标签，包括card类型、site账号、title、description和image等信息，并通过TwitterCardValidator验证效果。
-
WebAssembly在图像卷积中比JavaScript快，因其采用线性内存、强类型和SIMD指令，直接映射C/Rust内存访问模式，避免JS动态类型检查与V8循环优化瓶颈；但仅在图像≥1024×768且卷积核≥3×3时优势稳定，小规模任务反因启动、调用及内存拷贝开销而更慢。
-
本文介绍一种通用方案：使用透明遮罩层（loadingoverlay）禁用页面元素的点击、右键等交互，同时允许用户通过鼠标滚轮或触摸滑动来浏览内容，且无需修改被遮罩的原始DOM结构。
-
用loading="lazy"和LQIP组合实现渐进加载：src指向小尺寸模糊占位图，data-src存高清图地址，通过IntersectionObserver监听视口进入后替换src并添加loaded类触发动画，避免直接对大图应用filter导致性能问题。
-
JavaScript错误处理需结合try-catch捕获同步异常，async/await或Promise.catch处理异步错误，配合window.onerror和unhandledrejection全局监听，并通过自定义错误类型提升可维护性。
-
内联样式适用于动态内容的高频小范围变动，通过JavaScript直接控制元素状态如实时更新宽度或透明度，结合变量绑定和计算属性提升渲染效率与响应能力，避免频繁DOM操作；利用requestAnimationFrame优化动画性能，但需规范使用以规避维护难题，仅用于真正动态部分，静态样式仍由CSS文件管理，推荐在组件化开发中采用CSS-in-JS或styled-components封装，确保结构清晰与可维护性。
