[React] useState의 비동기성, 배치 업데이트(batch update)
·
React.js
비동기 업데이트와 배치 업데이트(batch update)비동기 업데이트React는 성능 최적화를 위해 상태 업데이트를 바로 반영하지 않고, 비동기적으로 처리합니다. 이는 내부 스케쥴러와 배치 업데이트(Batch Update) 매커니즘을 사용하기 때문입니다. ※스케쥴러란?React 내부에 구현된 메커니즘으로, 컴포넌트의 상태 업데이트와 렌더링 작업을 효율적으로 관리하고 스케줄링하는 시스템을 의미합니다.  배치 업데이트(batch update)컴포넌트가 여러 번 업데이트되더라도, 실제 DOM 요소에 변경사항을 적용하는 것을 최소화하여 애플리케이션의 성능을 최적화하는 기능입니다. 컴포넌트가 업데이트가 되면 아래와 같은 과정을 거치게 됩니다.컴포넌트의 render() 함수가 호출되어 Virtual DOM을 반환..
[React.js] useState 끄적이기
·
React.js
React.js의 useState란?React에서 가장 많이 사용하기도 하는 Hook(훅)이기도 하며 함수형 컴포넌트 내부에서 상태 관리를 가능하게 해주는 React의 Hook입니다. 상태값과 해당 상태를 업데이트하는 함수를 반환합니다. 또한, 리액트의 useState Hook은 자주 사용하는 hook이지만 몇 가지 주의점이 필요합니다.     useState 사용해보기useState는 현재의 값을 나타내는 부분과 현재의 값을 업데이트할 함수를 선언하고 그 뒤에 useState(초기값)으로 초기화를 해줍니다.                useState 상태관리를 활용한 모달창 useState hook을 활용하여 모달창을 열고 닫는 상태를 관리합니다.import React, { useState } from..