/
npmgit

Timeout

Вспомогательные функции для cоздания таймеров и декораторов для улучшения производительности. Composable function to create timeouts and improve responsiveness.

Import

js
import useProximaTimeout from 'proxima-vue/composables/timeout';

Timeout

js
import useProximaTimeout from 'proxima-vue/composables/timeout';

const showMessage = () => console.log('Hello, world!');
const { addTimeout } = useProximaTimeout();

addTimeout(showMessage, 2000); // output message after 2 seconds

// Clear

const clearMessageTimeout = addTimeout(showMessage, 2000);

clearMessageTimeout(); // you can clear timeout

Throttle

Декоратор для ограничения частоты вызова функции в течение заданного периода времени: Throttling is a technique that limits how often a function can be called in a given period of time:

js
import { onMounted, onBeforeUnmount } from 'vue';
import useProximaTimeout from 'proxima-vue/composables/timeout';

const { addThrottle } = useProximaTimeout();

onMounted(() => {
  // called only once every 100ms
  const throttledScroll = addThrottle(() => console.log('scroll'), 100);

  window.addEventListener('scroll', throttledScroll);

  onBeforeUnmount(() => window.removeEventListener('scroll', throttledScroll));
});

Debounce

Декоратор для отложенного выполнения функции через заданный период времени с момента последнего вызова: Debouncing is a way of delaying the execution of a function until a certain amount of time has passed since the last time it was called:

js

import useProximaTimeout from 'proxima-vue/composables/timeout';

const { addDebounce } = useProximaTimeout();

const showMessage = () => console.log('Hello, world!');

const debouncedShowMessage = addDebounce(showMessage, 1000);

debouncedShowMessage(); // the call will be ignored
debouncedShowMessage(); // the call will be ignored
debouncedShowMessage(); // the call will be ignored
debouncedShowMessage(); // output message after 1 second

// Clear

const clearMessage = debouncedShowMessage();

clearMessage(); // you can clear the shown message
View source on GitHub