Design: 제안: Async/Await JS API

이 제안은 @fmccabe , @thibaudmichaud , @lukewagner 및 @kripken 과의 협력으로 개발되었으며 Stacks 하위 그룹의 피드백과 함께 개발되었습니다(오늘 0단계로 진행하는 것을 승인하는 비공식 투표 포함). 시간 제약으로 인해 계획은 매우 빠른(즉, 5분) 프레젠테이션을 하고 8월 3일에 1단계로 진행하기 위해 투표할 예정입니다. 이를 촉진하기 위해 사람들이 미리 여기에 우려 사항을 제기하여 프레젠테이션+투표를 더 많은 시간과 함께 나중에 날짜로 미룰 만한 주요 우려 사항이 있는지 결정할 수 있도록 강력히 권장합니다.

이 제안의 목적은 JavaScript Promise와 WebAssembly 간에 상대적으로 효율적이고 상대적으로 인체공학적인 상호 운용성을 제공하지만 핵심 wasm이 아닌 JS API에 대한 변경 사항만 있다는 제약 조건 하에서 작업하는 것입니다.
Stack-Switching 제안 이 결국 핵심 WebAssembly를 확장하여 이 제안에서 제공하는 작업을 WebAssembly 내에서 직접 구현하는 기능과 함께 다른 많은 가치 있는 스택 전환 작업을 수행할 것으로 기대합니다. 그러나 스택 전환에 대한 이 특정 사용 사례는 JS API를 통해 더 빠른 경로를 제공하기에 충분한 긴급성입니다.
자세한 내용 은 2021년 6월 28일 스택 하위 그룹 회의 의 노트와 슬라이드를 참조하십시오. 여기에서는 사용 시나리오와 고려한 요소를 자세히 설명하고 다음 설계에 도달한 근거를 요약합니다.

업데이트: Stacks Subgroup이 TC39로부터 받은 피드백에 따라 이 제안은 WebAssembly 스택 만 일시 중단하도록 허용합니다. JavaScript 언어를 변경하지 않으며 특히 분리된 asycn 대한 지원을 간접적으로 활성화하지 않습니다. 자바스크립트에서 await .

이것은 WebAssembly.Function 를 Function 의 하위 클래스로 소개하는 js-types 제안에 (느슨하게) 의존합니다.

상호 작용

제안은 다음과 같은 인터페이스, 생성자 및 메서드를 JS API에 추가하는 것입니다. 자세한 내용은 아래에서 설명합니다.

interface Suspender {
   constructor();
   Function suspendOnReturnedPromise(Function func); // import wrapper
   // overloaded: WebAssembly.Function suspendOnReturnedPromise(WebAssembly.Function func);
   WebAssembly.Function returnPromiseOnSuspend(WebAssembly.Function func); // export wrapper
}

예시

다음은 이 API를 사용하는 방법의 예입니다.
우리의 사용 시나리오에서 WebAssembly 모듈이 개념적으로 "동기" 및 "비동기" 가져오기 및 내보내기를 갖는 것을 고려하는 것이 유용하다는 것을 알았습니다.
현재 JS API는 "동기" 가져오기 및 내보내기만 지원합니다.
Suspender 인터페이스의 메서드는 "비동기"를 만들기 위해 관련 가져오기 및 내보내기를 래핑하는 데 사용되며 Suspender 개체 자체는 구현과 구성 가능성을 용이하게 하기 위해 이러한 가져오기 및 내보내기를 명시적으로 함께 연결합니다.

웹 어셈블리( demo.wasm ):

(module
    (import "js" "init_state" (func $init_state (result f64)))
    (import "js" "compute_delta" (func $compute_delta (result f64)))
    (global $state f64)
    (func $init (global.set $state (call $init_state)))
    (start $init)
    (func $get_state (export "get_state") (result f64) (global.get $state))
    (func $update_state (export "update_state") (result f64)
      (global.set (f64.add (global.get $state) (call $compute_delta)))
      (global.get $state)
    )
)

텍스트( data.txt ):

19827.987

자바스크립트:

var suspender = new Suspender();
var init_state = () => 2.71;
var compute_delta = () => fetch('data.txt').then(res => res.text()).then(txt => parseFloat(txt));
var importObj = {js: {
    init_state: init_state,
    compute_delta: suspender.suspendOnReturnedPromise(compute_delta)
}};

