이것저것 스터디📚 (107) 썸네일형 리스트형 DeepDive - 42장. 비동기 프로그래밍 42.1 동기 처리와 비동기 처리 - 자바스크립트에서 함수가 실행되려면 함수 실행 컨텍스트가 실행 컨텍스트 스택에 푸시되어야 한다. - 자바스크립트 엔진은 단 하나의 실행 컨텍스트 스택을 갖기 때문에, 동시에 2개 이상의 함수를 동시에 실행할 수 없다는 것을 의미한다. - 자바스크립트 엔진은 한 번에 하나의 테스크만 실행할 수 있는 싱글 스레드 방식으로 동작하는데, 싱글 스레드 방식은 한 번에 하나의 테스크만 실행할 수 있기 때문에 처리에 시간이 걸리는 테스크를 실행하는 경우 블로킹(작업 중단)이 발생한다. - 현재 실행 중인 테스크가 종료할 때까지 다음에 실행될 테스크가 대기하는 방식을 동기 처리라고 한다. // sleep 함수는 일정 시간(delay)이 경과한 이후에 콜백 함수(func)를 호출한다... DeepDive - 41장. 타이머 41.1 호출 스케줄링 - 호출 스케줄링 : 함수를 명시적으로 호출하지 않고 일정 시간이 경과된 이후에 호출되도록 타이머 함수를 사용하여 함수 호출을 예약하는 것. - 자바스크립트는 setTimeout과 setInterval 타이머 함수와 타이머를 제거할 수 있는 타이머 함수 clearTimeout과 clearInterval을 제공. - 타이머 함수는 ECMAScript 사양에 정의된 빌트인 함수가 아닌, 브라우저와 Node.js 환경에서 모두 전역 객체의 메서드로서 타이머 함수를 제공. - 즉, 타이머 함수는 호스트 객체이다. - 자바스크립트 엔진은 단 하나의 실행 컨텍스트 스택을 갖기 때문에 두 가지 이상의 태스크를 동시에 실행할 수 없다.(싱글 스레드) - 즉, 타이머 함수 setTimeout과 s.. HTTP 1.0과 HTTP 1.1의 차이 커넥션 유지(Persistent Connection) - HTTP 1.0과 HTTP 1.1의 가장 큰 차이점은 연결의 지속성이다 - HTTP는 기본적으로 TCP를 이용하여 통신하는데, HTTP 1.0은 TCP 세션을 유지하지 않고, HTTP 1.1은 TCP 세션을 유지한다는 큰 차이가 있다 - 즉, HTTP 1.0은 매번 데이터를 요청하고 수신할 때마다 TCP 세션을 맺지만, HTTP 1.1은 한 번의 TCP 세션에 여러 개의 요청을 보내고 응답을 수신할 수 있다 - HTTP 1.0은 Non-persistent HTTP, HTTP 1.1은 Persistent HTTP라고 할 수 있다 파이프라이닝(Pipelining) - HTTP 1.1은 HTTP 1.0과 달리 파이프라이닝 기능을 제공한다 - 파이프라이닝.. React 공식문서 -lazy - lazy를 사용하면 처음 렌더링될 때까지 컴포넌트 코드의 로딩을 지연시킬 수 있다. import { lazy } from 'react'; const MarkdownPreview = lazy(() => import('./MarkdownPreview.js')); - 컴포넌트 외부에서 lazy를 호출하여 지연 로드된 React 컴포넌트를 선언한다. 매개변수 * load - Promise 또는 다른 thenable(then 메서드를 가진 Promise와 유사한 객체)을 반환하는 함수이다. - React는 반환된 컴포넌트를 처음 렌더링하려고 시도할 때까지 load를 호출하지 않는다. - React는 load를 처음 호출한 후에는 resolve될 때까지 기다린 다음 resolve된 값을 React 컴포넌트로 렌.. React 공식문서 -<Suspense> - 를 사용하면 자식이 로딩을 완료할 때까지 폴백을 표시할 수 있다. Reference Props - children : 렌더링하려는 실제 UI이다. 렌더링하는 동안 children이 일시 중단되면 Suspense 경계가 fallback 렌더링으로 전환된다. - fallback : 로딩이 완료되지 않은 경우에 실제 UI 대신 렌더링할 대체 UI이다. 유효한 어떤 React 노드든 상관없다. - Suspense는 children이 일시 중단되면 자동으로 fallback으로 전환되고, 데이터가 다시 준비되면 다시 children으로 전환된다. - 렌더링 중에 fallback이 일시 중단되면 가장 가까운 상위 Suspense 경계가 활성화된다. -> "가장 가까운(부모) Suspense 경계를 활성화시킬 수 .. DeepDive - 40장. 이벤트 40.1 이벤트 드리븐 프로그래밍 - 이벤트 핸들러 : 이벤트가 발생했을 때 호출될 함수 - 이벤트 핸들러 등록 : 이벤트가 발생했을 때 브라우저에게 이벤트 핸들러의 호출을 위임하는 것 - 이벤트 드리븐 프로그래밍 : 프로그램의 흐름을 이벤트 중심으로 제어하는 프로그래밍 방식 40.2 이벤트 타입 - 이벤트 타입 : 이벤트의 종류를 나타내는 문자열(mdn : https://developer.mozilla.org/ko/docs/Web/API/Event) 40.3 이벤트 핸들러 등록 40.3.1 이벤트 핸들러 어트리뷰트 방식 Click me! - HTML 요소의 어트리뷰트 중에는 이벤트에 대응하는 이벤트 핸들러 어트리뷰트가 있다. - on 접두사와 이벤트의 종류를 나타내는 이벤트 타입으로 이루어져 있다.(e.. HTTP 프로토콜 HTTP(Hypertext Transfer Protocol) - 인터넷상에서 데이터를 주고 받기 위한 서버/클라이언트 모델을 따르는 프로토콜이다. - OSI 7계층의 애플리케이션 레벨의 프로토콜로 TCP/IP 위에서 작동한다. - HTML 문서, 이미지, 동영상, 오디오 등 어떤 종류의 데이터든지 전송할 수 있도록 설계되어 있다. - "링크기반으로 데이터에 접속하겠다"는 의미이다. 작동방식 - HTTP는 서버/클라이언트 모델을 따르는데, 클라이언트에서 요청을 보내면 서버에서 응답하는 형태이다. - 클라이언트는 URI를 이용해서 서버에 접속하고 데이터를 요청한다. - 웹서버는 보통 표준포트인 80번 포트로 서비스한다. Connectionless & Stateless - HTTP는 Connectionle.. 3-way handshake, 4-way handshake 3-way handshake - TCP는 장치들 사이에 논리적인 접속을 성립하기 위하여 3-way handshake를 사용한다. - 즉, 정확한 전송을 보장하기 위해 상대방 컴퓨터와 사전에 세션을 수립하는 과정을 의미한다. - TCP의 연결을 초기화 할 때 사용한다. * 3-way handshake 과정 1. 클라이언트는 서버에 접속을 요청하는 SYN 패킷을 보낸다. 클라이언트는 SYN/ACK 응답을 기다리는 SYN_SENT 상태, 서버는 Wait for Client 상태이다. 2. 서버는 SYN 요청을 받고 클라이언트에게 요청을 수락한다는 ACK와 SYN 플래그가 설정된 패킷을 발송한다. 서버는 SYN_RECEIVED 상태가 된다. 3. 클라이언트는 서버에게 ACK를 보내고 연결이 이루어진다. 서버는.. 이전 1 ··· 3 4 5 6 7 8 9 ··· 14 다음