”工欲善其事,必先利其器。“—孔子《论语.录灵公》
首页 > 编程 > 防止重新执行已使用相同参数处理过一次的大型 JavaScript 函数。

防止重新执行已使用相同参数处理过一次的大型 JavaScript 函数。

发布于2024-08-29
浏览:600

Prevents re-execution of large javascript functions that have been processed once with the same parameter.

记忆法

使用相同参数执行的函数的缓存机制(memoizer)(仅 1.14 KB)

该项目提供了一个 memoize 函数,通过缓存昂贵的函数调用结果来提高 JavaScript 或 TypeScript 项目的性能。通过记忆,使用相同参数的重复调用将返回缓存的结果,从而加快执行速度。

这个模块的工作方式类似于react的useMemo钩子,但不需要react。您可以使用任何框架或纯javascript项目

Npm 包
GitHub

特征

  • 函数记忆:缓存具有相同参数的函数调用结果。
  • 依赖项跟踪:如果依赖项发生更改,则更新缓存。
  • 灵活性:可用于 JavaScript 和 TypeScript 项目。
  • CPU密集型运算或复杂计算的最佳解决方案
  • 断开连接的功能将从内存中删除。属于该函数的缓存也会被删除。
  • 基于WeakMap的缓存存储
  • WeakMap 断开无法与弱引用链接通信的方法并触发垃圾收集器启动

使用案例

没有 deps 参数

在下面的过程中,当使用相同的参数再次调用 concatPhoneNumber 方法时,该函数不会再次执行,而是从缓存中获取结果。

import memofy from "memofy";

const concatPhoneNumber = (extension, number) => {
  // Heavy calculation
  // return result
};

const memoizedConcatPhoneNumber = memofy(concatPhoneNumber, []);

memoizedConcatPhoneNumber(90, 555); // Runs concatPhoneNumber when first run
memoizedConcatPhoneNumber(90, 555); // get value from cache

memoizedConcatPhoneNumber(90, 552); // Runs concatPhoneNumber because params is change

带 deps 参数

如果希望该方法根据某些依赖关系以相同的参数再次运行,可以传递 deps 参数,如下。

import memofy from "memofy";

const taxRatio = 0.5;
const product = { title: "Test product", price: 10 };

const calculateTax = () => {
  // Calculate tax by product price
  // Heavy calculation
  return taxRatio * product.price;
};

const memoizedConcatPhoneNumber = memofy(calculateTax, [product, taxRatio]);

calculatedPrice = calculateTax(); // Runs concatPhoneNumber when first run

product.price = 40;
let calculatedPrice = calculateTax(); // Runs concatPhoneNumber because product dep changed

taxRatio = 0.8;
calculatedPrice = calculateTax(); // Runs concatPhoneNumber because taxRatio changed

绩效结果

区分素数的复杂函数的性能结果。性能测试

案件 多发性硬化症
首次执行时间(无缓存) > 52.08 毫秒
第二次执行时间(缓存)
以及后续执行(缓存)

测试覆盖率结果

针对所有情况和所有参数类型编写了测试。测试

文件 % 语句 % 分支 % 函数 % 行 未覆盖的行#s
所有文件 100 100 100 100 0
100 100 100 100 0
index.ts 100 100 100 100 0
lib/store 100 100 100 100 0
CacheStore.ts 100 100 100 100 0
DepsStore.ts 100 100 100 100 0
版本声明 本文转载于:https://dev.to/ahmetilhn/prevents-re-execution-of-large-javascript-functions-that-have-been-processed-once-with-the-same-parameter-1ici?1如有侵犯,请联系[email protected]删除
最新教程 更多>

免责声明: 提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请说明详细缘由并提供版权或权益证明然后发到邮箱:[email protected] 我们会第一时间内为您处理。

Copyright© 2022 湘ICP备2022001581号-3