-
useContext通过createContext、Provider和useContext实现跨组件数据共享，解决propdrilling痛点，避免多层传递props，适用于主题、用户状态等全局数据共享，但需注意频繁更新导致的性能问题，建议拆分Context、使用useMemo优化；相比Redux或Zustand，useContext更轻量，适合简单场景，而复杂状态管理推荐Redux或Zustand。
-
color-mix()在旧浏览器中不报错而是静默失败，需用@supports检测并提供静态色值fallback。
-
ReactNative通过桥接机制实现JS与原生通信，支持调用相机、GPS等功能。1.原生模块在iOS需继承RCTEventEmitter并用RCT_EXPORT_MODULE导出，Android则继承ReactContextBaseJavaModule并用@ReactMethod标记方法。2.由于异步限制，原生方法无法直接返回值，需通过Callback或Promise传递结果：Callback适用于简单响应，Promise支持成功/失败处理，JS端可结合async/await使用。3.事件通信允许原生主
-
width和height不失效，而是受box-sizing（默认content-box）、display类型（如inline元素不支持）、flex/grid布局（如flex-shrink）及父容器高度塌陷等因素影响。
-
会，纯CSS的transform和opacity动画走GPU合成层，CPU占用低；而JS频繁修改top/left或触发layout会导致重排，CPU飙升，尤其在低配设备或复杂DOM下。
-
screen对象是浏览器全局对象，用于获取设备屏幕信息；screen.width/height返回逻辑分辨率，screen.availWidth/availHeight返回扣除系统UI后的可用区域；其值固定不随窗口变化，适合统计分析而非响应式布局。
-
浮动已基本被淘汰，动态修改float值会触发重排导致卡顿；应改用visibility/opacity隐藏、transform位移、Flex/Grid对齐，并用flow-root替代clearfix，配合DevTools定位重排区域。
-
使用相对单位和媒体查询确保动画响应式适配，关键在于用%、vw、vh定义@keyframes中的尺寸变化，并结合容器约束与box-sizing控制布局行为，使动画随屏幕调整自然呈现。
-
本文详解ReactRouterv6中<Route>不显示组件的核心原因：路径冲突与API变更，并提供符合v6规范的正确写法、可运行示例及关键注意事项。
-
setTimeout只执行一次，适合防抖、延迟初始化等单次调度；setInterval重复执行但易导致时间不准、回调堆积、内存泄漏，需显式清除，精准轮询推荐用递归setTimeout实现。
-
关键在于避免动画元素频繁触发合成层更新，GPU只负责合成而非重绘；仅transform、opacity、部分filter变更可走合成线程；需用will-change+translateZ预创建层，杜绝强制同步布局，并管控图层生命周期。
-
当使用position:fixed显示弹出层时，若内容高度超出视口且未正确触发滚动，根源常在于固定定位脱离文档流后与overflow行为的冲突；改用position:relative并配合动态定位可彻底解决。
-
应清除浮动而非误用box-sizing：父容器高度塌陷需用overflow:hidden、display:flow-root或::after伪元素解决；box-sizing只影响自身宽高计算逻辑，对浮动塌陷无效。
-
首先确保HTML文件正确保存为.html后缀并使用UTF-8编码，然后通过浏览器打开文件或本地服务器运行，同时检查代码结构完整性，最后利用开发者工具排查渲染问题。
-
响应式机制有性能影响，但主要瓶颈在于不当的数据设计与渲染逻辑；应避免过度响应化、优化渲染层、精简依赖追踪，并合理利用Vue3的Proxy特性。
