오늘도 나는
article thumbnail
[web] EventLoop Task Queue
WEB 2021. 7. 1. 23:27

이번에는 Task Queue에 대해 알아보자. Task Queue는 Call Stack과 마찬가지로 자료구조중 하나이며 Call Stack과 반대로 FIFO(First In First Out)구조를 갖는다. 즉 제일 먼저 들어오는 아이가 제일 먼저 나가게된다. 위 그림을 보면 DOM API, setInterval, setTimeout 등 이런 Web APIs들을 통해서 이벤트를 호출할 때 콜백을 등록하게되는데 그 등록된 콜백이 Task Queue 안에 들어오게된다. Task Queue에 들어온 콜백은 이벤트 루프가 계속 돌다가 Call Stack에 공간이 다 비워지고 자바스크립트 엔진이 일을 하지않는 그 때 Task Queue안에 있는 콜백을 한번에 하나씩 Call Stack으로 가져오게된다. 다만 Ca..

article thumbnail
[web] Event Loop Call Stack
WEB 2021. 6. 30. 23:35

먼저 자바는 멀티쓰레드 기반의 언어이다. 여기서 멀티쓰레드란 말 그대로 하나의 프로세스를 위해 일하는 여러개의 쓰레드가 동시다발적으로 일을 하여 효율적인 프로그래밍을 가능하도록 해준다. 다만 내가 지금 쓰고있는 자바스크립트는 싱글 스레드 기반의 언어이다. 싱글 스레드면 동시다발적으로 일을 할 수없는데 브라우저 웹에서 동작하는 방식을보면 비동기적으로 여러 일들이 동시에 수행하는걸 볼 수 있다. 그 이유는 자바스크립트 런타임환경인 브라우저 위에서 자바스크립트 소스코드를 받으면 자바스크립트 엔진이 소스코드를 순차적으로 읽게된다. 여기서 큰 그림으로 정리해보자면 사용자의 정보와 같은 데이터를 저장하는 공간인 Memory Heap 함수를 호출하고 불러오는 즉 함수의 동작 순서를 기억하는 공간인 Call Stack..

article thumbnail
[web] SSR(Server Side Rendering) vs CSR(Client Side Rendering)
WEB 2021. 4. 12. 23:51

SPA와 MPA SPA(Single Page Application) 하나의 HTML파일을 기반으로 화면을 자바스크립트를 이용하여 컨텐츠를 동적으로 변화하는 웹 어플리케이션 방식이다. MPA(Multiple Page Appliecation) 사용자가 페이지를 요청할 때마다, 웹 서버가 요청한 UI와 요청한 데이터를 HTML파일로 파싱해서 보여주는 웹 어플리케이션 방식이다. 여기서 일반적인 전통방식으로 접근하면 SPA의 렌더링 방식은 CSR에 속하고 MPA의 렌더링 방식은 SSR에 속하게 된다. CSR(Client Side Rendering) CSR(Client Side Rendering) 브라우저가 서버에 HTML과 JS를 요청한 후 요청파일이 모두 로드가 되면 사용자의 상호작용에 따라 동적으로 렌더링한다..

검색 태그