前端开发

CSS中contain:layout+paint通过隔离元素提升渲染性能，但容器必须设置明确的尺寸（例如height），否则会失效。contain:content已被废弃，contain:strict极容易引发布局塌陷。进行动态设置时需要注意时机与浏览器兼容性，验证时应使用PaintFlashing等工具而非仅查看getComputedStyle。

CSS中transparent被硬性映射为rgba(0,0,0,0)，在渐变插值时产生暗红、灰黑等非预期色阶，导致末端灰边；多色标中混用sRGB与关键字时出现跳变；border交界处因黑色补位产生细线；transition中拒绝插值直接闪变。需统一使用RGBA空间，明确写出带原始色相的rgba(r,g,b,0)实现可控透明。

通过定义基础HTTP类统一配置，支持请求与响应拦截器机制，提供get、post等一系列快捷方法，并集成加载中状态与错误反馈提示，成功实现了可扩展、可维护的网络请求库封装，显著提升了团队协作效率与代码一致性。

CSSModules通过构建时生成带哈希的唯一类名实现样式隔离，需注意文件后缀、导入路径和构建配置三者对齐。动态拼className需校验存在性，:global()仅用于第三方库样式覆盖。哈希变化是设计特性，需注意测试与SSR一致性。但全局元素样式仍需其他方案。

柯里化通过闭包逐步存储参数，实现延迟计算与参数复用。每次调用返回新函数，累积参数至达到原函数形参数量（fn length）后，通过fn apply一次性执行。支持单次传入多参数，并通过bind等方式绑定this上下文，避免丢失。

await挂起异步函数执行上下文而非线程，只能用于async函数内，等待Promise或thenable对象。后续代码作为微任务在Promise解决后立即调度，不阻塞主线程。避免对非Promise值（如setTimeout）使用await，否则会同步返回且后续代码同步执行，应包裹在Promise中。

利用`::before`伪元素与`transform:scaleX`实现按钮背景从中间向两边展开：初始`scaleX(0)`缩为竖线，悬停`scaleX(1)`拉伸至全宽。需父容器`overflow:hidden`，伪元素`transform-origin:center`，文字`z-index:1`避免遮挡。该方案由GPU加速，性能优于`width`。

CSS中@import导致串行加载，浏览器需等上一文件完成才能下载下一文件。HTML预加载器无法识别@import，无法并行下载，多层嵌套加剧延迟。IE和旧版Safari需DOM解析完毕才处理@import，样式滞后引发闪烁。替换为需注意依赖顺序和media属性，否则仍可能出现问题。

Bootstrap列表组件用CSSCounters生成序号时，counter-reset必须设于 list-group容器而非子项，否则每个序号均为1。用绝对定位与padding-left避免文字错位。嵌套列表需独立命名计数器，兼容性差时改用ol list-style-type或降级方案。

Less中`!default`仅在变量首次声明时生效，提前赋值（如重复导入或顺序错误）会导致后续忽略。建议分层导入：基础库用带`!default`的兜底变量，用户文件用无`!default`强制赋值，严格按基础库→用户文件→组件顺序导入，避免组件内重复声明，并注意第三方库同名变量可能截胡。

CSS渐变中色标重叠可形成硬边条纹，当相邻色标值完全相同时浏览器瞬间切换颜色，产生清晰条纹。需配合background-size设置周期长度实现平铺，所有色标单位必须统一，否则易出现渲染错误或显示异常。

Sequelize中定义belongsTo hasOne关系后外键字段未自动生成，原因是模型关联仅建立逻辑联系，不修改表结构。需在模型定义中显式声明外键字段，或关联定义后单独同步含外键模型（如User sync({alter:true})）才能落地外键列。

通过统一事件监听主菜单与子菜单，利用setTimeout延迟300毫秒隐藏并清除定时器，有效解决鼠标移出时菜单闪退问题。同时优化HTML结构和事件绑定，避免频繁触发，实现菜单的平滑悬停保持效果，显著提升用户体验。

电话号码掩码处理时，先用正则提取所有数字，取最后四位，拼接成xxx-xxx-XXXX格式。该方法非常简洁高效，避免复杂正则匹配错误，适用于手机、固话等多种号码脱敏，仅暴露最后四位，兼顾隐私与识别，通用性强且处理速度快。

利用原生HTML和JavaScript实现输入端口号跳转到同域名URL，需确保ID唯一性、模板字符串使用反引号、脚本在DOM加载后执行，并对输入进行有效性校验（如数字范围），避免常见错误，提升代码健壮性。