fetch('demo.wasm').then(response =>
    response.arrayBuffer()
).then(buffer =>
    WebAssembly.instantiate(buffer, importObj)
).then(({module, instance}) => {
    var get_state = instance.exports.get_state;
    var update_state = suspender.returnPromiseOnSuspend(instance.exports.update_state);
    ...
});

이 예제에는 매우 단순한 상태 머신인 WebAssembly 모듈이 있습니다. 상태를 업데이트할 때마다 상태에 추가할 델타를 계산하기 위해 가져오기를 호출하기만 하면 됩니다.
그러나 JavaScript 측에서는 델타를 계산하는 데 사용하려는 함수를 비동기식으로 실행해야 합니다. 즉, 숫자 자체가 아닌 숫자의 약속을 반환합니다.

우리는 새로운 JS API를 사용하여 이 동기화 간격을 메울 수 있습니다.
예제에서 WebAssembly 모듈의 가져오기는 suspender.suspendOnReturnedPromise 사용하여 래핑되고 내보내기는 suspender.returnPromiseOnSuspend 사용하여 래핑됩니다. 둘 다 동일한 suspender 합니다.
그 suspender 는 둘을 함께 연결합니다.
(래핑되지 않은) 가져오기가 Promise를 반환하는 경우 (래핑된) 내보내기가 Promise를 반환하도록 하며, 그 사이의 모든 계산은 가져오기의 Promise가 해결될 때까지 "일시 중단"됩니다.
내보내기 래핑은 기본적으로 async 마커를 추가하고 가져오기 래핑은 기본적으로 await 마커를 추가하지만 JavaScript와 달리 명시적으로 async 스레드할 필요가 없습니다 await 모든 중간 WebAssembly 기능을 통해!

한편, 초기화 중에 init_state 대한 호출은 반드시 일시 중단 없이 반환되고 내보내기 get_state 에 대한 호출도 항상 일시 중단 없이 반환되므로 제안서는 여전히 기존 "동기식" 가져오기 및 내보내기를 지원합니다. WebAssembly 생태계는 오늘날 사용합니다.
물론 동기 내보내기가 비동기 가져오기를 호출하는 경우 가져오기가 일시 중단되면 프로그램이 트랩된다는 사실과 같이 훑어보고 있는 많은 세부 사항이 있습니다.
다음은 보다 자세한 사양과 일부 구현 전략을 제공합니다.

사양

Suspender 는 다음 상태 중 하나입니다.

• 비활성 - 현재 사용되지 않음
• 활성 [ caller ] - 컨트롤은 Suspender 에 있으며 caller 는 Suspender 를 호출하고 externref 기대하는 함수입니다
• 일시 중단됨 - 현재 일부 약속이 해결되기를 기다리고 있습니다.

상기 방법은 suspender.returnPromiseOnSuspend(func) 주장 func A는 WebAssembly.Function 형태의 함수 유형 [ti*] -> [to] 후 리턴 WebAssembly.Function 와 함수 형식 [ti*] -> [externref] 인수와 함께 호출될 때 다음을 수행하는 args :

