面试题答案
一键面试策略一：使用 createMemo 进行状态缓存
- 原理：
createMemo会根据依赖自动缓存计算结果，只有当依赖发生变化时才重新计算。这避免了不必要的重复计算，从而提升性能。例如，如果一个复杂计算依赖于几个状态，但只有其中一个状态变化时，createMemo不会重新计算所有相关逻辑，而是复用之前的计算结果。 - 适用场景：适用于计算结果昂贵（计算过程复杂、耗时）且依赖相对稳定的情况。比如，在多层嵌套组件中，某个子组件依赖于父组件的多个状态来计算一个复杂的展示数据，而这些状态不是频繁变化。
策略二：使用 createEffect 控制副作用触发时机
- 原理：
createEffect会在依赖变化时执行副作用。通过精心选择依赖数组，可以精确控制副作用何时执行。只将真正影响副作用逻辑的状态放入依赖数组，这样可以避免因无关状态变化而触发不必要的副作用。 - 适用场景：当副作用与特定的状态变化紧密相关时使用。例如，在多层嵌套组件中，只有当某个特定的数据加载完成（对应一个状态变化）后，才执行更新DOM元素样式的副作用操作。
策略三：防抖（Debounce）和节流（Throttle）
- 原理：
- 防抖：在指定时间内，如果事件被频繁触发，只会在最后一次触发事件停止后的指定时间执行。例如，用户频繁触发一个搜索框的输入事件，防抖可以设置在用户停止输入一定时间（如300毫秒）后才执行搜索逻辑，避免了每次输入都执行搜索带来的性能开销。
- 节流：规定在一定时间内，只能触发一次事件。比如，滚动事件可能会被频繁触发，节流可以设置每500毫秒触发一次相关的副作用逻辑，而不是每次滚动都触发。
- 适用场景：
- 防抖：适用于用户频繁操作但希望减少执行次数的场景，如搜索框输入、按钮连续点击等。
- 节流：适用于频繁触发但不需要每次都响应的场景，如滚动、窗口resize事件等。
策略四：拆分复杂副作用为多个简单副作用
- 原理：将复杂的副作用逻辑拆分成多个小的、职责单一的副作用函数。每个小的副作用函数可以有自己独立的依赖控制，这样能更精细地管理副作用的执行，减少不必要的执行。例如，原本一个复杂的副作用函数既要处理数据更新又要更新UI，拆分成数据更新副作用和UI更新副作用，分别控制其依赖。
- 适用场景：当复杂副作用包含多个不同逻辑且依赖不同状态时，拆分可以让代码更清晰，性能优化更有针对性。在多层嵌套组件中，不同层次的组件可能关心不同部分的状态变化，拆分副作用能满足各组件按需响应。