일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 |
Tags
- 리액트
- 실기
- 깃
- 슬라이드전환
- web
- 웹디실기
- 렛츠기릿자바스크립트
- Splunk
- JS
- JavaScript
- github
- HTML
- 생활코딩
- 정보처리기사
- jQuery
- 코드공유
- PROJECT
- Supabase
- 웹디자인기능사
- 비전공자
- 웹퍼블리셔
- 프론트엔드
- 연산자
- react
- 웹디자인기능사실기
- CSS
- 타입스크립트
- 자바스크립트
- git
- 코딩독학
Archives
- Today
- Total
목록suspense (1)
코딩하는라민

[React] React.lazy 코드 스플리팅으로 프로젝트 성능 개선하기 📌 React.lazy 함수를 사용하게 된 이유 리액트 프로젝트를 진행하면서 중간중간 Light House 를 이용해 성능 검사를 진행했다. 다른 점수는 항상 90점 이상으로 나왔는데 '성능' 점수만 항상 주황색으로 60~70점 정도가 나왔다. 이 6, 70점도 잘나온 편이었고 정말 성능이 좋지 않은 페이지의 경우에는 4, 50점대까지 나왔다. 성능 최적화는 코드를 작성하고 나서 수행해야 하기 때문에 일단 프로젝트에 집중했고, 추가적으로 성능 개선을 진행하였다. 📌 React.lazy 함수란? React.lazy() 는 동적으로 코드를 로드하고 렌더링할 수 있게 해주는 React의 기능 중 하나이다. 이 기능을 사용하면 일반적인 ..
Core/React
2023. 4. 18. 10:30