WebAssembly 실천: 코드 를 어떻게 쓰 는 지
개발 디 버 깅 환경 설정
컴 파일 도구 설치
생략 관 변 을 참고 하 다 Developer’s Guide 화해시키다 Advanced Tools, 설치 해 야 할 도 구 는 다음 과 같 습 니 다.
설치 과정 이 매우 번 거 로 우 니 로 컬 클론 코드 를 다시 컴 파일 해 야 합 니 다.
브 라 우 저 설치
신기 술 로 서 웹 어 셈 블 리 의 앞날 이 밝 은 이 유 는 W3C 가 전문 적 인 것 을 설립 했 기 때 문 만 은 아니다. Webassembly Community Group, 표준 승인;또한 이번 주류 브 라 우 저 업 체 들 이 규범 적 인 토론 에 공동으로 참여 하여 자신의 브 라 우 저 에서 이 루어 졌 기 때문이다.
신기 술 을 체험 하고 급진 적 인 브 라 우 저 를 사용 하 는 것 을 권장 합 니 다. 최신 버 전에 서 는 WebAssembly 가 지원 되 었 습 니 다.
chrome://flags/#enable-webassembly, 선택 enable 。 about:config 장차 javascript.options.wasm 으로 설정 true 。 웹 어 셈 블 리 빠 른 체험
WebAssembly 를 빨리 체험 하고 싶다 고요?가장 쉬 운 방법 은 웹 어 셈 블 리 를 지원 하 는 브 라 우 저 를 찾 아 콘 솔 을 열 고 다음 코드 를 붙 이 는 것 이다.
WebAssembly.compile(new Uint8Array(`
00 61 73 6d 01 00 00 00 01 0c 02 60 02 7f 7f 01
7f 60 01 7f 01 7f 03 03 02 00 01 07 10 02 03 61
64 64 00 00 06 73 71 75 61 72 65 00 01 0a 13 02
08 00 20 00 20 01 6a 0f 0b 08 00 20 00 20 00 6c
0f 0b`.trim().split(/[\s\r
]+/g).map(str => parseInt(str, 16))
)).then(module => {
const instance = new WebAssembly.Instance(module)
const { add, square } = instance.exports
console.log('2 + 4 =', add(2, 4))
console.log('3^2 =', square(3))
console.log('(2 + 5)^2 =', square(add(2 + 5)))
})안에 있 는 이 이상 한 숫자 는 바로 웹 어 셈 블 리 의 바 이 너 리 소스 코드 이다.
실행 결과
잘못 보고 하면 브 라 우 저가 WebAssembly 를 지원 하지 않 는 다 는 것 을 설명 합 니 다.오류 가 발생 하지 않 았 다 면 코드 의 실행 결 과 는 다음 과 같 습 니 다 (Promise 를 되 돌려 줍 니 다).
2 + 4 = 6
3^2 = 9
(2 + 5)^2 = 49그 속
add 화해시키다 square 비록 하 는 일 은 매우 간단 하지만 덧셈 과 제곱 을 계산 하 는 것 이다. 그러나 그것 은 웹 Assembly 가 컴 파일 한 인터페이스 이 고 억지로 바 이 너 리 로 쓴 것 이다!해석 코드
위의 바 이 너 리 소스 코드 는 한 줄 에 16 개의 수 이 고 4 줄 에 0 두 개가 있 으 며 모두 66 개의 수가 있다.각 수 는 8 자리 의 부호 없 는 16 진수 로 모두 66 바 이 트 를 차지한다.
WebAssembly 가 제 공 했 습 니 다. JS API
WebAssembly.compile wasm 의 바 이 너 리 소스 코드 를 컴 파일 할 수 있 습 니 다. BufferSource 형식의 인 자 를 받 아들 여 Promise 를 되 돌려 줍 니 다.코드 의 앞 줄 은 문자열 을 Array Buffer 로 바 꾸 는 것 이 목적 입 니 다.먼저 문자열 을 일반 배열 로 나 눈 다음 일반 배열 을 8 비트 기호 없 는 정수 로 바 꿉 니 다.안의 숫자 는 16 진법 으로 모두 사용 되 었 다.
parseInt(str, 16) 。 new Uint8Array(
`...`.trim().split(/[\s\r
]+/g).map(str => parseInt(str, 16))
)하면, 만약, 만약...
하면, 만약, 만약...
WebAssembly.compile 돌아 온 Promise fulfilled 라 고 말 했다. resolve 방법의 첫 번 째 매개 변 수 는 웹 Assembly 의 모듈 대상 입 니 다. WebAssembly.Module 실례그리고 사용
WebAssembly.Instance 모듈 대상 을 WebAssembly 인 스 턴 스 로 전환 합 니 다. (두 번 째 인 자 는 변 수 를 가 져 올 수 있 습 니 다.)통과 하 다.
instance.exports wasm 코드 출력 인 터 페 이 스 를 받 을 수 있 습 니 다. 나머지 코드 는 일반 자바 script 과 같 습 니 다.데이터 형식 주의
WebAssembly 는 명확 한 데이터 형식 이 있 습 니 다. 제 예 에서 사용 하 는 것 은 모두 32 비트 의 정수 입 니 다.
7f 나타내다 i32 명령 은 32 비트 정수) 를 의미 하기 때문에 웹 어 셈 블 리 로 컴 파일 할 때 데이터 형식 에 주의해 야 한다.데 이 터 를 함부로 전송 하면 웹 어 셈 블 리 프로그램 도 잘못 보고 하지 않 습 니 다. 실행 할 때 동적 변환
dynamic_cast 되 기 때문에 퍼 지 형식의 데이터 인용 을 지원 합 니 다.그러나 함수 에 문자열 이나 엄 청 난 숫자 를 보 내 면 구체 적 으로 무엇 으로 바 뀌 는 지 잘 모 르 겠 습 니 다. 보통 0 으로 바 뀝 니 다.console.log(square('Tom')) // 0
console.log(add(2e+66, 3e+66)) // 0
console.log(2e+66 + 3e+66) // 5e+66데이터 형식 에 대한 자세 한 정 보 를 알 고 싶 으 시 면: Data Types 를 참고 하 십시오.
C / C + + 를 WebAssembly 로 컴 파일 합 니 다.
온라인 C + + wasm 으로 전환 하 는 도구 가 있 습 니 다: WasmExplorer
바 이 너 리 코드 는 정말 사람 이 쓴 것 이 아니다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Thymeleaf 의 일반 양식 제출 과 AJAX 제출텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
