Применения в вебе

Смотрим, где WebAssembly уже работает в реальных веб-продуктах.

Wasm в вебе — это движок тяжёлых приложений: игр, графических редакторов, кодеков и криптографии прямо в браузере.

Игровые движки

Unity и Unreal Engine умеют экспортировать игры в WebAssembly. Игра, написанная на C++, компилируется в Wasm и запускается в браузере без установки — с физикой, 3D-графикой через WebGL/WebGPU и звуком. Раньше для этого нужен был Flash или нативный плагин; теперь достаточно открыть вкладку.

Графические редакторы

Один из самых известных примеров — Figma. Её движок рендеринга написан на C++ и скомпилирован в Wasm, что даёт плавную работу с тысячами векторных объектов прямо в браузере. Photoshop от Adobe тоже пришёл в веб через Wasm: десятилетиями отлаженный C++ код фильтров и инструментов компилируется в Wasm вместо переписывания на JS.

Видео и аудио

Видеокодеки — идеальная задача для Wasm: интенсивная битовая арифметика, реальное время. Проекты вроде ffmpeg.wasm позволяют конвертировать и обрабатывать видео прямо в браузере, без отправки файла на сервер. Это важно и для приватности: данные не покидают устройство.

Криптография

Шифрование и хеширование — тоже про тяжёлую арифметику. Wasm даёт быстрые и, что важно, предсказуемые по времени реализации, что полезно против атак по времени. Покажем идею хеша простым примером на JS — суммируем коды символов по модулю (упрощённая модель того, что делает Wasm-хеш):

function simpleHash(text) {
  let h = 0;
  for (let i = 0; i < text.length; i++) {
    h = (h * 31 + text.charCodeAt(i)) % 1000000007;
  }
  return h;
}
console.log("hash('wasm') =", simpleHash("wasm"));
console.log("hash('web') =", simpleHash("web"));

Вывод:

hash('wasm') = 3645501
hash('web') = 117791

Настоящие крипто-библиотеки сложнее, но суть та же — интенсивный счёт, где Wasm даёт стабильную скорость.

Как работает под капотом

Во всех этих случаях архитектура одинакова: тяжёлое вычислительное ядро живёт в Wasm, а JavaScript оркестрирует — ловит ввод, управляет UI, обращается к сети и рисует результат на canvas через WebGL/WebGPU. Wasm считает пиксели, геометрию, кодеки; JS показывает. Это ровно то разделение труда, с которого начинался курс, только в промышленном масштабе.

Частые ошибки

• Думать, что Wasm рисует сам — нет, графику выводит JS через Canvas/WebGL; Wasm готовит данные.
• Ждать мгновенной загрузки тяжёлой игры — большие Wasm-модули нужно скачать и скомпилировать.
• Считать Wasm нишевым — он уже в продуктах с миллионами пользователей (Figma, Photoshop).

Итоги

• Игры (Unity/Unreal), Figma, Photoshop, Google Earth, AutoCAD работают на Wasm.
• Видеокодеки и криптография — естественные задачи для Wasm.
• Архитектура везде одна: Wasm считает, JS оркестрирует и рисует.