WebAssembly 에 대한 심층 분석

몇몇 업계 전문가들이 생각하는 차세대 혁신 기술이 될 것으로 예상되는 세 가지 기술이 있습니다. 특히 세 가지 기술 중 하나는 좀 더 자세히 살펴볼 필요가 있습니다: 바로 WebAssembly(Wasm)입니다. Wasm은 브라우저의 언어 지원을 JavaScript 이상으로 확장한다는 점에서 많은 사람의 관심을 끌고 있습니다. JavaScript를 대체하는 것이 아니라 HTML, CSS, JavaScript와 함께 World Wide Web Consortium(W3C)에서 공식 웹 표준으로 승인한 네 번째이자 최신 언어입니다.

컴퓨팅의 세계는 끊임없이 변화하고 있습니다. 메인프레임에서 클라우드 IaaS, 가상 머신에서 Linux에 이르기까지 우리는 끊임없이 기술을 확장하고 재창조하고 있습니다. 이러한 변화는 종종 “우리가 항상 해왔던 방식”이 새로운 패러다임에서는 더 이상 작동하지 않거나 사실 처음부터 그다지 훌륭하지 않았다는 사실에 의해 주도됩니다.

최근의 사례를 어렵지 않게 찾아볼 수 있습니다. 가상 머신(VM), 컨테이너, 쿠버네티스, OpenTelemetry는 변화하는 요구 사항이 새로운 솔루션에 영감을 준 몇 가지 예에 불과합니다. 그리고 쿠버네티스와 OpenTelemetry에서 알 수 있듯이, 솔루션이 올바르면 쓰나미처럼 채택이 뒤따릅니다.

목차

1. WebAssembly 란?
2. WebAssembly 에 관심을 가져야 하는 이유
3. 어떻게 시작하나요?
4. 요약

1. WebAssembly 란?

2015년에 Mozilla는 웹 브라우저의 컴파일 대상으로 “이식 가능하고 크기와 로드 시간이 효율적인 형식 및 실행 모델을“을 정의하기 위한 새로운 표준 작업을 시작했습니다. WebAssembly 는 기본적으로 JavaScript 이외의 언어가 브라우저 내에서 실행될 수 있도록 설계되었습니다. 그리고 Wasm은 모든 주요 브라우저에서 이를 지원하면서 브라우저 공급업체들의 관심을 빠르게 끌었습니다.

여러분 중 일부는 외부 환경, 주로 제어 하드웨어를 대상으로 코드를 작성하던 크로스 컴파일러 시절을 기억하실 것입니다. 대상은 매우 다양했기 때문에 cross_compilation은 생성 시스템과 대상 시스템 간에 엄격하게 일치해야 했습니다. Wasm도 비슷한 방식으로 작동하여 다양한 플랫폼에서 정의된 런타임에 바이너리 실행 파일을 제공합니다. 런타임은 저수준 가상 머신(JVM)이기 때문에 여러 호스트 애플리케이션에 임베드할 수 있습니다.

따라서 Wasm은 프로그램을 실행하기 위한 이식 가능한 바이너리 코드이자 프로그램과 환경 간의 상호 작용을 위한 인터페이스 세트입니다. 웹에 특정한 가정을 하지 않기 때문에 광범위하게 사용할 수 있습니다. 사실 Wasm에 대한 관심은 server-side use cases에서의 잠재력에서 크게 좌우됩니다. Cosmonic, Fermyon, Suborbital과 같은 회사들은 브라우저에서 백엔드에 이르는 앱의 미래에 Wasm이 영향을 미칠 것임을 보여주고 있습니다.

채택을 촉진하는 매력적인 기능 중 하나는 Wasm이 C, C++, Go, Ruby, Rust 등 거의 모든 인기 언어를 완벽하게 지원한다는 점입니다. 다른 언어에 대한 부분적인 구현이 제공되거나 진행 중일 가능성이 높습니다. 하지만 한 가지 주의할 점은 특정 언어에 대한 Wasm의 지원이 브라우저, 브라우저 외부, 심지어 시스템에서 직접 지원하는 등 특정 컨텍스트로 제한될 수 있다는 점입니다. 따라서 사용하려는 컨텍스트에서 Wasm이 해당 언어를 지원하는지 확인하는 것이 중요합니다.

2. WebAssembly 에 관심을 가져야 하는 이유

