카카오 클라우드 스쿨 12월 9일 (데이터불변성), React Routing

최재유·2022년 12월 9일
0

불변성

  • React 에서는 props와 useState로 만든 데이터는 원본을 수정할 수 없습니다.

Routing

  • 요청 URL에 따라 분기를 해서 출력을 하는 것

SPA(Single Page Application)

1)Server Rendering

  • 웹 브라우저가 서버에게 요청을 전송하면 서버가 HTML을 전송해서 전체를 다시 출력하는 방식

  • 사용자와 인터럭션이 많은 웹 애플리케이션에서는 속도 측면에서 문제가 발생할 수 있음

2)SPA

  • 첫번째 요청을 전송했을 때 만 HTML이 전송되고 그 이후부터는 요청을 하면 서버가 JSON(XML 도 가능)형태의 데이터를 전송하고 브라우저가 이 데이터를 파싱해서 랜더링 하는 구조

  • 단점 : 앱의 규모가 커지면 자바스크립트 파일의 사이즈가 너무 커지게 되서 트래픽과 로딩속도에 문제가 발생할 수 있는데 이 문제를 해결하기 위해서는 Code Spiltting을 이용해서 해결

  • 브라우저에서 자바스크립트 코드를 관리하는 경우 크롤러가 페이지의 정보를 제대로 받아가지 못하는 현상이 발생해서 검색엔진에서 페이지의 정보를 검색 결과에 포함하지 못하는 경우가 발생

  • 처음 자바스크립트가 실행될 때 까지 페이지가 비어있기 때문에 빈 페이지가 잠시동안 보여질수 있음
    이런경우를 방지하기 위해서는 첫번째 페이지는 서버에서 랜더링을 해서 보여지고 다음페이지 부터 클라이언트 랜더링을 하는것이 좋습니다.

0개의 댓글