JavaFX로 JavaScript 동작 이해하기

오류 공장장·2024년 12월 8일

2024년 11월부터

목록 보기
4/8

이벤트 기반 동작하는 두 Java..?

GUI를 다루는 JavaFX와
브라우저에서 동작하는 JavaScript 엔진을 살펴보고 나서
Node.js의 동작 과정도 이해해보자.

간단하게 바라보자

싱글 쓰레드만 고려해보자

JavaFX

  1. 버튼 클릭과 같은 이벤트가 발생하면 큐에 순차적으로 저장된다.
  2. 이벤트 루프가 큐에서 차례로 이벤트 핸들러를 활용하여 이벤트를 처리한다.

JavaScript

  1. DOM 작업과 같은 이벤트가 발생하면 누군가에게 작업을 맡기고,
    작업의 결과를 큐에 순차적으로 저장한다.
  2. 이벤트 루프가 콜 스택이 비어있는지 확인하고,
    비어있다면 큐에 있는 작업의 결과를 콜 스택에서 처리한다.

좀 더 들여다보자

멀티 쓰레드도 고려해보자

JavaFX

멀티 쓰레드로 작업을 처리할 수 있다.
GUI 공유 자원 접근 문제로 UI 표현은 싱글 쓰레드만이 담당한다.
멀티 쓰레드의 작업의 결과를 큐에 삽입한다.
삽입된 큐를 처리하는 과정은 위와 같다.

JavaScript

엔진 밖에 있는 별도의 쓰레드로 비동기 작업을 수행한다.
작업의 결과를 싱글 쓰레드로 처리해야 하기 때문에
처리된 작업 결과를 큐에 삽입한다.
삽입된 큐를 처리하는 과정은 위와 같다.

표현을 정리해보자

JavaFX

이벤트 발생 시 큐에 이벤트를 삽입한다.
비동기 백그라운드 쓰레드들로 발생한 이벤트는 Platform.runLater()를 통해 큐에 저장된다.
이벤트 루프를 통해 순차적으로 이벤트 핸들러를 실행하여 큐에 저장된 이벤트를 처리한다.

JavaScript

동기적으로 콜 스택을 처리한다.
비동기 IO 작업이 발생하면 자바스크립트 엔진 밖에 있는 web API들에 작업을 맡긴다.
작업의 결과, 콜백 함수는 큐에 삽입되고
콜 스택이 비어있다면 이벤트 루프가 큐에 저장된 콜백 함수를 콜 스택에서 실행하도록 한다.

Node.js

비동기 IO 작업이 발생하면 백그라운드 쓰레드 풀에 작업을 맡긴다.
작업을 마치면 그 결과를 큐에 저장한다.
콜 스택이 비어있다면 이벤트 루프가 큐에 저장된 콜백 함수를 콜 스택에서 실행하도록 한다.

이때의 백그라운드 쓰레드 풀은 libuv 라이브러리를 통해 다루어진다.
비동기 IO 작업에 특화되어있다.


JavaFX를 다루면서 JavaScript 동작 과정도 이해할 수 있을 것 같아서
정리했는데 잘못된 내용 알려주시면 감사하겠습니다! :)

profile
오류 그만 만들자!

0개의 댓글