如何用惰性求值优化频繁调用的复杂计算函数？

迷人的治博提问于 2026-02-19 14:56:23 阅读 5

优化

在开发实时数据可视化时，我发现每帧都要调用一个计算坐标坐标的函数calculatePosition()，里面涉及大量三角函数运算。虽然用了缓存但参数每次都会变，导致缓存命中率很低，帧率明显下降。

我尝试把计算结果改成这样：


let position;
function update() {
  if (!position) {
    position = calculatePosition(); // 这里包含Math.sin/cos等运算
  }
  return position;
}

但发现第一次渲染时还是卡顿，而且参数变化时无法自动更新。是不是惰性求值用错了场景？有没有更好的按需计算方式能同时保证性能和准确性？

最佳实践

我来解答赞 1 收藏

反馈

1 条解答

姿言🍀 Lv1

最简单的办法是用一个带缓存的工厂函数，按需计算且自动更新。直接上代码：

function createLazyEvaluator(fn) {

  let lastArgs = null;

  let lastResult = null;

  return function(...args) {

    if (lastArgs === null || args.some((arg, i) => arg !== lastArgs[i])) {

      lastArgs = args;

      lastResult = fn.apply(this, args);

    }

    return lastResult;

  };

}



const lazyCalculatePosition = createLazyEvaluator(calculatePosition);



function update() {

  return lazyCalculatePosition(someParam1, someParam2); // 把参数传进去

}

这样既保证了性能，又不会因为参数变化导致错误结果。懒得每次都写判断逻辑就封装成通用方法，省事。

2026-02-19 15:03