How to use the throttle-debounce.throttle function in throttle-debounce

To help you get started, we’ve selected a few throttle-debounce examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github chakra-ui / chakra-ui / packages / hooks / src / useSlider / useSlider.tsx View on Github external
(event: React.PointerEvent) => {
      setIsPointerDown(false);

      if (trackRef.current) {
        trackRef.current.releasePointerCapture(event.pointerId);
      }

      if (onChangeEnd) {
        onChangeEnd(value);
      }
    },
    [onChangeEnd, value],
  );

  // throttle the pointer move function
  const log = throttle(100, (event?: any) => {
    // setIsHovering(true)
    const nextValue = getValueFromPointer(event);
    console.log(nextValue);
  });

  const onPointerLeave = () => {
    // setIsHovering(false)
  };

  const onPointerMove = (event: React.PointerEvent) => {
    event.persist();
    log(event);
    if (isPointerDown) {
      const nextValue = getValueFromPointer(event);
      if (nextValue !== value) {
        updateValue(nextValue);
github dfinityexplorer / dfinityexplorer / web / src / Components / ResponsiveComponent / ResponsiveComponent.js View on Github external
constructor() {
    super();

    // Bind to make 'this' work in callbacks.
    this.handleWindowResize = this.handleWindowResize.bind(this);

    // Throttle the calls to handleWindowResize() so that we're not constantly re-rendering.
    this.throttledHandleWindowResize = throttle(200, true, this.handleWindowResize);
  }
github NullVoxPopuli / ember-three-boxes-demo / app / components / demo / -base-demo-component.js View on Github external
animate(updateCanvas) {
    let last = Date.now();
    let boundCallback;

    let fpsUpdate = () => {
      this.fps = Math.round(avg(this.frames));
    }
    let updateFps = throttle(120, fpsUpdate);

    function loop() {
      let rotations = this.appState.rotations;
      this.frame = requestAnimationFrame(boundCallback);

      for (let i = 0; i < rotations.length; i++) {

        // this.rotations[i].x += 0.01;
        // this.rotations[i].y += 0.01;
        // this.rotations[i].z += 0.01;
        let rotation = rotations[i];
        rotation.r = {
          x: rotation.r.x + 0.01,
          y: rotation.r.y + 0.01,
          z: rotation.r.z + 0.01,
        }
github nk-o / ghostkit / src / assets / js / script.js View on Github external
hasScrolled();
                } );
        } );

        // Set FS video size.
        const throttledSetFullscreenVideoSize = throttle( 200, () => {
            rafl( () => {
                self.setFullscreenVideoSize();
            } );
        } );
        $( window ).on( 'DOMContentLoaded load resize orientationchange', () => {
            throttledSetFullscreenVideoSize();
        } );

        // Init blocks.
        const throttledInitBlocks = throttle( 200, () => {
            rafl( () => {
                self.initBlocks();
            } );
        } );
        if ( window.MutationObserver ) {
            new window.MutationObserver( throttledInitBlocks )
                .observe( document.documentElement, {
                    childList: true, subtree: true,
                } );
        } else {
            $( document ).on( 'DOMContentLoaded DOMNodeInserted load', () => {
                throttledInitBlocks();
            } );
        }

        // Prepare hash changes.
github bem / bem-react-components / blocks / Popup / _autovisible / Popup_autovisible.js View on Github external
willInit() {
        this.__base(...arguments);

        this._calcIsAnchorVisible = this._calcIsAnchorVisible.bind(this);
        this.onAnchorParentsScroll = throttle(100, this.onAnchorParentsScroll.bind(this));
        this.onViewportResize = throttle(100, this.onViewportResize.bind(this));
        this._bindToScroll = this._bindToScroll.bind(this);
        this._unbindFromScroll = this._unbindFromScroll.bind(this);
    },
github johannesjo / super-productivity / src / app / features / reminder / reminder.service.ts View on Github external
})
export class ReminderService {
  onReminderActive$ = new Subject();

  private _reminders$ = new ReplaySubject(1);
  reminders$ = this._reminders$.asObservable();

  private _onReloadModel$ = new Subject();
  onReloadModel$ = this._onReloadModel$.asObservable();

  private _isRemindersLoaded$ = new BehaviorSubject(false);
  isRemindersLoaded$: Observable = this._isRemindersLoaded$.asObservable();

  private _w: Worker;
  private _reminders: Reminder[];
  private _throttledShowNotification = throttle(60000, this._showNotification.bind(this));

  constructor(
    private readonly _projectService: ProjectService,
    private readonly _globalSyncService: GlobalSyncService,
    private readonly _persistenceService: PersistenceService,
    private readonly _notifyService: NotifyService,
    private readonly _snackService: SnackService,
    private readonly _taskService: TaskService,
    private readonly _noteService: NoteService,
    private readonly _imexMetaService: ImexMetaService,
  ) {
  }

  init() {
    if (typeof Worker !== 'undefined') {
      this._w = new Worker('./reminder.worker', {
github sjchmiela / pokedex / src / organisms / ApplicationDrawer.jsx View on Github external
constructor(props) {
    super(props);
    this.throttledSetState = throttle(500, this.setState);
    this.state = {
      speciesListSearchTerm: null,
    };
  }
github vuejs / vue-apollo / packages / vue-apollo-composable / src / useSubscription.ts View on Github external
function updateRestartFn () {
    if (currentOptions.value.throttle) {
      debouncedRestart = throttle(currentOptions.value.throttle, baseRestart)
    } else if (currentOptions.value.debounce) {
      debouncedRestart = debounce(currentOptions.value.debounce, baseRestart)
    } else {
      debouncedRestart = baseRestart
    }
  }
github falstack / vue-mixin-store / src / FlowList.vue View on Github external
return el
        }
        el = el.parentNode
      }
      return document
    },
    initFlowLoader() {
      if (this.error) {
        return
      }
      if (checkInView(this.$refs.state)) {
        this.loadMore()
      }
      on(this.getTarget(), 'scroll', this.onScreenScroll)
    },
    onScreenScroll: throttle(200, function() {
      if (this.error) {
        return
      }
      if (this.noMore || !this.auto) {
        off(this.getTarget(), 'scroll', this.onScreenScroll)
        return
      }
      if (checkInView(this.$refs.state)) {
        this.loadMore()
      }
    })
  }
}
github MaxGraey / Assembleash / src / Containers / EditorContainer.js View on Github external
this.handleSize(size);
    }

    onCompileButtonClick = mode => {
        this._clearCompileTimeout();

        if (mode === CompileMode.Auto || mode === CompileMode.Manual)
            this.updateCompilation();
    }

    onSettingsOptionChange = (key, value) => {
        if (!this.state.compilerReady) return;
        this.setState({ [key]: value }, key !== 'base64' ? this.updateCompilation : null);
    }

    handleSize = throttle(8, size => {
        if (this.splitEditor) {
            if (!this._cachedClientRect)
                this._cachedClientRect = ReactDOM.findDOMNode(this.splitEditor).getBoundingClientRect();

            const { width, height } = this._cachedClientRect;
            const pos = (size ? size / width : this.state.splitPosition);
            const primaryWidth = width * pos;

            this.setState({
                inputEditorWidth:  Math.ceil(primaryWidth),
                outputEditorWidth: Math.ceil(width - primaryWidth - SplitGripWidth),
                editorsHeight:     height - 160,
                splitPosition:     pos,
            });

            this.splitEditor.setSize(

throttle-debounce

Throttle and debounce functions.

MIT
Latest version published 1 month ago

Package Health Score

83 / 100
Full package analysis