-
transition适用于简单状态过渡，animation配合@keyframes实现复杂动画；推荐使用transform和opacity以提升性能。
-
将CSS拆分为base、layout、component、theme等LESS模块，按功能职责划分并用嵌套+命名空间控制作用域，变量与mixin集中管理，构建时合并压缩但保留sourcemap以兼顾可维护性与调试体验。
-
Lighthouse自定义指标是通过UserTimingAPI在页面中插入以user-开头的mark和measure，用于监控特定业务逻辑耗时。开发者可在性能报告中查看这些指标，结合CI/CD实现持续性能追踪，确保关键路径性能可控可优化。
-
HTML5通过SVG标签原生支持可缩放不失真矢量图形，支持静态绘制、CSS样式控制、JavaScript动态修改、requestAnimationFrame驱动动画及<animate>声明式动画五种方式。
-
CSS中用border-radius:50%可使等宽高等尺寸元素呈正圆；SVG通过<circle>标签以cx、cy、r精确绘圆，缩放无损；Canvas则用arc()方法配合fill()/stroke()动态绘圆。
-
Svelte是一个构建时编译器，将.svelte文件编译为无框架依赖的原生JS代码，直接操作DOM；它不依赖运行时、无虚拟DOM、无响应式系统开销，响应式逻辑在编译期静态分析并转为显式赋值与DOM更新。
-
empty()清空内容保留元素，remove()彻底删除元素及事件；根据是否需保留父元素选择方法。
-
Flex布局可彻底解决导航栏错位问题：需父容器设display:flex并重置float、margin等旧样式，统一字体行高，控制子项尺寸与换行，确保基线对齐。
-
:focus伪类用于定义表单元素获得焦点时的样式，如input、textarea等。当用户点击或使用Tab键激活元素时，通过设置border-color、box-shadow等属性可增强视觉反馈，提升交互体验。需注意清除默认outline后应提供替代样式，如改变边框、背景色或添加阴影，确保键盘用户的可访问性。统一应用于各类表单控件可保持界面风格一致，合理使用能显著提高表单可用性和美观度。
-
使用aspect-ratio属性或padding-top技巧可让网格子元素保持固定比例。1.推荐使用aspect-ratio：现代浏览器支持，直接设置宽高比，如aspect-ratio:1/1实现正方形；2.兼容旧浏览器可用padding-top：通过height:0和padding-top百分比（如100%对应1:1）创建比例容器，内容用绝对定位填充。常用于图片卡片、视频等响应式场景，结合grid布局实现自适应且比例统一的视觉效果。
-
使用color属性设置文字颜色，支持颜色名、十六进制、RGB、RGBA；2.用background-color设置背景色；3.background-image添加背景图，配合repeat、position、size、attachment控制显示；4.background简写属性整合背景样式。示例展示了文本与背景的常用配置，强调可读性与视觉协调。
-
执行上下文是代码运行环境，分全局、函数和eval三种，创建时先设变量对象、作用域链和this，再执行代码；作用域链决定变量查找路径，由词法作用域确定，函数定义时即固定；变量提升使var声明前置但初始化为undefined，let/const存在暂时性死区；闭包通过作用域链保留对外部变量的引用，实现数据持久化。
-
pushState在历史栈新增记录，replaceState直接替换当前记录；两者参数均为(state,title,url)，其中state为可序列化数据，title被忽略，url须同源；仅浏览器导航触发popstate事件，需手动监听并初始化渲染。
-
应优先使用构造函数或class而非工厂模式。因工厂模式返回Object实例，丢失类型信息，instanceof判断失效；而构造函数和class能建立明确类型关系、支持继承与原型方法，保障类型系统有效性。
-
JavaScript用URL和URLSearchParams接口安全解析、构造URL：URL解析结构化信息，URLSearchParams操作查询参数并自动编码，IE需polyfill。
