Jake Seo
제이크서 개발 블로그
Jake Seo
전체 방문자
오늘
어제
  • 분류 전체보기 (719)
    • AI 서비스 개발 일기 (3)
    • LLM 개발 일기 (1)
    • ------레거시 (2025.08.23 이전)--.. (0)
    • 백준 문제풀이 (1)
    • 릿코드 문제풀이 (2)
    • 알고리즘 이론 (10)
      • 기본 이론 (2)
      • 배열과 문자열 (8)
    • 데이터베이스 (15)
      • Planet Scale (1)
      • MSSQL (9)
      • 디비 기본 개념 (1)
      • SQLite 직접 만들어보기 (4)
    • 보안 (7)
    • 설계 (1)
    • 네트워크 (17)
      • HTTP (9)
      • OSI Layers (5)
    • 회고 (31)
      • 연간 회고 (2)
      • 주간 회고 (29)
    • 인프라 (52)
      • 도커 (12)
      • AWS (9)
      • 용어 (21)
      • 웹 성능 (1)
      • 대규모 서비스를 지탱하는 기술 (9)
    • 깃 (7)
    • 빌드 도구 (7)
      • 메이븐 (6)
      • 그레이들 (0)
    • Java (135)
      • 이펙티브 자바 (73)
      • 자바 API (4)
      • 자바 잡지식 (30)
      • 자바 디자인 패턴 (21)
      • 톰캣 (Tomcat) (7)
    • 프레임워크 (64)
      • next.js (14)
      • 스프링 프레임워크 (28)
      • 토비의 스프링 (6)
      • 스프링 부트 (3)
      • JPA (Java Persistence API) (5)
      • Nest.js (8)
    • 프론트엔드 (48)
      • 다크모드 (1)
      • 노드 패키지 관리 매니저 (3)
      • CSS (19)
      • Web API (11)
      • tailwind-css (1)
      • React (5)
      • React 새 공식문서 요약 (1)
      • HTML (Markup Language) (5)
    • 자바스크립트 (108)
      • 모던 자바스크립트 (31)
      • 개념 (31)
      • 정규표현식 (5)
      • 코드 스니펫 (1)
      • 라이브러리 (6)
      • 인터뷰 (24)
      • 웹개발자를 위한 자바스크립트의 모든 것 (6)
      • 팁 (2)
    • Typescript (49)
    • 리눅스와 유닉스 (10)
    • Computer Science (1)
      • Compiler (1)
    • IDE (3)
      • VSCODE (1)
      • IntelliJ (2)
    • 세미나 & 컨퍼런스 (1)
    • 용어 (개발용어) (16)
      • 함수형 프로그래밍 용어들 (1)
    • ORM (2)
      • Prisma (2)
    • NODEJS (2)
    • cypress (1)
    • 리액트 네이티브 (React Native) (31)
    • 러스트 (Rust) (15)
    • 코틀린 (Kotlin) (4)
      • 자바에서 코틀린으로 (4)
    • 정규표현식 (3)
    • 구글 애널리틱스 (GA) (1)
    • SEO (2)
    • UML (2)
    • 맛탐험 (2)
    • 리팩토링 (1)
    • 서평 (2)
    • 소프트웨어 공학 (18)
      • 테스팅 (16)
      • 개발 프로세스 (1)
    • 교육학 (1)
    • 삶의 지혜, 통찰 (1)
    • Chat GPT (2)
    • 쉘스크립트 (1)
    • 컴파일 (2)
    • Dart (12)
    • 코드팩토리의 플러터 프로그래밍 (4)
    • 플러터 (17)
    • 안드로이드 스튜디오 (1)
    • 윈도우즈 (1)
    • 잡다한 백엔드 지식 (1)
    • 디자인 패턴 (1)

블로그 메뉴

  • 홈
  • 태그
  • 방명록

공지사항

인기 글

태그

  • 싱글톤
  • 자바스크립트
  • 도커공식문서
  • prerendering
  • 스프링 검증
  • 작업기억공간
  • MSSQL
  • rust
  • 이펙티브자바
  • item8
  • 싱글턴
  • 이펙티브 자바
  • 자바
  • 프로그래머의 뇌
  • NEXT JS
  • 자료구조
  • 외래키 제약조건
  • 플라이웨이트패턴
  • 자바 검증
  • 슬로우 쿼리
  • try-with-resources
  • 자바스크립트 면접
  • 참조 해제
  • 디자인패턴
  • 느린 쿼리
  • Javadoc 자바독 자바주석 주석 Comment
  • item9
  • 토비의 스프링
  • 서버리스 컴퓨팅
  • Java
  • 자바 디자인패턴
  • 메이븐 라이프사이클
  • 이펙티브 자바 item9
  • 싱글톤 패턴
  • 팩터리 메서드 패턴
  • serverless computing
  • 메이븐 페이즈
  • item7
  • bean Validation
  • 알고리즘
  • Pre-rendering
  • Next.js
  • pnpm
  • 빈 검증
  • 러스트
  • 추상 팩터리 패턴
  • next js app
  • 자바스크립트 인터뷰
  • 객체복사
  • 메이븐 골

