한빛출판네트워크

웹어셈블리는 웹 개발의 새로운 지평을 열게 될 잠재력 높은 기술로 주목받는다. 

<웹어셈블리 인 액션>은 웹어셈블리를 처음 접하는 개발자를 위한 입문서로, 자바스크립트에 의존하지 않고도 브라우저 기반의 고성능 애플리케이션을 만들 수 있는 방법을 알려준다.

네이티브 웹어셈블리 모듈을 작성하고, 자바스크립트 컴포넌트와 상호작용하고, 웹 워커와 pthread를 활용해 성능을 최대한 높이는 지식을 습득할 수 있다. 

필요한 함수와 특성, 기법을 쉽게 찾아볼 수 있도록 섹션을 깔끔하게 정리하는 방법도 배운다.

​

프런트엔드 개발의 핵심 기술로 자리매김 할 웹 어셈블리 기술을 미리 준비하면 어떨까?

​

물론 초보자를 위한 책이기는 하지만, 이 책은 HTML, Javascript 기술과 C/C++이 필요하고 C/C++의 경우 아주 기초적인 수준만 있으면 이해할 수 있다. 

​

주요 내용으로는 런타임에 다수의 모듈을 동적 링킹, 모듈과 자바스크립트 사이의 통신, 웹어셈블리 텍스트 포맷을 활용한 디버깅, 웹 워커와 pthread의 스레딩 기법을 다룬다. 

C/C++ 개발자 혹은 자바스크립트, 프런트엔드 개발자들에게 매우 적합하다. 

​

​

1부 웹어셈블리 들어가기는 웹어셈블리가 어떤 기술인지, 어떻게 작동하는지 설명하고, 앞으로 이 책에서 웹어셈블리 모듈을 컴파일할 때 사용할 엠스크립튼 툴킷의 사용법을 간략히 살펴본다. 

웹어셈블리란 무엇이고 이 기술로 어떤 문제를 해결할 수 있는지 알아보고, 사용 가능한 프로그래밍 언어에 대해서도 이야기한다. 이어서 웹어셈블리 모듈의 내부 구조를 들여다보고 각 섹션의 역할을 살펴보고, 웹어셈블리 모듈 컴파일 시 사용 가능한 엠스크립튼 툴킷의 다양한 출력 옵션과 웹어셈블리 자바스크립트 API를 소개한다.

​

2부 웹어셈블리 모듈에서는 웹어셈블리 모듈을 생성하고 웹 브라우저와 상호작용하는 프로세스를 이야기한다.

기존 C/C++ 코드베이스를 웹어셈블리 모듈로 컴파일하려면 어떻게 수정해야 하는지 안내한다. 웹페이지 자바스크립트와 모듈이 상호작용하는 원리도 설명한다.

그 뒤 웹어셈블리 모듈에서 웹페이지 자바스크립트를 호출하려면 4장 예제를 어떻게 수정해야 하는지 가이드한다.

한발 더 나아가 자바스크립트 함수 포인터를 웹어셈블리 모듈에 전달하는 방식으로 웹페이지 자바스크립트를 호출한다. 이렇게 하면 그때그때 함수를 자바스크립트로 지정하고 프라미스를 최대한 활용할 수 있다.

​

3부 웹어셈블리 활용를 통해 동적 링킹, 병렬 처리 등 고급 주제를 다룹니다. 브라우저가 아닌 환경에서 웹어셈블리를 사용하는 방법도 설명한다.

여러 웹어셈블리 모듈을 런타임에 링크하여 각자의 기능을 불러쓰는 동적 링킹 기법을 소개한다.

지금까지 익힌 내용을 심화하여 동일한 웹어셈블리 모듈의 인스턴스를 여럿 생성하고 필요할 때마다 각 인스턴스를 다른 웹어셈블리 모듈에 동적 링크하는 방법을 설명한다.

이후에는 웹 워커를 활용하여 웹어셈블리 모듈을 프리페치하는 방법과 웹어셈블리 모듈에서 pthread로 병렬 처리하는 방법을 배우고 웹어셈블리의 무대를 브라우저 밖으로 확장하여 Node.js 환경에서 웹어셈블리 모듈을 사용하는 방법을 설명한다.

​

4부 디버깅과 테스팅은 웹어셈블리 모듈의 오류를 미리 발견하고 조치하기 위한 디버깅과 테스팅 기법을 설명한다.

카드 짝 맞추기 게임 개발을 통해 웹어셈블리 텍스트 포맷에 대해 설명하고, 카드 짝 맞추기 게임을 확장하면서 웹어셈블리 모듈의 다양한 디버깅 방법을 이야기한다.

끝으로 웹어셈블리 모듈의 통합 테스트를 어떻게 작성하는지 살펴본다.



대표 사진 삭제

사진 설명을 입력하세요.

대표 사진 삭제

사진 설명을 입력하세요.

							#include <stdlib.h>#include <stdio.h>#include <emscripten.h>int IsPrime(int value){    if(value ==2){return 1;}    if(value <=1|| value %2==0){return 0;}    for(int i = 3; (i*i)<=value;i+=2){        if (value %i==0){return 0 ; }    }    return 1;}int main(){    int start = 3;    int end = 1000000;    printf("Prime numbers between %d and %d:
