안녕하세요

최적화 툴들의 문제점 어떻게 고칠 지 알려주진 않음 a. Navigation b. Timespan c. Snapshot 일반적으로 navigation 사용 간단하게 알 수 있는 방법 Lighthouse LCP값을 보고 느린지 아닌지 확인 개발자도구 performance 탭 렌더링이 오래 걸리는 탭을 찾아서 수정하기 React에서 제공하는 성능 측정도구 Profiler 컴포넌트별로 렌더링 시간 확인 onRender 함수 설정하면 쓸 수 있게 된다. https://ko.reactjs.org/docs/profiler.html 다시 호출하느라 반짝이는 것은 안 좋은 UI lazyLoading 페이지네이션이 되어있지 않으면 렌더링 오래 걸리는 부분 1) 먼저 렌더링 된 부분을 보여주기 2) 레이지로드 하면 초기에..

과제 제출 [✅]레파지토리 이름은 wanted-pre-onboarding-frontend로 생성 [✅]과제 제출은 참가 신청시 수행한 과제의 레파지토리의 주소를 제출 [✅]과제의 소스코드는 본인의 GitHub 레파지토리에 Public [✅]레파지토리를 들어갔을 때 바로 소스코드가 보이도록 []git clone 후, npm install & npm start 명령어를 통해서 바로 정상동작이 가능하게 ? README.md 작성 [✅]프로젝트의 실행 방법 ## 실행 방법 1. 레포지토리를 클론합니다. `git clone https://github.com/youngentry/wanted-pre-onboarding-frontend` 2. 패키지를 설치합니다. `npm install` 3. npm start로 re..

*** useState 권장 사용 예시 Position = {x:1, y:1} const [position, setPosition] = useState({x:0,y:0}) *** Automatic Batching 함수 내에서 setCount를 세 번 실행하더라도 한 번에 실행된다. setCount(count+1); setCount(count+1); setCount(count+1); => count+1 한 번만 실행된 것과 같은 결과 원하는 결과를 얻기 위한 형태는 다음과 같다. setCount((prevCount) => preveCount+1); setCount((prevCount) => preveCount+1); setCount((prevCount) => preveCount+1); => prevCoun..

vite 써야하는 이유 vite로 init한 react는 매우 빠르게 빌드 가능 => 핫픽스에 유리함 => 현업에서도 쓰는 편이고 현재로써는 특별히 단점도 없음 *** virtualDOM 역할 브라우저 화면에 직접적으로 반영하기 전에 업데이트를 최적화하여 사용자 경험 개선 모든 event(onClick같은)는 root로 할당되어 host root가 처리 *** react 18에서는 업데이트에 우선순위를 부여 가능하도록 함 Fiber/work 리액트 렌더링/업데이트의 가장 작은 단위(JSX 엘리먼트 하나하나가 FIBER) 효율적인 업데이트를 위해 work를 중지, 다시시작, 제거를 더욱 기능적으로 할 수 있게 되었음. ex) useTransition으로 현재 작업 중단 및 중요한 작업으로 전환 *** Re..