최근 댓글

최근 글

티스토리

hELLO · Designed By 정상우.
Jake Seo

제이크서 개발 블로그

자바스크립트/개념

자바스크립트의 싱글 스레드 모델과 이벤트 루프

2024. 1. 4. 23:10

싱글 쓰레드 모델과 Event Loop

논블로킹과 Event Loop 에 대한 간단한 설명

  • Blocking 요청과 Non-Blocking 요청에 대한 처리가 다름
  • Non-Blocking 요청이 들어왔을 때는 이벤트 루프에 담아서 처리함
  • Blocking 요청일 때는 워커 스레드에게 맡김

자바스크립트의 싱글 스레드 모델

작동 방식

  • 싱글 스레드: 한 번에 하나의 연산을 단일 시퀀스로 처리함
  • 실행 컨텍스트: 자바스크립트 코드가 실행되면, "실행 컨텍스트 (Execution Context)" 에서 실행함. 실행 컨텍스트는 코드가 실행되는 순서를 처리함.
  • 호출 스택 (Call Stack): 실행 컨텍스트 관리를 위해 콜스택을 사용함. 콜스택은 프로그램에서 현재 위치를 기록하는 데이터 구조로 사용됨. 가장 최근에 호출된 함수가 가장 상위에 있음. 함수가 완료되면, 스택에서 제거되고 프로그램은 중단된 부분부터 실행함.

장점

  • 단순성: 교착 상태(Deadlock)나 경쟁 상태(Race Condition) 같은 복잡한 문제 처리가 필요 없음. 프로그래밍 모델을 단순화 가능.
    • 그래도 CPU 를 사용하는 작업은 여전히 이벤트 루프에서 실행되어 병목 현상이 발생할 수 있다.
    • 최신 버전의 Node.js 는 실험적 기능으로 작업자 스레드(Worker Threads) 라는 것을 도입하여 일정 수준의 멀티 스레딩을 허용한다. 이를 이용하면 자체적인 복잡성이 수반된다.
    • 또, Node.js 는 CPU 집약적인 작업을 처리하기 위해서 자식 프로세스를 생성할 수도 있다.
  • 일관성: 실행 순서의 일관성을 보장. 이는 웹앱의 UI 및 상태 관리에 중요함.

단점

  • 작업 차단: 한 번에 한가지 작업만 수행 가능해서 오래 걸리는 작업이 메인 스레드를 차단해 UI가 응답하지 않아 사용자 환경이 저하될 수 있음.

자바스크립트의 이벤트 루프

작동 방식

  • 논 블로킹 I/O: 자바스크립트는 싱글 스레드임에도 불구하고 non-blocking I/O 연산을 수행할 수 있음. 이는 자바스크립트가 비동기 콜백을 사용할 수 있게 해주는 이벤트 루프를 통해 이뤄짐.
  • 이벤트 루프 매커니즘: 이벤트 루프는 호출 스택이 비어있는지 지속적으로 확인함. 비어 있으면 메세지 큐에서 실행을 기다리는 보류 중인 콜백이 있는지 확인. 대기 중인 콜백이 있으면 콜백을 제거하여 호출 스택으로 푸시한 다음에 실행.

장점

  • 비동기 동작: 자바스크립트가 메인 스레드를 차단하지 않고, 웹 API 요청과 같은 긴 I/O 작업을 비동기적으로 수행할 수 있게 해줌.
  • 성능 향상: 이벤트 루프의 non-blocking 특성으로 인해 웹앱의 성능이 향상되고 UX 가 좋아진다.

단점

  • 디버깅의 복잡성: 비동기 코드는 비선형적인 실행 흐름을 가져 이해와 디버깅이 어려울 수 있다.
  • 콜백 지옥의 가능성: 콜백에 대한 의존도가 높으면 콜백 지옥을 겪을 수 있다.
저작자표시 비영리 (새창열림)

'자바스크립트 > 개념' 카테고리의 다른 글

History API 란? (간단 정리)  (0) 2024.02.14
이벤트 루프는 어떻게 non-blocking 연산을 막힘없이 처리하는가?  (0) 2024.01.04
자바스크립트에서 머신 코드 대신 바이트 코드를 사용하는 이유  (0) 2024.01.04
innerHTML vs innerAdajcentHTML() 비교  (0) 2023.07.15
자바스크립트 이벤트(Event) 객체와 커스텀 이벤트 (Custom Event) 란?  (0) 2023.07.07
    '자바스크립트/개념' 카테고리의 다른 글
    • History API 란? (간단 정리)
    • 이벤트 루프는 어떻게 non-blocking 연산을 막힘없이 처리하는가?
    • 자바스크립트에서 머신 코드 대신 바이트 코드를 사용하는 이유
    • innerHTML vs innerAdajcentHTML() 비교
    Jake Seo
    Jake Seo
    ✔ 댓글로 틀린 부분을 지적해주시면 기분 나빠하지 않고 수정합니다. ✔ 많은 퇴고를 거친 글이 좋은 글이 된다고 생각합니다. ✔ 간결하고 명료하게 사람들을 이해 시키는 것을 목표로 합니다.

    티스토리툴바