Don’t worry about failures

이전글에서 리액트의 동시성에 대해 살펴봤었다. https://sangwonny.tistory.com/78 concurrent mode에 대해 리액트 18버전부터 등장한 개념으로 리액트에서 concurrent(동시성)에 대해 몇년동안 연구하고 분석한 결과 나오게 되었다. Concurrent React 자바스크립트의 특성상 싱글쓰레드로 하나의 작업씩 처리 sangwonny.tistory.com 이번 글에서는 동시성 처리를 위한 훅에 대해 살펴보겠다. 우선 최신 리액트 프로젝트를 생성하면 다음과 같을 것이다. import React from 'react'; import ReactDOM from 'react-dom/client'; import './index.css'; import App from './App'..

리액트 18버전부터 등장한 개념으로 리액트에서 concurrent(동시성)에 대해 몇년동안 연구하고 분석한 결과 나오게 되었다. Concurrent React 자바스크립트의 특성상 싱글쓰레드로 하나의 작업씩 처리가 된다. 렌더링 작업이 일어나고 있을 때 다른 작업을 진행못하고 blocking되는 현상이 존재한다. 하지만 우리는 평소에 과한 렌더링 작업이 없기에 느끼지 못할 수 있다. 간단한 테스트를 해보자. input을 통해 들어온 값에 따라 1000개의 element가 새롭게 들어온다고 해보자 간단하게 아래와 같이 작성후 const [array, setArray] = useState([]); const inputHandler = useCallback((e) => { const inputValue = e..