WEB | 동기 & 비동기

바다·2023년 6월 19일
0

WEB

목록 보기
10/10
post-thumbnail

동기 & 비동기

데이터를 받는 방식에는 "동기"방식과 "비동기"방식이 있다. 수업을 들을 때 들어보긴 했지만, 정확히 어떤 개념인지 알지 못하는 동기와 비동기를 정리해보고자 한다 :)

동기(Synchronous)

Synchronous : 동시에 발생하는
요청을 하면 (바로) 응답을 받는다는 의미

  • 한 자원에 대해 동시에 접근하는 것을 제한하는 방식이다.
  • 요청을 하면, 요청한 자리에서 결과가 주어져야 한다.
  • 요청과 응답이 동시에! 일어난다.
  • 직렬적으로 task를 수행(순차처리)한다.
    (현재 작업의 응답이 끝남과 동시에 다음 작업이 요청된다.)

동기 방식의 장점

  • 동기 방식은 비동기 방식보다 코드를 작성하고 이해하는 것이 쉽다.
  • 요청과 응답이 순차적으로 이루어지기 때문에 코드의 간결성과 직관성을 유지할 수 있다.
  • 동기 방식은 요청을 보낸 후에 응답을 받아야 다음 작업을 수행하기 때문에 요청과 응답의 순서를 보장할 수 있다.
    (A, B의 요청을 보냈으면, A의 응답이 도착한 후 B의 응답이 도착한다.)
  • 요청과 응답이 연결되어 있기 때문에, 에러가 발생했을 때 에러에 대한 처리가 쉬울 수 있다.

동기 방식의 단점

  • 설계가 간단하고 직관적이지만, 결과를 받을 때까지 다른 작업을 하지 못하고 대기해야 한다.
  • 전체 페이지를 다시 로딩하여 서버와의 통신량이 맣아지고, 자원과 시간이 낭비될 수 있어 웹페이지의 속도와 성능이 저하될 수 있다.

동기 방식의 예시

  • 일반적으로 사용하는 함수들은 대부분 동기방식으로 구현
  • form 제출
  • 웹페이지의 전체적인 구조나 디자인이 변경되는 경우

비동기(Asynchronous)

Asynchronous : 동시에 존재(발생)하지 않는
요청과 결과가 동시에 일어나지 않을 것이라는 의미

  • 한 자원에 대해 동시에 접근이 가능하다.
  • 병렬적으로 task를 수행한다.
  • task가 종료되지 않은 상태이더라도, 대기하지 않고 다음 task를 진행한다.
  • 서버에 데이터를 요청한 후 서버로부터 데이터가 응답될 때까지 기다리지 않고 즉시 다음 task를 수행한다.
  • 두 주체가 서로의 시작이나 종료 시간에 관계없이 별도의 시작, 종료 시간을 가지고 있다.

비동기 방식의 장점

  • 결과가 주어지는데 시간이 걸리더라도, 다른 작업을 할 수 있기 때문에 자원을 효율적으로 사용할 수 있다.
  • 전체 페이지를 다시 로딩하지 않고 필요한 부분만 업데이트하기 때문에 웹페이지의 속도와 성능을 향상시킬 수 있다.
  • 서버와의 통신량이 줄어들고, 자원과 시간을 절약할 수 있다.

비동기 방식의 단점

  • 동기 방식보다 코드를 작성하고 이해하는 것이 어렵다.
  • 요청과 응답의 순서를 보장할 수 없다.
    각 요청의 요청 시각과 응답 시각이 다르기 때문에, 요청의 처리 속도에 따라 응답이 뒤죽박죽 섞일 수 있다.
  • 요청과 응답이 분리되어 있기 때문에, 에러가 발생했을 때 어떤 요청에서 에러가 발생했는지 파악하고 처리하는 것이 동기 방식에 비해 쉽지 않다.

비동기 방식의 예시

  • 웹의 비동기 처리 기술 - Ajax
  • 웹페이지의 일부분만 자주 바뀌는 경우

결론

출처 : https://inpa.tistory.com/entry/WEB-%F0%9F%8C%90-%EB%B9%84%EB%8F%99%EA%B8%B0Async%ED%86%B5%EC%8B%A0-%EB%8F%99%EA%B8%B0Sync%ED%86%B5%EC%8B%A0#recentComments

profile
ᴘʜɪʟɪᴘᴘɪᴀɴs 3:14

0개의 댓글