효율적인 이벤트 처리 기법 - [ 스로틀링 , 디바운싱 ]

효율적인 이벤트 처리 기법을 사용해야 하는 이유

효율적인 이벤트 처리 기법을 사용하게 되면, 앱 성능을 최적화 할 수 있고, 자원을 절약할 수 있기 때문이다.

또한, 통신을 통해 데이터를 주고받는 경우에서는, 불필요한 요청을 방지하여 트래픽을 감소시킬 수 도 있다.

 

최적화가 잘 된 어플리케이션은, 무엇보다 사용자가 앱을 이용하는데 부담이 덜 되게끔 하기 때문에, 중요한 스킬이라고 할 수 있다.

 

이벤트 처리 기법중에는 스로틀링과 디바운싱 이라는 기법들이 존재하며, 이들을 소개하고자 한다.

 

스로틀링이란?

특정 시간 간격 내에서 이벤트가 여러 번 발생하더라도, 그 중 한번만 실행되도록 하게 하는 기능.

예를 들어, 사용자가 스크롤을 계속하거나 키를 입력하는 등의 이벤트가 발생할 때, 너무 자주 실행되지 않도록 조절하는 방식이며, 이를 통해 연속적인 이벤트가 발생하더라도 일정한 간격을 두고 함수가 호출되도록 한다.

class Throttler {
  final Duration duration;
  Timer? _timer;
  bool _isThrottling = false;
  
  void Function() callback;

  Throttler({
    required this.duration,
    required this.callback,
  });

  // 쓰로틀링 작동 함수
  void run() {
    if (_isThrottling) {
      return;
    }
    
    callback();
    
    _isThrottling = true;
    _timer = Timer(duration, () {
      _isThrottling = false;
    });
  }

  void dispose() {
    _timer?.cancel();
  }
}

 

 

디바운싱이란?

이벤트가 여러번 발생할 때, 마지막 이벤트만 처리하도록 하는 기법이다.

즉, 2개 이상의 이벤트가 연속적으로 발생하는 이벤트에서 마지막 이벤트가 발생한 후 일정 시간 동안 추가 이벤트가 발생하지 않으면 함수를 실행하는 기법.

class Debouncer {
  final Duration duration;
  Timer? _timer;
  void Function() callback;

  Debouncer({
    required this.duration,
    required this.callback,
  });

  void run() {
    _timer?.cancel();
    _timer = Timer(duration, () {
      callback();
    });
  }

  void dispose() {
    _timer?.cancel();
  }
}