본문 바로가기
728x90
반응형

리액트 렌더링2

[React] 웹 렌더링 방식(CSR, SSR, SSG) 📌 웹 렌더링 이란?웹 렌더링은 서버에서 받은 데이터를 브라우저 화면에 표시하는 과정입니다.즉, 사용자가 웹사이트를 볼 수 있도록 페이지를 그리는 과정을 의미합니다.렌더링 방식에 따라 웹 페이지의로딩 속도, 검색 엔진 최적화(SEO), 사용자 경험(UX)이 달라질 수 있습니다. React는 기본적으로 CSR(클라이언트 사이드 렌더링) 방식을 사용하지만,여러 가지 렌더링 방법이 있으며 각 방법마다 장단점이 있습니다.🔎 렌더링 방식 비교 CSR (클라이언트 사이드 렌더링) 초기 로딩 시 서버에서 빈 HTML과 JavaScript 파일을 받아오고,  브라우저에서 JavaScript가 실행되어 콘텐츠를 동적으로 생성장점 : 페이지 전환이 빠르고 사용자 경험이 부드럽습니다.단점 : 초기 로딩 속도가 느리고 S.. 2024. 10. 2.
[React] 리액트 JSX(TSX) 문법 ❓리액트(React)리액트는 프론트엔드 개발을 위한 Javascript의 오픈소스 라이브러리이다. HTML, Javascript만으로도 충분히 웹을 만들 수 있는데 왜 리액트를 사용하는걸까?JavaScript에서는 DOM 을 변형시키기 위하여브라우저의 DOM Selector API를 사용해서 특정 DOM 을 선택한 뒤,특정 이벤트가 발생하면 변화를 주도록 설정해야했다. 이를 이용하여 프로젝트를 진행했을 때 규모가 커질 수록 Dom Selector를 많이 쓰게 되고,그러한 코드가 쌓여갈 수록 매우 지저분하다는 생각이 들었다.사실 하나씩 불러오는 것도 매우 귀찮았다. 사용자와 인터랙션이 자주 발생하여 동적으로 UI를 구현해야 한다면관리하기도 힘들고, 규모가 커질 수록 성능 저하의 원인이 될 수도 있는 문제가.. 2024. 8. 17.
728x90
반응형