[Java] 동기/비동기

목표 : 동기/비동기의 개념과 JS에서의 사용법을 학습

동기/비동기

  • 동기(Synchronous) 처리
    동기 처리는 태스크(작업)를 순차적으로 실행하는 방식
    한 작업이 완료될 때까지 다음 작업은 대기
    • 장점 : 간단하고 직관적인 코드 흐름
    • 단점 : 한 작업이 오래 걸리면 전체 프로그램이 지연될 수 있음
  • 비동기(Asynchronous) 처리
    비동기 처리는 여러 태스크를 동시에 처리할 수 있는 방식
    한 작업이 시작되면 그 작업이 끝나기를 기다리지 않고 다음 작업을 시작
    • 장점 : 시간이 오래 걸리는 작업을 효율적으로 처리
    • 단점 : 코드의 복잡성이 증가할 수 있음

직렬: 순차 / 병렬 : 동시

  • 동기 + 직렬 (한 명씩, 기다림)
    - 손님 A 주문 → 셰프가 A 요리 완성할 때까지 기다림 → 손님 B 주문 처리 시작 → 손님 C.
    - 결과: 한 주문이 끝나야 다음 주문이 시작되므로 전체 시간이 길다.
  • 비동기 + 직렬 (요청은 비동기, 처리 순서는 유지)
    손님 A가 주문을 내보내고 서버는 다른 손님 주문을 받음(비동기 요청 수용).
    내부적으로는 셰프가 A→B→C 순서대로 만듦(직렬 처리).
    - 결과: 주문 접수는 막힘 없이 빠르지만 실제 조리 대기는 직렬로 이어져 전체 지연은 남는다.
  • 비동기 + 병렬 (현실적인 빠른 방식)
    - 손님들이 주문을 내보내면(비동기), 레인지 3개가 있어 3개의 요리를 동시에 조리(병렬)한다. 완료되면 각각 서빙 알림.
    - 결과: 총 소요 시간이 크게 줄어 응답성이 좋아짐. 다만 레인지 수나 재료 경쟁 같은 동기화 문제를 관리해야 한다.

 


1. 왜 Deferred, when, done을 사용하는가?
여러 개의 비동기 요청을 병렬로 처리하고, 모두 끝난 뒤에 하나의 콜백을 실행하기 위해

둘 다 언제 응답이 올지 모르는 비동기 처리이기 때문에
두 요청이 모두 끝난 후에 화면 렌더링을 해야 한다.

  • 원하는 로직
    • 요청1 and 요청2 모두 끝났는지 체크 → 둘 다 끝난 시점에 render 실행

그래서 jQuery Deferred + $.when + done() 을 이용한 것

2. Promise가 나오기 전에는
jQuery Deferred가 표준적인 비동기 패턴이었다

  • 현대 JS에서는 Promise.all()로 할 일을 예전에는:
    • $.Deferred()로 비동기 제어
    • $.when()으로 여러 비동기 병렬 관리
    • .done()로 후처리

3. callback 중첩을 피하기 위해
Deferred는 이를 평면 구조로 단순화

  • 전체 흐름
    • 1. issueId 존재 체크
    • 2. 두 가지 비동기 요청을 병렬로 시작
      - issue detail 조회
      - issue relation 조회
    • 3. $.when() 이 두 요청이 모두 resolve 될 때까지 기다림
    • 4. .done() 내부에서 화면 렌더링 처리
    • 5. 첨부 이미지 처리 + highlight.js 적용

이러한 비동기 요청을 Defferred 로 감싼다
이 패턴은 콜백 기반 비동기 함수 
Deferred 기반 비동기 객체 로 변환하는 래핑(wrapping)이다
이렇게 해야 $.when()  끝난 시점 을 감시할 수 있다.

$.when( deferred1, deferred2 
).done(function (issueDetail, relatedIssueList) {
  • 동작 방식
    • 1.Deferred1이 resolve될 때까지 기다림
    • 2.Deferred2도 resolve될 때까지 기다림
    • 3.둘 다 완료되면 done() 실행
    • 4.done() 인자에는 각 Deferred의 resolve() 값이 들어감
      → 콜백 파라미터로 전달됨 (이 로직 자체가 Promise.all() 과 동일한 방식)
  • done()에서 실제 데이터 가공 및 렌더링
    • 비동기 처리 결과를 UI에 반영하는 곳
    • 비동기 요청이 끝나기 전에 렌더링하면 데이터가 비어있으므로
    • 완료 후 실행을 보장하는 done()이 필수

이 코드는 jQuery의 Deferred / when / done 을 사용하여
여러 비동기 요청을 병렬로 처리하고, 모두 완료된 후 UI 렌더링을 수행하는 패턴

원래 콜백 기반 함수를 Deferred로 감싸 $.when()으로 처리
$.when()은 모든 비동기 작업이 완료되었을 때 done() 콜백이 실행

when()은 비동기 작업을 병렬로 등록하는 단계
done()은 등록된 비동기작업이 모두 끝나면 실행되는 비동기 콜백
하지만 done() 내부 코드 자체는 동기적으로 실행된다
(즉, 콜백 안에서는 한 줄씩 순차 실행됨)

이를 통해 콜백 중첩을 피하고
데이터 조회 완료 후 UI 반영을 안정적으로 처리할 수 있다