개발에 대한 두서 없는 이야기

WebAssembly와의 만남 개인적으로 웹어셈블리를 알게 된 건 이미 2~3년 정도 지났다. 당시에도 매우 흥미있게 지켜봤고, 나만 그런걸수도 있지만 개발자라면 어셈블리라는 단어에 혹하기 마련이다. 다룰 줄 안다면 왠지 남들보다 괜찮은 개발자라고 착각하기 쉽기 때문이다. 다만 당시에 다룰 수 있는 시스템 프로그래밍언어(C++, Rust, Go..) 등이 전혀 없었고(C는 잠깐 배운정도) 실력에 비해 만들고자 하는 것들에 대한 욕심이 과했다. 꿈은 높은데 현실은 시궁창이야 능력은 안되는데, 관심은 많아서 Wasm으로 만들어진 플래시 부활 프로젝트인 Waflash나 Rufle(맞나?)를 관심있게 지켜보기도 했고 ffmpeg을 wasm으로 빌드하여 클라이언트에서도 돌릴 수 있게 한(실전성은 여전히 부족하다)..

절망편 앞서 말한것이 희망과 미래에 대해 이야기 했다면 현재 왜 적용이 힘든지, 사용이 힘든지 말해보겠다 우선 wasm은 많은 메모리를 필요로 한다. 물론 간단한 수식 계산이나 간단한 정렬 계산 등 메모리 안에 들어가야할 것이 크지 않은 경우 큰 문제가 되지 않지만 그것이 이 글에서 말하고자 하는 FFmpeg일 경우 문제가 된다. 앞서 말한 순수한 자바스크립트로 만든 클라이언트용 FFmpeg은 코어가 아닌 풀패키지로 한다면 용량만 순수하게 100MB가 넘는데, wasm도 많이 최적화를 했음에도 25MB라는 거대한 용량을 가지게 된다. 이러한 용량은 사이트내에 직접 wasm모듈을 업로드하기 어려워지고 cdn을 활용할 수 밖에 없어지게 된다. 물론 최근의 cdn은 속도이슈도 그렇게 크지 않고, 접속도 원활하..

로 호출 할 수 있다. ES6의 문법중 하나인 모듈로 불러오는 방법이다. 우선 러스트로 빌드하는 경우 pkg폴더 내에 관련 파일들이 생성되는데 bulid.js를 불러 온다. 뜻에서도 알 수 있겠지만 자동적으로 빌드가 된 wasm에서는 init함수는 기본적으로 포함되어있으며 해당 함수를 실행하여야 정상적으로 실행된다. 웹어셈블리를 활용하는데 ES6 문법이 어색한 사람은 없겠지만 모듈을 활용하지 않고도 호출할수 있다. wasm-pack build --target no-modules 모듈없이 빌드하는 방법이다. ; 다만 위의 방법으로 빌드 할 시 웹어셈블리내에서 웹어셈블리가 아닌 외부의 스크립트들의 함수를 불러내 사용할 수 없다. 그외에도 nodejs에서도 빌드 할 수 있는 방법이 있으며 모든 기기에 호환되게..

2020/12/20 - [프로그래밍/자바스크립트] - WebAssembly를 활용한 Rich Text Editor 제작기 1편 [WebAssembly를 활용한 Rich Text Editor 제작기 1편 WebAssembly 아직까지 많은 활용은 이뤄지지 못하고 있지만 모든 모던 웹브라우저가 지원을 하기 시작했고, 많은 양의 데이터의 처리가 항상 문제가 되는 웹 특성상 이 속도를 획기적으로 줄일 수 shifeed.tistory.com](https://shifeed.tistory.com/entry/WebAssembly를-활용한-Rich-Text-Editor-제작기-1편) 실제 문서 편집에 필요한 아이콘 추가하기 앞서는 간단히 Rust에서 Dom을 조작할 수 있게 설정하고 최소한이 필요함인 텍스트 에디터 형태..

WebAssembly 아직까지 많은 활용은 이뤄지지 못하고 있지만 모든 모던 웹브라우저가 지원을 하기 시작했고, 많은 양의 데이터의 처리가 항상 문제가 되는 웹 특성상 이 속도를 획기적으로 줄일 수 있는 웹 어셈블리는 앞으로 확실히 그 사용용도나 가치는 증가할 것으로 보인다. c, c++, golang, rust 등 다양한 언어 등으로 개발 할 수 있다. 개인적으로 설명을 더 하고 싶지만 설명보다는 직접 해보는것이 빠르고 이미 웹어셈블리가 가진 장점이나 단점 가능성 등은 구글에서 검색만 해봐도 나오기에 굳이 쓰지 않겠다. Rich Text Editor 외국웹에선 위와 같은 명칭으로 불리지만 쉽게 말하자면 말하는 웹에디터이다. 스마트에디터, 다음에디터 등 웹에서 조금 더 서식을 꾸며 작성할 수 있게 하는 ..