Lodash는 JavaScript 유틸리티 라이브러리로, 다양한 도구와 함수를 제공하여 개발자들이 코드를 더욱 효율적이고 간결하게 작성할 수 있도록 도와줍니다. 이번에는 Lodash의 웹 소켓 관련 함수들과 그 사용 예제에 대해 알아보겠습니다.

1. _.throttle

_.throttle 함수는 주어진 함수를 일정 주기마다 실행할 수 있도록 해줍니다. 이는 웹 소켓 통신에서 사용자 이벤트나 API 호출 등을 제어하는 데 유용합니다.

다음은 _.throttle 함수의 사용 예제입니다.

import _ from 'lodash';

function sendWebSocketData(data) {
  // 웹 소켓 통신 코드
}

const throttledSend = _.throttle(sendWebSocketData, 1000); // 1초마다 실행

window.addEventListener('click', function(event) {
  throttledSend(event.target.innerText);
});

위의 예제에서는 클릭 이벤트가 발생할 때마다 sendWebSocketData 함수를 1초마다 실행합니다. 이를 통해 웹 소켓 통신이 너무 많이 발생하는 것을 제어할 수 있습니다.

2. _.debounce

_.debounce 함수는 주어진 함수를 일정 시간 동안 호출하지 않은 경우에만 실행될 수 있도록 해줍니다. 이는 웹 소켓 통신에서 사용자 입력에 대한 응답을 제어하는 데 유용합니다.

다음은 _.debounce 함수의 사용 예제입니다.

import _ from 'lodash';

function handleUserInput(input) {
  // 사용자 입력 처리 코드
}

const debouncedHandleInput = _.debounce(handleUserInput, 500); // 0.5초 이내로 반복 호출시에는 마지막 호출만 실행

window.addEventListener('input', function(event) {
  debouncedHandleInput(event.target.value);
});

위의 예제에서는 사용자가 인풋에 입력할 때마다 handleUserInput 함수를 0.5초 동안 호출하지 않은 경우에만 실행합니다. 이를 통해 사용자 입력에 대한 응답을 제어하고, 불필요한 웹 소켓 호출을 줄일 수 있습니다.

참고 자료

• Lodash 함수들 공식 문서
• 웹 소켓 통신 관련 블로그 글