ray框架中,对下发dp的函数进行节流操作,不生效,请问如何解决呀

面板小程序开发相关产品技术讨论,包括面板小程序、智能小程序、React Native、Ray跨端框架、Panel SDK、微信小程序、小程序开发工具(IDE)及其他开发技术相关等话题


xww
Posts: 52

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

User avatar
Muzzzhi
Posts: 80

Re: ray框架中,对下发dp的函数进行节流操作,不生效,请问如何解决呀

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

:geek: :ugeek: :mrgreen: :roll: :lol: :idea: :arrow: LGTM

xww
Posts: 52

Re: ray框架中,对下发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);
};

User avatar
Muzzzhi
Posts: 80

Re: ray框架中,对下发dp的函数进行节流操作,不生效,请问如何解决呀

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

:geek: :ugeek: :mrgreen: :roll: :lol: :idea: :arrow: LGTM

xww
Posts: 52

Re: ray框架中,对下发dp的函数进行节流操作,不生效,请问如何解决呀

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

User avatar
Muzzzhi
Posts: 80

Re: ray框架中,对下发dp的函数进行节流操作,不生效,请问如何解决呀

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

:geek: :ugeek: :mrgreen: :roll: :lol: :idea: :arrow: LGTM

xww
Posts: 52

Re: ray框架中,对下发dp的函数进行节流操作,不生效,请问如何解决呀

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

sandia
Posts: 61

Re: ray框架中,对下发dp的函数进行节流操作,不生效,请问如何解决呀

顶一下🏋️‍♀️

User avatar
Muzzzhi
Posts: 80

Re: ray框架中,对下发dp的函数进行节流操作,不生效,请问如何解决呀

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

Code: Select all

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

:geek: :ugeek: :mrgreen: :roll: :lol: :idea: :arrow: LGTM

Post Reply