1. suspender 의 상태가 비활성 이 아닌 경우 트랩
2. suspender 의 상태를 활성 [ caller ]으로 변경합니다(여기서 caller 는 현재 호출자임).
3. result func(args) (또는 모든 트랩 또는 throw된 예외)를 호출한 결과로 설정합니다.
4. 주장 suspender 의 상태가 활성 인 [ caller' ]에 대한 몇 가지 caller' (보장되어야한다, 호출자가 변경되었을 수 있지만)
5. suspender 의 상태를 비활성으로 변경
6. result 를 caller' 반환(또는 다시 던짐)

방법 suspender.suspendOnReturnedPromise(func)

• func 가 WebAssembly.Function 인 경우 함수 유형이 [t*] -> [externref] 형식이라고 주장하고 [t*] -> [externref] 함수 유형을 가진 WebAssembly.Function 를 반환합니다. ;
• 그렇지 않으면 func 가 Function 라고 주장하고 Function 반환합니다.

두 경우 모두 suspender.suspendOnReturnedPromise(func) 반환된 함수는 args 인수와 함께 호출될 때 다음을 수행합니다.

1. result 가 func(args) (또는 모든 트랩 또는 throw된 예외)를 호출한 결과가 되도록 합니다.
2. result 가 반환된 Promise가 아니면 result 를 반환(또는 다시 던짐)합니다.
3. suspender 의 상태가 caller 대해 [ caller ] 활성 이 아닌 경우 트랩
4. 수 있습니다 frames 이후 스택 프레임 수 caller
5. frames 일시 중단할 수 없는 함수의 프레임이 있는 경우 트랩
6. suspender 의 상태를 Suspended로 변경
7. 다음을 수행하는 onFulfilled 및 onRejected 함수가 있는 result.then(onFulfilled, onRejected) 의 결과를 반환합니다.
   
   
   
   1. suspender 의 상태가 Suspended 임을 확인합니다(보장되어야 함).
   
   
   2. suspender 의 상태를 활성 [ caller' ]으로 변경합니다. 여기서 caller' 는 onFulfilled / onRejected 의 호출자입니다.
   
   
   3. 
      
      
      • 의 경우에는 onFulfilled 로 지정된 값을 변환 externref 되돌아 것과 frames
      
      
      
      • onRejected 의 경우 Exception Handling 제안의 JS API에 따라 최대 frames 까지 주어진 값을 예외로 던집니다.
      
      
      
   
   

다음과 같은 경우 기능이 일시 중단 가능합니다.

• WebAssembly 모듈에 의해 정의되며,
• suspendOnReturnedPromise 에서 반환 ,
• returnPromiseOnSuspend 에서 반환 ,
• 또는 일시 중단 가능한 기능에 대한 생성

중요한 것은 JavaScript로 작성된 함수는 TC39 멤버의 피드백을 준수하여 일시 중단할 수 없으며 , 호스트 기능(위에 나열된 몇 가지 제외)은 엔진 유지 관리자의 피드백을 준수하여 일시 중단할 수 없습니다 .

구현

다음은 이 제안에 대한 실행 전략입니다.
그것은 물론 주요 구현 과제가 있는 스택 스위칭에 대한 엔진 지원을 가정합니다.

스택에는 호스트(및 JavaScript) 스택과 WebAssembly 스택의 두 가지 종류가 있습니다. 모든 WebAssembly 스택에는 suspender 라는 서스펜더 필드가 있습니다. 모든 스레드에는 호스트 스택이 있습니다.

모든 Suspender 에는 두 개의 스택 참조 필드가 있습니다. 하나는 caller 이고 다른 하나는 suspended 입니다.

• 비활성 상태에서는 두 필드가 모두 null입니다.
• 활성 상태에서 caller 필드는 호출자의 (일시 중단된) 스택을 참조하고 suspended 필드는 null입니다.
• Suspended 상태에서 suspended 필드는 현재 suspender와 연결된 (suspended) WebAssembly 스택을 참조하고 caller 필드는 null입니다.

suspender.returnPromiseOnSuspend(func)(args) 는 다음에 의해 구현됩니다.

1. suspender.caller 및 suspended.suspended 가 null인지 확인(그렇지 않으면 트래핑)
2. stack 를 suspender 와 연결된 새로 할당된 WebAssembly 스택으로 설정
3. stack 전환하고 이전 스택을 suspender.caller
4. result 가 func(args) (또는 모든 트랩 또는 throw된 예외)의 결과가 되도록 합니다.
5. suspender.caller 전환하고 null로 설정
6. stack 해제
7. 반환(또는 다시 던짐) result

suspender.suspendOnReturnedPromise(func)(args) 는 다음에 의해 구현됩니다.

1. func(args) 호출 , 트랩 또는 throw된 예외 잡기
2. result 가 반환된 Promise가 아니면 result 반환(또는 다시 던짐)
3. suspender.caller 가 null이 아닌지 확인(그렇지 않으면 트래핑)
4. stack 현재 스택으로 둡니다.
5. stack 는 suspender 와 연결된 WebAssembly 스택이 아닙니다.
   
   
   
   • stack 가 WebAssembly 스택인지 확인(그렇지 않으면 트래핑)
   
   
   • stack 을 stack.suspender.caller
   
   
6. suspender.caller 전환하고 null로 설정하고 이전 스택을 suspender.suspended
7. onFulfilled 및 onRejected 함수가 구현된 result.then(onFulfilled, onRejected) 의 결과 반환
   
   
   
   1. suspender.suspended 전환하고 null로 설정하고 이전 스택을 suspender.caller
   
   
   2. 
      
      
      • onFulfilled 경우 주어진 값을 externref 로 변환하여 반환
      
      
      
      • onRejected 경우 주어진 값을 다시 던집니다.
      
      
      
   
   

일시 중단 가능한 함수에 대한 생성하여 생성된 함수의 구현은 먼저 현재 스레드의 호스트 스택(아직 있지 않은 경우)으로 전환하고 마지막으로 이전 스택으로 다시 전환하도록 변경됩니다.