在样式开发中，SCSS 与 Less 这类预处理器和原生 CSS 相比，主要差异体现在哪些方面？

回答思路

1. 【回答框架 1】CSS 是层叠样式表的标准语言，由浏览器直接解析执行；SCSS 与 Less 是预处理器，扩展了 CSS 语法，支持变量、嵌套、混合、函数等编程特性，需编译成原生 CSS 后使用。
2. 【回答框架 2】核心差异在于编程能力：预处理器引入变量减少重复，嵌套选择器简化层级书写，混合（mixin）复用样式块，函数与运算处理颜色和单位，而原生 CSS 近年也支持自定义属性和部分运算，但功能与语法简洁度仍有差距。
3. 【回答框架 3】工程化方面，预处理器支持模块化导入、条件与循环逻辑，便于维护大型项目；同时相对早期 CSS 而言，为团队协作和主题定制提供便利。需注意编译步骤增加构建复杂度，且嵌套过深会导致选择器冗余。
4. 【回答框架 4】适用场景上，小项目或纯静态页面可直接用 CSS；中大型项目、组件化开发或需要动态样式逻辑时，预处理器优势明显。现代 CSS 新特性可部分替代，但在生态和成熟度上预处理器仍占主流。
5. 【回答框架 5】性能上，预处理器编译后的 CSS 与手写 CSS 相同，最终无运行时开销；但错误调试需映射到源文件，构建配置与依赖需额外维护。
6. 【关键点 1】预处理器提供变量、嵌套、混合、函数等编程能力，CSS 为静态标准语言。
7. 【关键点 2】使用预处理器需编译，增加构建步骤，最终产物仍是 CSS。
8. 【关键点 3】现代 CSS 新特性可部分替代预处理器功能，但生态与成熟度仍有差异。
9. 【易错点 1】不能夸大预处理器对性能的影响，编译后与手写 CSS 无性能差别。
10. 【易错点 2】嵌套过深会导致选择器冗长，增加特异性问题，应避免无限制嵌套。
11. 【易错点 3】原生 CSS 已支持自定义属性与部分运算，并非所有场景都需预处理器。