공삼
article thumbnail
Async, Await ( + Promise)
Front-End/JavaScript 2023. 8. 25. 00:07

Async Async, Await 모두 비동기 코드를 더 읽기 쉽고 동기적으로 작성할 수 있도록 도와주는 키워드이다. async 는 함수 선언 앞에 사용되며, 해당 함수가 비동기적으로 동작함을 나타낸다. async로 선언된 함수는 항상 프로미스를 반환한다. Await await은 async 함수 내에서 사용되며, 다른 프로미스를 기다렸다가 해당 프로미스가 처리되고 값을 반환한 후에 다음 코드로 진행된다. 이를통해 비동기 작업을 동기적으로 작성하는 것처럼 보이게 만들 수 있어서 코드의 가독성이 높아지고, 콜백지옥 문제를 피할 수 있다. function fetchData() { return new Promise((resolve) => { setTimeout(() => resolve("Data fetched"..

article thumbnail
SSR, CSR 차이 + SPA, MPA
Front-End/React 2023. 2. 15. 00:26

SSR (Server Side Rendering) 서버 사이드 랜더링은 서버로부터 완전하게 만들어진 html을 받아와 페이지를 렌더링하는 방식. CSR과의 차이점으로는 초기 로딩속도가 빠르지만, 새로운 요청이 있을때마다 페이지 전체를 다시 구성해야하는 단점이 있다. 장점으로는 SEO 검색엔진 최적화에 유리하다. 검색엔진이 웹을 크롤리하면서 페이지의 컨텐츠 색인을 생성하는 과정에서 유리하다. (SPA - Single Page Application -> 인터랙션이 발생할때마다 서버로부터 새로운 파일을 받아 해당 링크로 이동하여 페이지 전체를 새로 랜더링하는 웹페이지 구성방식 ) 왜 SEO 검색엔진 최적화에 유리할까? SSR은 서버에서 초기 페이지 로딩시 페이지의 내용을 렌더링 한 후 클라이언트에게 전달하기 ..