-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
1 changed file
with
75 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,75 @@ | ||
# 타임라인 격리하기 | ||
|
||
## 타임라인 다이어그램 기본 규칙 | ||
|
||
1. 두 액션이 순서대로 나타나면 같은 타임라인 | ||
2. 두 액션이 동시에 실행되거나 순서를 예상할 수 없다면 분리된 타임라인 | ||
|
||
## 액션 순서에 관한 두 가지 사실 | ||
|
||
1. ++와 +=는 사실 세 단계 | ||
|
||
* 읽기 | ||
* 더하기 | ||
* 쓰기 | ||
|
||
2. 인자는 함수를 부르기 전에 실행함 | ||
|
||
## 서로 다른 언어, 서로 다른 스레드 모델 | ||
|
||
* 단일 스레드, 동기 | ||
+ PHP는 기본적으로 멀티스레드를 사용할 수 없음 | ||
+ 모든 것이 순서대로 실행되고 입출력을 사용하면 끝날 때까지 기다려야 함 | ||
+ 시스템이 단순하다는 장점 | ||
|
||
* 단일 스레드, 비동기 | ||
+ 자바스크립트는 스레드가 하나 | ||
+ 입출력 작업을 위해 비동기 모델을 사용해야 함 | ||
|
||
* 멀티스레드 | ||
+ 실행 순서를 보장하지 않기 때문에 난이도가 높음 | ||
|
||
* 메시지 패싱 프로세스 | ||
+ 엘릭서나 얼랭 같은 언어는 서로 다른 프로세스를 동시에 실행할 수 있는 스레드 모델을 지원 | ||
+ 각 프로세스는 서로 메모리를 공유하지 않고 메시지로 통신 | ||
|
||
## 좋은 타임라인의 원칙 | ||
|
||
1. 타임라인은 적을수록 이해하기 쉬움 | ||
2. 타임라인을 짧을수록 이해하기 쉬움 | ||
3. 공유하는 자원이 적을수록 이해하기 쉬움 | ||
4. 자원을 공유한다면 서로 조율해야 함 | ||
5. 시간을 일급으로 다룸 | ||
|
||
## 자바스크립트의 단일 스레드 | ||
|
||
* 전역변수를 바꾸는 동기 액션은 타임라인이 서로 섞이지 않음 | ||
* 비동기 호출은 미래에 알 수 없는 시점에 런타임에 의해 실행 | ||
* 두 동기 액션은 동시에 실행되지 않음 | ||
|
||
## 자바스크립트의 비동기 큐 | ||
|
||
* 브라우저에서 동작하는 자바스크립트 엔진은 작업 큐라는 큐를 가지고 있음 | ||
* 작업 큐는 이벤트 루프에 의해 처리됨 | ||
+ 큐에서 작업 하나를 꺼내 실행하고 완료되면 다음 작업을 꺼내 실행하는 것을 무한히 반복 | ||
|
||
### 작업이 없을 때에는? | ||
|
||
* 이벤트 루프는 대기 상태로 들어가 전원을 아낌 | ||
+ 가비지 컬렉션 관리 작업을 하기도 하는데, 이는 브라우저에 따라 다름 | ||
|
||
## AJAX와 이벤트 큐 | ||
|
||
* AJAX는 브라우저에 기반을 둔 웹 요청을 말함 | ||
+ XML을 사용하진 않지만 용어에는 남아 있음 | ||
|
||
* 자바스크립트에서 AJAX 요청은 네트워크 엔진이 처리함 | ||
|
||
``` | ||
버튼 클릭 시 AJAX 요청을 보내는 예제에서는... | ||
1. 버튼 클릭 이벤트가 작업 큐에 추가됨 | ||
2. 이벤트 루프가 클릭 이벤트에 등록된 콜백을 실행 | ||
3. 콜백이 실행되면 요청 큐에 AJAX 요청을 추가 | ||
4. 응답이 오면 네트워크 엔진이 요청 큐에 있는 요청을 꺼내 처리 | ||
``` |