",start,end);    for (int i = start;i<=end;i+=2){        if(IsPrime(i)){            printf("%d",i);        }    }    printf("
");    return 0;}
						

대표 사진 삭제

사진 설명을 입력하세요.



안녕하세요, 괴짜 개발자 namedboy 입니다.

제가 오늘 리뷰할 책은 `웹어셈블리 인 액션` 입니다.  

이 글을 보시는 분은 웹 어셈블리에 대해 어느정도 알고 계신가요?

아마 들어보셨을 수도 있고 잘 모르시는 분들도 있을겁니다.

웹 어셈블리의 핵심은 C/C++, 러스트 등의 저수준 언어를 사용해서 만들어진 코드를 바이너리로 인코딩 하여 브라우저나 브라우저가 아닌 환경에서도 실행을 시킬 수 있다는 것입니다.

기존에 C/C++ 개발자도 Web Assembly를 사용해 기존에 개발해둔 코드를 가지고 기능을 개발하는 것이 가능하다는 얘기죠.  

`웹어셈블리 인 액션`에서는 여러 언어 중에 C/C++을 사용하여 웹 어셈블리 모듈로 변경하여 동작할 수 있는 방법에 대해 설명합니다.  

그 외에도 웹어셈블리를 다루기 위해 필요한 기초 지식과 함께 잘 모를 수 있는 어셈블리에 대한 내용을 앞서 설명해주고 있습니다.  

