Tuya Developer Forum

频繁触发下发dp操作，就会出现卡顿延迟的情况，ray中使用节流函数能生效，但是如果是对发送dp进行节流操作就会失效，应该如何解决这种频繁触发dp下发导致的卡顿延迟？

对发送dp的函数进行节流操作会失效是指，无法触发发送dp的函数吗？
方便贴一下用例上来不？

const handleSetClick = () => {
console.log('节流');
}
const handleDp = () => {
const dps = {
5: true,
};
setDpState(dps);
}
const handleReset1 = _.throttle(handleSetClick, 3000)//节流生效，三秒内频繁触发，只会执行一次
const handleReset2 = _.throttle(handleDp, 3000)//节流失效，三秒内频繁触发，会频繁执行，频繁发dp，导致页面卡顿延迟，真机调试卡段延迟很明显，会一直运行如下代码：
const handleDpDataChange: DpDataChangeHandler = data => {
console.log('===onDpDataChange',data);
const initalDevInfo = getDevInfo();
const newDpState = mapDpsMapToDpStateMap(data.dps, initalDevInfo) as DpState;
setDpStateAtom(newDpState);
};

setDpState 这个函数会频繁调用吗？
还是 setDpState 三秒内触发一次，但是 handleDpDataChange 的dp change 的回调执行多次？

setDpState这个函数会频繁调用，handleDpDataChange 的dp change 的回调也会执行多次

本地试了下没出现问题，能搞个demo，贴下git链接吗？

https://github.com/wfz2/demo.git
在真机调试中频繁触发会明显出现卡顿延迟

顶一下

顶

React 函数式组件中使用防抖节流不生效, 需要通过useCallback返回一个缓存的函数。

const handleClickDpPublish = useCallback(
    throttle(() => {
      if (!boolDpSchema) {
        return;
      }
      const dps = {
        [boolDpSchema.code]: !dpState[boolDpSchema.code],
      };
      setDpState(dps);
    }, 5000),
    []
  );