前端开发

样式冲突源于class暴露在全局作用域。隔离需依赖构建前缀、运行时注入与工具链协同，而非仅靠data-属性。常见问题包括CSSModules脱离构建失效、ShadowDOM破坏第三方库兼容性。建议统一团队前缀、配置PostCSS白名单并清除全局通配规则。

离线环境下持久化DOM节点需提取可序列化状态（如input value、光标偏移、uiState），结构化存储至IndexedDB，设计id、htmlSnapshot、formValues等核心字段。对大HTML实施分层处理、采用防抖保存并使用显式事务控制。恢复时同步还原DOM状态并重新绑定事件，实现离线完整持久化。

在响应式页面使用CSS灰度滤镜时，应作用于html元素覆盖整个视口，而非body；媒体查询用grayscale(1)替代grayscale(100%)避免兼容问题。轮播图、iframe等逃逸组件需显式加灰度或用MutationObserver动态处理。性能上禁用过渡动画，避免与transform组合，可用伪元素替代。

Vue组件生命周期中，异步请求的触发时机取决于是否依赖DOM：纯数据获取放created，需操作DOM放mounted。需处理竞态（如AbortController）、在activated中刷新keep-alive缓存数据，并在beforeUnmount或deactivated中清理定时器、事件监听及第三方实例，避免内存泄漏。

标准原型方法本质是运行时动态查找，沿原型链遍历属性会带来内存寻址和字符串比对等开销，无法实现零开销。真正零开销需转向编译期静态绑定，如C++模板、Rust派生宏或Go代码生成，将查找转化为计算。V8源码中属性查找函数包含分支判断和指针解引用，验证了运行时开销的必然性。

字体图标显示方块或问号，常见原因是字体文件加载时遭遇跨域限制。解决方法：向CDN响应添加跨域许可头，并在CSS字体声明中设置跨域属性为匿名；若仍无效，可将字体文件转为Base64编码直接嵌入样式表中，彻底规避跨域问题。

在事件循环中，Promise then的回调以微任务形式存在，在同步代码执行完毕后、下一个宏任务开始前集中执行，优先级高于所有宏任务。链式调用和async await的底层实现均依赖这一机制，从而保证了异步代码执行时序的可预测性。

原型式继承本质上是浅拷贝，仅实现属性委托复用而无法深拷贝。深拷贝需手动重写clone方法递归复制引用字段，或采用序列化（需实现Serializable）及第三方工具（如ApacheCommonsLang、Jackson）来生成完全独立的对象副本，彼此改动互不影响。

Pinia原生提供$reset()方法重置状态，Vuex需自定义方法并保留初始快照；使用provide inject时，应直接替换对象而非修改其内部属性。同时，重置操作应覆盖本地存储、定时器、路由参数等影子数据，确保状态完全恢复初始。

Bootstrap5的主题系统完全依赖CSS原生变量，Sass编译期变量失效。组件样式通过var()引用--bs-*变量，变量间存在链式依赖，需手动同步衍生变量。弹出层组件通过Portal渲染，只认:root下的变量，动态改变量时需注意calc()语法和空格。

Bootstrap5轮播图指示器形状修改：用[data-bs-target]替代li；长条圆角需设宽高比并让border-radius为高度一半；深色背景排查opacity和滤镜干扰；居中定位清理transform与position冲突。

HTML5已废弃font标签的color、size、face属性，标准模式下浏览器直接忽略。应改用CSS的style属性或外部样式表控制文字样式，这符合现代网页规范，保证跨浏览器兼容性，并提升代码可维护性。避免使用已淘汰的font标签。

V-once是编译期静态冻结，永久跳过响应式追踪和diff；v-memo是运行时条件记忆化，依赖数组浅比较决定子树是否复用。两者均为Vue3轻量高效渲染优化指令，不改变业务逻辑，分别适用于静态内容和局部稳定但高频更新场景。

分布式SSR中远程核心数据源异常会阻塞渲染，需采用分层try-catch逐级隔离。按数据依赖链最小粒度包裹，捕获后返回默认值而非抛错。对异步链路增加防御性处理，全局middleware层实现熔断与降级。错误日志必须携带分布式追踪ID，确保问题可追溯。

解决CSS样式命名冲突应优先采用CSSModules或外层命名空间包裹实现作用域隔离，避免滥用!important。BEM命名需与真实DOM结构对齐，确保类名归属明确。第三方库因高权重选择器覆盖自定义样式时，需通过DevTools排查权重或加载顺序问题。