요청 처리 중입니다...

1. [React] 렌더링 속도 및 성능 개선 [구조분해할당]

2022-07-08 15:35:58

리액트를 하다보면 생각 외로 불편한 구석이 많다. 예를 들면 this.state와 this.props 호출은 필수적으로 호출되어야 하는데 매번 호출 시 마다 선언해야한다.

다만 ES6에서 "구조분해할당[Destructuring assignment]"이 나옴으로써 보다 효과적인 랜더링 속도를 낼 수 있게 되었다. 먼저 밑에 예시를 보자. export class extends Component { constructor(props) { super(props); this.state = { varA: 1, varB: 2, varC: 3, } } 간단한 예로 3개의 state가 있다고 하자.

구조분해할당을 사용하지 않은 간단한 숫자비교문을 보면 아래와 같다 // varA가 varB보다 작을경우 varA // 반대로 클경우 varC fnNumCompare(){ return this.state.varA < this.state.varB ? this.state.varA : this.state.varC...

# ES6 # react # 구조분해할당 # 렌더링속도 # 성능개선 # 속도개선 # 클린코드

원문 링크 : 1. [React] 렌더링 속도 및 성능 개선 [구조분해할당]

등록된 다른 글

남포동 맛집, 남포역과 자갈치역 사이에 고즈넉이 자리 잡고 있는 원조 바다집, 수중전골 후기

[제주도 애월 카페] 케이크와 분위기가 좋은 카페 마마롱

[부산 부산항 축제] 부산역에서 친수공원까지 걸어서 5분!! 북항 친수공원과 함께하는 부산항 축제

[서울 종로] 데이트하기 좋은 신상 이색 카페 "스타벅스 광장시장점"

[제주 여행] 보말칼국수와 해물라면으로 유명한 협재 맛집, 협재해물라면오빠네

[경상남도 사천시 숙소] 비토섬 인근에 이 가격에.. 이런 펜션이라니 갓성비, 비우고 채우는 비채펜션