Введение в WebAssembly

Что такое WebAssembly?

WebAssembly (Wasm) предоставляет формат бинарных инструкций для виртуальной машины на основе стека. Проще говоря WebAssembly представляет технологию, которая позволяет запускать в браузере низкоуровневый скомпилированный код.

Предтечей появления Wasm была разработка в компании Google Native Client (NaCL) - специального инструмента, который позволял запускать нативный код на C/C++ в веб-браузере. Нативный код компилировался в файлы с расщирением nexe и запускался в песочнице браузера (sandbox), поэтому его выполнение было относительно безопасным. Однако технология была доступна только для приложений и плагинов из Google Chrome Web Store Далее был разработан Portable Native Client (PNaCL). Если NaCL был платформенно-зависимым, то PNaCL, наоборот, не зависел от архитектуры и был теоретически доступен для всех приложений, а не только из Google Chrome Web Store. PNaCL состоял из двух компонентов: инструментария, который компилировал код C/C++ в модули NaCL, и компонентов выполнения, которые встраивались в браузер и позволяли запускать модули NaCL.

Параллельно Mozilla, начиная с 2013 года, разрабатывала библиотеку asm.js, которая должна была транслировать код C/C++ в JavaScript.

В апреле 2015 международный консорциум по разработке веб-стандарто World Wide Web Consortium (W3C) создает рабочую группу по разработке спецификации по WebAssembly. И в марте 2017 года новый стандарт был принят. Изначально реализация WebAssembly в браузерах во многом базировалась на asm.js, в то время как для переноса скомпилированных модулей использовалась концепция PNaCL. Спецификация по WebAssembly доступна по адресу https://www.w3.org/TR/wasm-core-1/. Кроме того, разнообразную информацию о Wasm можно найти на официальном сайте https://webassembly.org.

При этом важно понимать, что WebAssembly - это не новый язык, это лишь бинарный формат, в который можно компилировать программу на разных языках. Работать с WebAssembly довольно просто. Вначале пишется обычный код, который размещается в текстовом файле. Преимущественно применяются C и C++, но также можно использовать Rust и другие языки. Далее этот код компилируется в бинарный формат в файл с расширением .wasm. Затем специальный код JavaScript загружает скомпилированный модуль на веб-страницу и вызывает функции, которые определены в модуле wasm.

При этом WebAssembly не предназначен для замены JavaScript, а лишь призван дополнить и обогатить возможности данного языка. Более того без JavaScript мы не сможем получить доступ к коду wasm.

Где Wasm может применяться? WebAssembly предназначен прежде всего для таких задач, где важна производительность, например, обработка картинок, аудио и видео, игры, распознование изображений, виртуальная реальность. По ряду задач при переходе от JavaScript к WebAssembly наблюдался прирост в производительности почти в 20 раз.

WebAssembly не ограничен только браузером и также может использоваться для создания гибридных нативных приложений на мобильных устройствах или для вычислений в приложениях на стороне бекэнда.

Для работы с Wasm преимущественно используются C, C++ и Rust, однако могут использоваться и другие языки, для которых существует поддержка компиляции в модули Wasm (например, C#, Go). Собственно это еще одно из преимуществ Wasm, поскольку не все программисты могут значть JavaScript, однако теперь можно писать если не весь, то по крайней мере немалую часть кода для клиентской стороны без знания JavaScript.

В то же время WebAssembly не лишен ограничений, которые следует учитывать при проектировании приложений:

• Отсутствует сборщик мусора (Garbage Collector). Хотя, возможно, поддержка GC будет добавлена впоследствии.

• Через Wasm нельзя взаимодействовать напрямую с DOM, для этого следует использовать JavaScript.

• Не поддерживается в ряде браузеров, в основном старых (например, IE 11). Какие браузеры поддерживают Wasm, можно посмотреть на https://caniuse.com/#feat=wasm.

  В коде JavaScript мы можем проверить наличие объекта WebAssembly перед выполнением кода на Wasm:

  if("WebAssembly" in window){
  	console.log("Браузер поддерживает WebAssembly");
  	//  операции с WebAssembly
  }
  else{
  	console.log("WebAssembly не поддерживается");
  }
  

Полезные инстументы для изучения и практики WebAssembly

WebAssembly Studio представляет среду разработки, которая дсотупна онлайн, где можно посоздавать простейшие примеры с помощью языков C и Rust.

WasmFiddle - еще одна фактически онлайн-среда разработки, которая позволяет скомпиллировать код C в Wasm и провести минимальные исследования.

WebAssembly Binary Toolkit предоставляет утилиты командной строки для взаимодействия с кодом wasm, например, поддерживает их трансляцию в исходный код на C. Однако он не поддерживает компиляцию из C/C++ в Wasm.

Emscripten - один из наиболее популярных инструментов для компиляции из C/C++ в wasm.