webassembly 공식 [사이트](https://webassembly.org/)에 보면 파이어폭스, 크롬, 사파리, 엣지에 모두 webassembly 가 포함되어 있다고 보여주는 만큼 앞으로 nodejs와 함께 웹에서 C/C++같은 언어를 사용해서 개발을 할 수 있고 빠른 실행이 장점인 만큼 웹에서 복잡한 연산을 해야 하는 경우에 대체하여 쓸 수 있는 하나의 수단이 될 수 있을거란 생각이 드네요.

특히 더 높은 수준의 성능을 계속해서 요하는 요즘 시대에 webassembly는 성능을 한단계 끌어올릴 수 있는 역할을 할 수 있지 않을까 생각합니다.  

물론 앞으로 갈길을 많다고 생각이 드는데 그 이유는 꽤 많은 부분 편의성이 좋아져야 개발자 입장에서 편하게 개발을 할 수 있기 때문입니다.  

추가로 걱정되는 부분은 지금까지도 webassembly가 크게 주목받지 못했던 이유로, 기존의 V8 엔진의 성능을 올리거나 개발하는 방식을 바꾸는 형태가 더 많은 도움이 되는 케이스가 많았던 듯 합니다.  

그럼에도 불구하고 webassembly는 충분히 매력적인 부분이 존재하고 있습니다. 브라우저에서 C/C++언어를 사용할 수 있다는 사실 자체가 흥미를 끌기도 합니다.  

이런 내용에 대해 전반적으로 짚어주고 자세하게 설명해준 `웹어셈블리 인 액션`은 [링크]에서 확인하실 수 있습니다.

*******  이 책의 특징

이 책은 웹어셈블리를 처음 접하는 분들을 위한 안내서에 가깝습니다. 소수 찾기, 카드 짝 맞추기 게임 등 예제를 가지고서 학습을 하게 됩니다.

예제는 아주 단순하고 명료합니다.

그리고 이 책에서는 웹어셈블리가 어떤 기술인지, 어떻게 작동하는지, 이 기술로 무엇을 할 수 있는지 알려줍니다.

다양한 요건에 따라 다양한 방법으로 웹어셈블리 모듈을 개발하는 과정에 대해서도 설명하고 있습니다.

이 책은 구성으로는 총 4개 부, 13개 장으로 구성되어 있습니다.

1부 : 웹어셈블리 들어가기 : 웹어셈블리가 어떤 기술인지, 어떻게 작동하는지 설명합니다. 그리고 이 책에서 웹어셈블리 모듈을 컴파일할 때 사용할 툴킷의 사용법을 간략하게 살펴보고 설명합니다.

 1장: 웹어셈블리란 무엇이고 이 기술을 이용하여 어떤 문제를 해결할 수 있는지 알아봅니다. 여기서 사용가능한 프로그래밍 언어에 대해서도 알려줍니다.

 2장: 웹어셈블리의 모듈의 내부 구조를 들여다볼 수 있습니다. 그리고 각각의 역할에 대해서 알게 됩니다.

 3장: 웹어셈블리 모듈 컴파일시에 사용 가능한 엠스크립튼 툴킷의 다양한 출력 옵션과 웹어셈브리 자바스크립트 API에 대해서 알게 됩니다.

2부 : 웹어셈블리 모듈 : 웹어셈블리 모듈을 생성해 보고 웹 브라우저와 상호 작용하는 프로세스에 대해서 설명합니다.

 4장: 기존 c/c++  코드베이스를 웹어셈블리 모듈로 컴파일하려면 어떻게 수정해야 하는지에 대해서 학습하고 이해할 수 있습니다.

 5장: 웹어셈블리 모듈에서 웹페이지 자바스크립트를 호출하려면 4장 예제를 어떻게 수정하고 사용할 수 있는지에 대해서 이야기하고 학습할 수 있습니다.

 6장: 자바스크립트 함수 포인터를 웹어셈블리 모듈에 전달하는 방식으로 웹페이지 자바스크립트를 호출하는 방법에 대해서 설명합니다.

3부 : 동적 링킹, 병렬 처리 등 고급 주제에 대해서 이야기하는 장입니다. 브라우저가 아닌 환경에서 웹어셈블리를 사용하는 방법에 대해서도 학습합니다.

 7장: 여러 웹어셈블리 모듈을 런타임에 링크하여 각자의 기능을 불러쓰는 동적 링킹 기법에 대해서 학습니다.

 8장: 7장의 내용을 심화하여 학습합니다. 동일한 웹어셈블리 모듈의 인스턴스를 여럿 생성하고 필요할 때마다 각 인스턴스를 다른 웹어셈블리 모듈에 동적 링크하는 방법에 대하여 설명하고 있습니다.

 9장: 웹 워커를 활용하여 웹어셈블리 모듈을 프리패치하는 방법과 웹어셈블리 모듈에서 병렬처리하는 방법에 대해서 설명하고 있습니다. 

 10장: 웹어셈블리의 무대를 브라우저 밖으로 확장하여 Node.js 환경에서 웹어셈블리 모듈을 사용하는 방법에 대하여 설명합니다.

4부 디버깅과 테스틍 : 웹어셈블리 모듈의 오류를 미리 발견하고 조치하기 위한 디버깅과 테스팅 기법을 설명하고 있습니다.

 11장: 카드 짝 맞추기 게임을 개발해 보면서 웹어셈블리 텍스트 포맷에 대해 설명하고 학습합니다.

 12장: 카드 짝 맞추기 게임을 확장합니다. 웹어셈블리 모듈의 다양한 디버깅 방법을 설명하고 학습니다.

 13장: 웹어셈블리 모듈의 통합테스트에 대해서 설명합니다. 그리고 어떻게 작성하고 활용하는 이해할 수 있습니다.

*******  이 책은 각 장과 각 절의 내용은 어느 정도 독립적이다.

이 책에 실린 예제 코드는 한빛미디어 홈페이지에서 내려받을 수 있다.

웹어셈블리 개발 환경을 처음부터 하나씩 직접 구현해 보려면 저자가 쓴 부록 A를, 미리 구성된 실습 환경을 도커 이미지로 내려받아 활용하려면 역자가 쓴 F를 참고하시면 됩니다.

====================================================================

 ‘본 포스팅은 한빛미디어에서 도서를 제공받아 직접 체험하고 작성한 솔직한 후기입니다.

 웹 개발자에게 가장 큰 화두는 성능이라고 생각하는데요. 웹 페이지가얼마나 빨리 로드되는지, 웹에 대해 전반적인 응답이 빠른지 등 성능 부분에 민감한 건 사실입니다. 또한, 제작사마다 구현방식이 다르므로 지원 대상 브라우저 마다 일일이테스트해서 작동여부를 확인해야 되는 경우들이 많습니다.

웹의 역사의 흐름을 바꿔줄 웹 어셈블리(Web Assembly)를소개합니다. WASM은 브라우저 안에서 코드를 실행하고 웹에서 자바스크립트 외에 다른 언어를 지원하면애플리케이션의 속도를 높이는 역할을 해주는 장점이 있습니다. 즉 툴 생태계도 발전하고 있으며, 브라우저 개발사인 애플, 구글, 마이크로소프트, 모질라가 웹 어셈블리를 지원하고 있습니다.

웹 어셈블리 인 액션 저서는 웹 어셈블리에 대한 자세한 내용을 1, 2부와3, 4부로 나누어져서 설명하고 있습니다. 기본적으로 핵심개념은1, 2부에서 설명하고 있으며 3, 4부는 주로 디버깅과고급주제로 이루어져 있습니다. 기본개념을 아시는 분들은 바로 3, 4부를읽는 것도 추천합니다. 특히 순서대로 책을 읽는 것을 권유하는데요. 그이유는 웹 어셈블리 기술을 이해하고 엠스크립튼 툴킷에 익숙해지기 위해서 1~3장을 차례대로 읽는 방법으로쉽고 빠르게 익힐 수 있습니다.

기본 핵심개념에서는 웹 어셈블리가 어떤 기술인지, 어떻게 작동하는지설명하고, 웹 어셈블리 모듈을 컴파일할 때 사용할 엠스크립튼 툴킷의 사용법을 제시하고 있습니다. 더 나아가 웹 어셈블리 모듈을 생성하고 웹 브라우저와 상호작용하는 프로세스에 대한 이야기합니다. 기존 C/C++ 코드 베이스를 웹 어셈블리 모듈로 컴파일하려면 어떻게수정해야 하는지, 웹 페이지 자바스크립트와 모듈이 상호작용하는 원리,웹 어셈블리 모듈에서 웹 페이지 자바스크립트를 등 가이드에 대한 내용이 있습니다.

웹 어셈블리 활용에서는 동적 링킹, 병렬 처리 등 고급 주제를 다루면서브라우저가 아닌 환경에서 웹 어셈블리를 사용하는 방법을 제시해줍니다. 마지막으로 디버깅과 테스팅으로모듈의 오류를 미리 발견하고 조지하기 위한 기법을 설명합니다. 카드 짝 맞추기 게임 개발을 통해 텍스트포맷, 모듈의 다양한 디버깅 방법, 모듈의 통합 테스트를어떻게 작성하는지까지 담고 있습니다.

웹 어셈블리는 웹 플랫폼에 있어서 상당한 큰 의의가 있는데요. 여러언어로 작성된 코드들을 네이티브로 가까운 속도로 웹에서 돌릴 수 있는 길을 제시합니다. 이전까지 웹에서돌려볼 수 없었던 클라이언트 앱들을 웹에서 진행할 수 있도록 도와주기 때문입니다.

웹 개발에서 웹 어셈블리, 자바스크립트는 서로 대체재가 아니라 함께공존하는 것입니다. 만약 웹사이트를 최대한 인터렉티브하게 만들고 싶다면 웹 어셈블리가 아니라 리액트, 자바스크립트가 필요한 것입니다. 자바스크립트가 웹을 화려하고, 인터랙티브하게 만드는 걸 잘하기 때문입니다. 하지만 자바스크립트는예를 들어서 이미지 프로세싱 같은 것은 못 합니다. 리얼타임, 빠른개선 같은 것들을 말입니다. 그런 경우에는 웹 어셈블리를 사용하는 것이 좋습니다.

웹의 미래는 브라우저 제작사들은 자바스크립트 성능 개선 방안을 모색하기 시작했으며, 파이어폭스 제작사인 모질라 재단은 asm.js라는 자바스크립트 서브셋을발표하기도 했습니다. (참고 https://developer.mozilla.org/ko/docs/WebAssembly) 또한, 웹 어셈블리로 만들어진 UI툴 fimga(https://www.figma.com) 사이트도 있습니다. 추후게임 설치 없이도 유니티 게임 등 다양한 게임을 을 이제 웹사이트로 컴파일하면 웹사이트는 해당 바이너리 파일을 이해할 수 있게 될 것이고 덕분에현재 크롬, 파이어폭스, 등에서 데모나 3d 시뮬레이션을 볼 수 있는 것입니다.

이 책은 C/C++코드로 자바스크립트로 변환하여 보조적으로 활용할 수 있는 웹 어셈블리에 다루고 있는 책이다.

책 내용은 생각보다 많이 깊다. 어떠한 방식으로 C/C++코드가 자바스크립트로 변환될 수 있는 지에 대한 내용이 앞부분에 놓여있다. 또한, 웹 동작 방식에 대한 기본적인 내용도 약간 소개 되어있다.

위와 같이 C/C++코드를 자바스크립트로 변환하기 위한 과정을 상세하게 설명해주고 있다. 하나는 HTML까지 같이 생성하는 것과, 자바스크립트로 변환해주는 것 까지 생성하는 것, 링크 과정을 직접 할 수 있게 중간 과정 코드까지 생성하는 것 까지 상세하게 설명한다.

위와 같이 C/C++코드를 작성하고 엠스크립튼을 사용하게 되면 자바스크립트로 변환할 수 있으며 이를 활용하여 네이티브 코드를 작성할 수 있을 뿐더러, 웹에서 동적인 행위를 하려면 무조건 자바스크립트를 활용할 필요 없이 C/C++를 보조적으로 활용할 수 있다.

이 책은 웹 어셈블리에 관심이 있거나, C/C++코드를 웹에 보조적으로 활용할 분들에게 유용하게 읽을 수 있을 것이다.

내가 요 책을 보면서 좋았던 점은 그냥 지나갈 수 있는 단어/키워드 들을 놓치지 않고 잘 설명해 준다는 점이었다.

JavaScript 만 했다면 C++에 대한 이해도가 낮을수 밖에 없는데 그 점을 감안해 적절하게 가르쳐주고 있다.

​

그리고 웹 어셈블리가 나오게 된 계기, 사용처, 미래 등을 이야기 해주고 있어

넓은 범위의 인사이트를 얻기에 무리 없다고 생각한다.

특히 좋았던 부분은 각 모듈들이 어떻게 결합이 되고, 어디서 어떻게 사용되는지 그림으로 잘 설명해 주었다는 점이다.

단순히 브라우저에서 이 코드를 실행시킨다 라고 끝내는 것이 아니라 브라우저에서 어떻게 파일을 가져오고

어떻게 처리하는지 등의 과정을 도식화 해서 이해하는데 큰 도움이 됐었다.

리뷰에 앞서 본 리뷰는 한빛 출판 네트워크에서 진행한 ‘나는 리뷰어다’ 이벤트에서 제공받은 책으로 진행한 것을 밝힙니다.

요즘뿐만이 아니라 수년전부터 웹 기술의 발전은 정말 빠르다는 것을 체감하며 살고 있다. 특히 HTML5로 넘어오고 난 후 더더욱이다. 

다양한 기술들이 Javascript에 접목되고, 웹 브라우저가 하나의 플랫폼으로써 여러가지 기능을 하는 것을 볼 때는 참 놀라웠는데,

웹어셈블리가 나오는 것을 보고, 이런 부분까지도 웹 기술에 접목이 드는 구나 하는 생각이 들었다.

이번에 리뷰를 한 "웹어셈블리 인 액션" 은, 막연히 이런 것도 있구나 라고 생각해오던 웹어셈블리에 대해, 

어떤 기술인지, 어떤 식으로 응용을 해 볼 수 있는 지 감을 잡을 수 있게 해주는 초보자를 위한 책이었다고 생각한다.

물론 초보자를 위한 책이기는 하지만, 이 책은 HTML, Javascript 기술과 C/C++에 대한 이해가 필요하다. 

C/C++의 경우 아주 기초적인 수준만 있으면 이해할 수 있다. Javascript 부분은 조금의 지식은 필요하다. HTML 역시 기초적인 수준 정도의 지식만 있으면 이 책을 이해할 수 있을 것이다. 

Manning 출판사의 "in Action" 시리즈가 대부분 그렇듯이, 이 책도 앞에서 이야기한 지식 정도만 있으면 하나씩 따라하면서 내용을 익히기에 무리가 없다. 내용을 아주 깊이 들어가지 않으면서도, 책에서 제시하는 예제를 이해할 정도의 내용에 대한 기반지식과 그림 그리고 코드 별 주석 등이 자세히 기술되어 있다. 

전체적인 구성은 웹어셈블리에 대한 최소한의 지식 및 이를 어떻게 구현하는 지에 설명 후 간단한 예제로 감을 잡고, 그리고 POS 예제를 이용해 좀 더 복잡한 상황에 대해 반복해서 실습을 한다. 그리고 나서 동적 링킹에 대해 다루며, 디버깅에 대해서 다루고 있다. 챕터 시작 및 예제마다 그림으로 어떤 내용을 어떻게 구현할 것이라는 것을 그림으로 알려주고 그에 대해 코드를 어떻게 구현하고 어떻게 컴파일을 하는지 하나하나 설명을 해 주고 있어, 어려움없이 전체 내용을 읽어나갈 수 있다. 하지만 독자에 따라서는 이 책이 어렵다고 느껴지는 분도 있을 수 있다. 이 책이 웹어셈블리라는 기술을 이용해 C/C++과 자바스크립트간 연동을 어떻게 할 수 있고 어떻게 디버깅을 해서 활용할 수 있다 설명하기 때문이다. 저자가 기본 지식에 대해 친절히 설명을 하고 있지만, 그럼에도 책의 내용이 이해가 되지 않는다면, 관련 백그라운드 지식을 먼저 공부하고 책을 보는 것도 좋을 것 같다. 개인적으로는 한빛미디어에서 출판되었던 백창우님 저 "유닉스 리눅스 프로그래밍"(지금은 절판되었다)이 이런 부분에 대한 설명이 잘 되어있다고 생각한다.

이 책의 단점은, 먼저 초보자를 위한 책이기 때문에, 복잡한 응용에 대한 예시를 제시하지는 않는다. 또 책에서 이런 부분에서 응용할 수 있다 라는 친절한 설명을 제시하지만, 독자에 따라서는 어떻게 응용해야 할 지 알 수 없기 때문에, 이 부분에 대해서는 다른 책들을 좀 더 살펴보아야 할 것이다. 그리고 책의 단점이라기 보다는 웹어셈블리가 성숙한 기술이 아니다보니 계속해서 바뀌는 부분이 있을 수 있어, 책에서 가이드한 것과 같이 예제를 따라서 수행해 볼 때 엠스크립튼 툴킷 버전을 잘 설정해서 시험을 해야 한다는 것도 불편한 점이다. 실제 프로젝트에 이를 시도해 보려면, 내가 사용하려는 툴킷이 지원하는 기능과 웹브라우저들이 어느정도 기능을 지원하는 지 등에 대해 꼼꼼한 체크가 필요할 것이다.

개발자의 숙명인지 모르겠지만, 현업에서 사용하는 기술에 대해서도 지속해서 새로운 기술 및 도메인 지식 익혀야 하고, 다른 분야의 지식도 꾸준히 따라잡기 위한 노력이 필요하다고 생각한다. 이러한 부분이 힘들다고 생각될 수도 있다. 하지만 서로 다른 방향이라 생각되었던 부분들을 연결하여 활용할 수 있는 기술이 생겨나서, 이를 익히고 어떻게하면 현업에 이러한 기술들을 응용해 볼 수 있을까 고민해 보는 것은 또 다른 재미라는 생각이 든다.

필자(리뷰자)는거의 지난 15년간을 시스템 펌웨어나 혹은 파일시스템, 그리고게임 관련해서 개발해왔었다. 그러다 좋은 기회가 생겨 웹용 서비스 지향 회사에 취업을 하여 지금은 웹개발자로 전향한 케이스이다.

처음 웹을 개발할 때는 모든 게 혼란스러웠다. 컴파일러가 없이 인터프리터형태로(지금은 형태가 좀 바뀌어 스크립트도 부분적으로 컴파일한 옵티 멀 코드를 가진 상태로 수행되는것으로 알고 있다.) 프론트가 동작하는 것이 신기했고, 무엇보다스크립트 언어가 구동하는 방식이 신기했다.

물론 블로거 역시 다수의 자바 스크립트 언어 관련 책 리뷰를 포스팅했었고, 그동안 CSS와 HTML에 관해 나름 개인 프로젝트와 그와 관련한 다양한알고리즘 테스트 서비스를 구축해본 경험이 있어 의기양양한 면도 있었다.

하지만! 실재 실무에서 쓰이는 스크립트 언어는 필자가 상상했던 것보다복잡하였고, 책에서 언급되지 않은 최신 기술들 그리고 다양한 기능들이 다루우고 있었다. 그렇기에 필자가 처음 접한 실무 업무 때의 느낌은. 필자에게 익숙한세상으로 돌아가고 싶은 깊은 향수, 그리고 바람이 전부였다고 해도 과언이 아닐 것 같다.

그런데 언제부터인가? 웹 어셈블리라는 개념이 등장했다. 이 개념은 간단히 말해 C/C++로 비교하자면, 직접 ASM 수준의 코딩을 하는 것을 의미한다. 하지만 웹의 경우, 이렇게 기계언어 단까지 프로그래머가 다룰 필요는없었나 보다. 웹은 이보다 윗단인 C/C++ 등을 웹 어셈블리로칭하고 있었다. 그렇기에 필자는 이번 리뷰를 매우 즐겁게 할 수 있었고, 이를 통해 웹의 한층 더 복잡한 작동 원리와 웹 어셈블러의 작동원리에 관해 파악할 수 있었다.

【어떤 독자를 위한 책인가】

'웹어셈블리 인 액션' 일단 기본적인 C/C++에 관한 어느 정도 수준의 이해력이 있어야하고, CS의 어느 정도의 기본적인 지식 역시 요하는 책이다. 위의이러한 기본기 없이 이 책을 접하기엔 어느 정도 진입장벽이 있으므로, CS 전반의 기초 지식이 부족한분들에겐 권하지 않는다.

만약 위에서 말한 기초 지식이 어느 정도 갖춘 사람이라는 조건이 완성되었을 때 본인의 웹서비스에 관해 좀 더빠른 서비스를 꿈꾸거나 혹은 C/C++의 스타일 코딩을 웹에 한번 섞어서 적용해보고 싶은 사람이라면위의 도서를 읽어보길 권한다. 읽어본다는 것은 정확한 표현은 아닌 것 같고 학습하길 권장한다.

솔직히 필자도 웹에 관한 전반에 걸친 지식에 공백인 부분이 좀 있어서 이 책을 읽으며 새롭게 배우고 깨달은 부분이없잖아 있었다. 그렇기에 꼭 서비스 최적화나 C/C++ 적용을위해서가 아니더라도 자바스크립트 코드와 어떻게 C/C++ 코드가 통신을 하는지, 이를 위해서 웹의 구조에 어떤 부분이 변경되었고 최신 웹 서비스의 구조는 어떠한지를 다시 한번 돌아보고자 하는사람들에게 이 책을 권한다.

【책의 구성】 '웹어셈블리 인 액션'의책의 구성은 어떠한가.

 이 책은 다음과 같이 총 4가지챕터와 브록들로 구성되어 있다.

Part 01

- 웹 어셈블리가 무엇인지에 관해 논한다

- 웹 어셈블리가 왜 등장하였고 어떤 점이 기존의 기술들 (JS, Node.JS)에 비해 좋은지 등의 배경을 설명한다.

- 웹 모듈의 전체적인 아키텍처에 관해 논한다.

- 웹 어셈블리 모듈을 만들기 위한- '엠스크립튼'이라는 도구에 대해서 살펴본다.

- 간단한 실습을 통해 위의 내용들을 복습한다.

Part 02

- 기존의 C++ 코드를어떤 식으로 웹 어셈블리 모듈로 변환하는지에 관해 다룬다.

- 연결 코드의 유무에 따른 모듈 생성 법을 배운다.

- 웹 어셈블리 모듈에서 자바스크립트 호출 법을 배운다.

- 함수 포인터를 이용한 통신 방법을 배운다.

Part 03

- 웹 어셈블리의 심화 챕터이다. 내용이앞장들에 비해 복잡할 수 있으므로 꼼꼼히 읽어보도록 하자.

- 동적 링킹의 개념에 관해 배우고C/C++로 작성한 코드들을 수동 링킹 하는 기술에 관해 다룬다.

- 동적 링킹인 dlopen 등을다루게 된다.

- 동적 모듈을 여러 개 생성하여 동적 링킹하는 방법 등을 다룬다.

- 웹 워커와 pThread를사용하는 방법에 관해서 다룬다. (이 부분이 굉장히 매력적인 부분입니다. - 챕터 9)

- Node.js 환경에서 웹 어셈블리 모듈을 사용하는 법을 다룬다.

Part 04

- 텍스트 포맷이 무엇인지 텍스트 포맷의 작동원리에 관해 다룬다.

- 이를 통해 그동안 배운 내용들을 기반으로 카드 짝 맞추기 게임을만든다.

- 위 과정 중에 트러블 슈팅과 버그 해결 등, 웹 디버거를 이용한 처리 방법을 다룬다.

- 각 플랫폼별 디버깅하는 방법에 관해서 배운다.

- 테스트 자동화 (테스트코드 작성) 방법에 관해 다룬다

- 웹 어셈블러의 앞으로의 전망에 관해 논한다.

기타

- 이 책을 학습하는데 필요한 학습환경 구축에 관해

- 엠스크립튼 헬퍼 함수 이용법

- 엠스크립튼 매크로 이용법

- 등

【웹어셈블리 인 액션을 읽으며…….】

 시대가 정말 많이 변했다는 것을 느낀다.15년 전에 웹은 노가다의 산물이었다. 그 당시엔FE/BE 그런 개념도 딱히 없었다. 그저 HTML 과 CSS 그리고 자바로 된 spring 기초 버전이 전부였던 것으로기억하고 있다. (자바 전에는 무엇이었을지.. 아마 C/C++로 만들어진 원초적 서버이지 않았을까? 예상해본다) 그런데 이제는 웹에 C/C++을 붙이고, 다이내믹한 웹이 대세를 이루는 시대가 되었다. 과히 웹을 안 쓰는곳은 이제 IT 업계에서는 찾아보기 힘들 정도이다.

결국 프로그래밍도 사람이 사는 세상이다. 무슨 말인고 하니, 사람에게 익숙한 부분으로 모든 것이 회귀한다는 것이다. 웹도 처음엔매우 간단했다. HTML의 태깅과 마크업은 정말 단순했다. 그러다어느 순간 javaScript가 생겨났고 이를 기반으로 수많은 기능들이 태생했다. Node.js, Vue.js, react.js 등등..

그렇지만 위의 기술들을 새로 배우고 접한다는 것은 개발자에겐 피로한 일일지도 모른다는 생각이 든다. 그렇기에 전체는 아니어도 부분 모듈로써 웹 어셈블리 생겨났고, 이를통해 고전 개발자. 즉 옛 언어인 C/C++에 익숙한 개발자들도웹의 세상에 참여할 수 있게 되었다. (물론 웹 어셈은 성능적 향상을 꾀하기 위해 제안된 기술인 걸로알고 있다.)

신기하지 않은가? 최신 기술이라고 하지만 결국은 옛것과 다시 하나가되어가고 있다. 어찌 보면 최고의 기술은 옛것, 결국 처음우리 인간의 손에 의해 제안된 기술일 수 있을 것이란 생각이 든다.

그렇기에 여러분께 강조하고 싶은 것이 하나 있다. 

기초에 충실하자!

웹어셈블리라는 말은 풍문처럼 많이 들었지만, 책을 본적은 없었기 때문에, 이 책을 보게 되었습니다. 

이 책은 웹어셈블리에 대한 간략한 소개를 하고 재빠르게 C/C++을 사용해서 웹어셈블리 모듈을 어떻게 만들어 내는지 소개하고 있는데요. 저는 10년전까지만 해도 C/C++를 사용해서 일을 했었기 때문에, 상당히 친근한... 느낌을 받았습니다. 특히 C/C++를 쓰다보면, 중요하게 설명하고 있는 모듈관련 기능들이 웹어셈블리로 녹아들어가는 건, 좀 난감하기까지 하더군요. 

재미있는 건, 웹어셈블리 모듈로 컴파일하는 언어가 C/C++만이 아니라는 겁니다. Rust, typescript, java, go, python, c# .. .특히 C#을 기반으로 하는 블레이저는 요즘 한참 뜬다고 하더군요. 

​

다양한 언어로 솔루션을 만들어내는 아키텍처는 사실, 20년전쯤 많이 주목받았던 기술이 있습니다.  바로, CORBA입니다. 물론 요즘도 쓰이는 곳이 있다고는 하는데 ( 솔직히 어디서 쓰는지 저는 보지못했습니다. ) 

현재 인터넷 브라우저가 사용하는 아키텍처 인 "브로커 패턴"을 그대로 어플리케이션 구현에 사용했던 CORBA는 다양한 언어로 CORBA 모듈을 만들면 이것을 연결시켜서 소프트웨어를 서비스 형으로 제공하려는 구상을 가지고 있었던 기술이었습니다. 

​

예전에 CORBA가 왜 망했는지에 대한 기사를 볼 기회가 있었는데요. 한마디로 쓰기 너무 어려워서 였습니다. 그리고 비쌌고요. 어떤 회사에서 이 기술을 쓰려면 개발 시작할 때부터 돈을 좀 내야 했었나봅니다. 그리고 내부적으로 정치적 문제도 있었다는 군요. 

하여튼, 살짝 주춤하던 시기에 닷컴 버블이 터지고 맙니다. 즉, IT 업계에 밀려들어가던 자금 줄이 끈어진 셈이죠. 아시겠지만, 돈줄 끈기면 그 기술을 사장됩니다. 

​

결국, 지금은 아는 사람도 별로 없는 기술이 되어 버렸습니다. 

​

그런데, 어느 순간 CORBA로 하려던걸 웹으로 하는 쪽으로 방향이 결정되었습니다. 누가 그렇게 결정한 건 아닌것 같은데... 그냥 지금 현재는 그런 상태입니다. 

하지만 자바스크립트는 느리다는 문제가 있습니다. 즉, 사용자의 요구에 맞게 좀 빠른 속도가 필요한 어플리케이션을 만들어내기는 한계가 있는 거죠. ( 요즘 컴퓨팅 파워는 그 한계가 정말 있나.. 싶기도 하지만 ... )

​

예를 들어서 게임이나, 캐드 솔루션 같은건 솔직히 웹에서 돌리기 민망하죠. 그래서 WebGL이 나왔는데, 역부족입니다.  그래서 웹어셈블리가 필요하지 않았을까 싶군요. 

​

CORBA는 전체 그림을 먼저 그리고 기술 표준을 만든다음 시장에 강제하는 방향으로 변화를 만들려고 했다면, 현재 웹기술은 그냥 시장이 흘러가는 방향대로 필요한 기술이 하나씩 생기고 다같이 써보다가 좋으면 계속 쓰는 쪽으로 가고 있는 듯하네요. 

​

이 책에서도 많이 나오지만, 웹어셈블리가 자바스크립트보다 빠른 가장 근본적인 이유는 변수형 때문입니다.  

"변수형을 미리 알고 시작하기 때문에 자바스크립트 엔진은 코드를 모니터링할 필요 없이 그냥 웹어셈블리 바이너리를 기계어로 컴파일할 수 있습니다. (본문중에서)"

어차피 프로그래밍언어로 코딩한 코드는 기계가 알아듣는 코드로 바뀌어야 하는데요. 기계는 동적인 변수를 이해하지 못합니다. 즉 컴파일러나, 인터프리터가 그걸 판가름해서 기계가 알게 해줘야 하는 거죠. 

그런데 코딩 할때부터 변수타입을 결정해주면 어떨까요? 그럼, 당연히 이게 무슨 타입인지 인터프리터가 쫓아다니지 않아도 되니 빠르게 될 겁니다. 

​

그럼, 왜, 자바스크립트는 변수 타입을 그렇게 쓰게 했을까요? 그냥 좋아보여서는 아닐겁니다. 이건 프로그래밍 패러다임과 연관이 있습니다.  함수형 프로그래밍 패러다임에 해당하는 언어들이 대부분 변수의 타입을 쓰지 않는데요.  함수만으로 코딩을 하고 싶은데 변수의 선언부가 꼭 끼어들어야 한다면, 간결한 코드를 만들기 힘들어질 겁니다. 하지만 이는 코드를 한꺼번에 컴파일해서 기계어로 보내는 걸 힘들게 만드는 단점이 되는 거죠. ( 느려진 원인이죠 )

​

그럼 속도를 위해서 함수형 프로그래밍 패러다임을 버려야 할까요? 그렇지 않을 것 같습니다. 함수형 프로그래밍 자체가 근래에 만들어진 것이 아니고, 컴퓨팅 파워가 말도 안되는 시절부터 존재했던 것입니다.  다시 말하면, 컴퓨팅 파워가 계속 좋아지면 어떻게 해서든 함수형 프로그래밍 쪽으로 갈 거란 말이됩니다. 

이유가 있겠죠. 코드를 아주 간결하게 만들수 있도록 해주는 개념이고, 코드가 간결해 질 수록 버그는 줄어든다는 건 학계 정설이죠. ( 믿거나 말거나 ) 게다가 사용자 인터페이스, 사용자 경험 이런걸 진화시키기 위해서는 그쪽 코드는 수시로 바꾸고 빨리 바꾸고 여하튼 사람이 뭔가 많이 해야 합니다. 

​

결국, 우리는 자바스크립트를 "함수형 프로그래밍"으로 사용하여 개발자가 많이 손봐야 할 코드를 만들고, 웹어셈블리로는 개발자보다는 컴퓨터 쪽에 더 가까운 코드를 만드는데 쓰게 되지 않을까 싶습니다. 

​

결론은, 둘다 알아야 한다가 되지 않을까 싶네요. 

그래서, 이 책은 나중에 생각 날 때 또 봐야 할 것 같습니다. 그리고, Rust나 아님 다른 언어로 웹어셈블리하는 책을 더 봐야 겠군요.