【性能优化】前置后置节流防抖,防止不避免情况下重复触发

　本文主要记录分享下 性能优化 中在 不可避免 情况下重复请求或者重复调用方法下的前置后置 节流防抖 的处理方式,以下为js版本其他语言可以 参考 类似。

优化效果

　以下是优化前后对比截图。

优化前

优化后

优化方法

　主要分享一下两种方式前置和后置

前置节流防抖

    /**
     * 前置节流防抖
     * @param func
     * @param delay
     * @returns {function(): *}
     */
    window.beforeThrottle = function (func, delay) {
        let lastCall = 0;
        return function () {
            const now = Date.now();
            if (now - lastCall < delay) {
                return;
            }
            lastCall = now;
            return func.apply(this, arguments);
        };
    }

后置节流防抖

  /**
     * 后置节流防抖
     * @param func
     * @param delay
     * @returns {(function(): void)|*}
     */
    window.laterThrottle = function (func, delay) {
        let lastCall;
        return function () {
            clearTimeout(lastCall);
            let that = this;
            lastCall = setTimeout(function () {
                func.apply(that, arguments);
            }, delay);
        }
    }

　前置主要是以第一次请求数据为主,后置主要以最后一次请求数据为主。

　以上就是关于性能优化前置后置节流防抖,防止不避免情况下重复触发的优化方案,有兴趣的可以尝试下,如果有更好的方案可以评论区分享下。