debounce (2) 썸네일형 리스트형 [팀 프로젝트] 방콕스타일 - 검색 기능 구현 (Debounce) Debounce란? 📖 연속적으로 발생한 이벤트를 하나로 처리하는 방식입니다. 마지막으로 실행된 함수만을 실행합니다. 예를 들어 input에 `hello`를 타이핑하려고 할 때 콘솔을 출력해 보면hhehelhellhello이렇게 한 글자씩 출력이 되는 걸 확인할 수 있습니다. 반면, Debounce delay시간을 1초로 설정할 경우 1초 동안 기다렸다가 화면에 반영하기 때문에 여러 번 출력되지 않습니다.hello 프로젝트 적용 📖useDebounce 커스텀 훅 사용import React, { useEffect, useState } from "react";const useDebounce = (value, delay = 200) => { const [debounceValue, setDebounceVa.. [TIL] 24.07.17 쓰로틀링(성능 측정) Throttling 이란? 📖짧은 시간 간격으로 연속해서 이벤트가 발생했을 때, 과도한 이벤트 핸들러 호출을 방지하는 기법입니다. 1. 쓰로틀링 (throttling)일정 주 동안 이벤트 핸들러를 한 번만 실행하도록 제어하는 것 일정한 간격으로 한 번만 실행하는 기법이기 때문에 이벤트 처리를 제어하고, 성능 향상을 할 수 있습니다.예를 들면 스크롤 이벤트가 발생할 때 이벤트가 너무 많이 발생하면 성능 저하 문제가 생길 수 있기 때문에 이때 쓰로틀링을 적용하면 일정 주기 동안 이벤트를 제어하기 때문에 성능을 개선할 수 있습니다. 그래서 팀 소개 프로젝트에 쓰로틀링을 적용해보려고 합니다. 사용 방법실제로 작성한 코드 입니다.const throttleCallback = () => { const scro.. 이전 1 다음