WebAssembly 는 모든 브라우저에 필요한 몇 가지 중요한 기능에 집중했습니다. 앞서 여러 언어로 브라우저를 확장할 수 있는 Wasm의 다국어 특성에 대해 언급했습니다. 하지만 다른 기능도 몇 가지 있습니다.

  • Speed/Performance – 웹 페이지가 로드될 때까지 기다리는 것을 좋아하는 사람은 없습니다. 웹 애플리케이션이 로드되고 시작되기를 기다리는 것은 더더욱 재미가 없습니다. Wasm의 컴파일 모델은 로딩 속도를 높여줍니다. 실제로 네이티브 애플리케이션의 성능에 근접할 수 있습니다.
  • Size – 웹 앱의 경우 다운로드되는 객체의 크기가 중요한 요소입니다. 바이너리가 작을수록 시작 시간이 빨라집니다.
  • Cross-Platform – 웹 브라우저는 웹사이트와 앱의 보편적인 액세스 포인트이므로 모든 브라우저에서 “한 번 작성하면 어디서나 실행”이 단순한 약속이 아니라 현실이 되기를 바랍니다. Wasm은 이미 이를 잘 구현하고 있으며, 앞으로도 계속 개선해 나갈 것입니다.
  • Multi-Lingual – 적응형 애플리케이션과 마이크로서비스 아키텍처의 현대에는 하나의 언어가 모든 목적에 적합하지 않습니다. Wasm은 다양한 언어의 앱을 브라우저로 확장함으로써 “I don’t use that language”라고도 알려진 주요 “anti-pattern” 차단기를 제거합니다. 특히 서버 측 사용을 고려할 때 JavaScript만 사용하는 것을 넘어서는 것이 필요하며, Wasm을 사용하면 이를 수행할 수 있습니다.
  • security – 브라우저에서 신뢰할 수 없는 코드를 실행해야 하는 경우, 해당 코드를 격리해야 합니다. Wasm은 memory-safe sandboxed execution environments로 격리를 달성합니다. 현재 구현이 완벽하지는 않지만 Wasm 기여자들이 이 부분에 집중하고 있으므로 빠른 개선을 기대합니다.

이러한 기능에 중점을 두었기 때문에 Wasm은 놀라울 정도로 성능이 뛰어나고 효율적이며 솔직히 재미있습니다. 이에 대해 자세히 알아보려면 CovalenceConf 2019: Speed, Speed, Speed: JavaScript vs C++ vs WebAssembly를 확인하세요. 현재로서는 Wasm이 JavaScript보다 훨씬 빠르지는 않지만, 아직 JavaScript의 수년간의 최적화 작업이 뒷받침되지 않았다는 점을 명심하세요. 또한 속도만이 Wasm을 선호하는 유일한 요소는 아니며, 크기와 원하는 언어를 사용할 수 있는 기능도 중요합니다.

3. 어떻게 시작하나요?

WebAssembly 에는 훌륭한 리소스가 많이 있습니다. 스타트업부터 대기업에 이르기까지 많은 기업이 이 방식을 따르고 있습니다:

  • Adobe는 브라우저에서 Wasm으로 실행되는 포토샵을 시연했습니다.
  • Figma는 Wasm을 통해 로드 시간을 3배나 단축했습니다.
  • VMware의 Wasm Labs는 브라우저에서 실행되는 WordPress, PHP 런타임, 데이터베이스를 모두 시연했습니다.

하지만 한 번에 Wasm으로 전환하는 것부터 시작할 필요는 없습니다. 자세한 내용을 알아볼 수 있는 훌륭한 리소스입니다:

  • WebAssembly.org는 사양과 개발자를 위한 체계적인 시작 가이드를 포함하여 Wasm에 대한 모든 것을 확인할 수 있는 소스입니다.
  • Renee Shah는 자신의 블로그에서 18개 스타트업의 기술 전문가들에게 Wasm을 사용하는 방법과 이유를 물었습니다.
  • 다음 데모 앱은 Wasm에서 실행되고 있습니다:

4. 요약

WebAssembly는 아직 진행 중인 기술이며, 다른 신기술과 마찬가지로 어떤 측면은 다른 측면보다 더 완벽합니다. 그런데도 WebAssembly의 개념은 매우 매력적이며, 브라우저나 클라우드에서 적응형 앱의 미래에 큰 영향을 미치는 게임 체인저가 될 것으로 예상됩니다. 의심할 여지 없이 WebAssembly는 지금 배워야 할 기술 중 하나입니다.

WebAssembly를 위한 웹 서버, 리버스 프록시, 로드 밸런서, API Gateway로 많이 사용하는 NGINX Plus를 직접 사용해 보시려면 30일 무료 평가판을 신청하거나 NGINX STORE에 연락하여 논의하십시오.

NGINX에 대한 최신 정보들을 빠르게 전달받고 싶으시다면, 아래의 뉴스레터를 구독하세요.

NGINX STORE를 통한 솔루션 도입 및 기술지원 무료 상담 신청

* indicates required