如何复用MotorCortex的Incident？淡入事件重复创建优化咨询

完全可以复用同一个CSSEffect实例来添加多次incident，不需要每次新建，这是更高效的实现方式。

你的当前代码每次创建新的CSSEffect实例，其实完全没必要——只要动画的属性（目标选择器、时长、动画属性）没有变化，直接复用同一个实例即可，既减少对象创建开销，也让代码更简洁。

优化后的代码如下：

// 只创建一次CSSEffect实例
const attrs = { animatedAttrs: { opacity: 1 } };
const props = { selector: ".elem", duration: 1000 };
const fadeInEffect = new CSSEffect(attrs, props);

// 第一次添加incident
clip.addIncident(fadeInEffect, 1000);

// 执行其他操作后，再次复用同一个实例添加incident
// do something else and then later on
clip.addIncident(fadeInEffect, 1000);

如果后续需要根据不同场景调整动画参数（比如不同的目标元素、时长），可以封装一个简单的工厂函数来生成实例，避免重复代码：

function createFadeInEffect(selector = ".elem", duration = 1000) {
  return new CSSEffect(
    { animatedAttrs: { opacity: 1 } },
    { selector, duration }
  );
}

// 复用工厂函数生成不同参数的实例
const fadeInElem1 = createFadeInEffect(".elem1");
const fadeInElem2 = createFadeInEffect(".elem2", 1500);

clip.addIncident(fadeInElem1, 1000);
clip.addIncident(fadeInElem2, 2000);

内容的提问来源于stack exchange，提问作者the punk