Начало работы с WebAssembly.
Это первая часть серии о программировании на WebAssembly (Wasm) для начинающих. Цель состоит в том, чтобы дать вам первое представление о том, что такое Wasm и как он может быть полезен для ваших собственных проектов. Чем дальше пойдет сериал, тем глубже мы будем погружаться в тему.
Я полагаю, вы уже слышали о WebAssembly; насколько он производительный, легкий, безопасный и в целом многообещающий. В противном случае вы, вероятно, не читали бы этот текст прямо сейчас, не так ли? Итак, я просто пропущу всю эту чепуху и перейду сразу к более интересным вещам: например, как писать код Wasm и как на самом деле его использовать.
Васм и Ват
Wasm – это двоичный формат (файлы с расширением .wasm). Он также имеет текстовое представление под названием Wat (файлы с расширением .wat). Wat можно легко сгенерировать из двоичного формата, например, с помощью инструментов разработчика в браузере.
Хотя Wat — это текстовый формат, понятный людям, он все же довольно низкоуровневый — программирование сложных систем в Wat быстро превратилось бы в кошмар. Но не беспокойтесь, Wasm можно скомпилировать из многих языков, таких как Rust, C/C++, Go или Kotlin. Просто выберите свой любимый!
Привет, WebAssembly!
Чтобы понять самые основы, мы начнем с довольно низкого уровня. Ну, не на двоичном уровне, в конце концов, он никогда не предназначался для написания или чтения людьми. Мы создадим простую программу Hello world в Wat, текстовом формате WebAssembly.
Скопируйте и сохраните следующий код в файл (hello.wat):
(module
(func (export "main")
(result i32)
i32.const 42
return))
Подождите, в приведенном выше коде нет Hello! Это первая загвоздка: в WebAssembly нет значения type, которое представляло бы строки. У нас в базовой комплектации только числовые типы. На данный момент 42 года, ответ на главный вопрос жизни, вселенной и всего остального, будет служить нашей фразой привет, мир.
Для тестирования кода мы можем использовать WebAssembly Binary Toolkit. Во-первых, мы должны скомпилировать текстовый формат Wat в двоичный формат Wasm (hello.wasm):
$ wat2wasm hello.wat -o hello.wasm
Мы можем запустить его с помощью интерпретатора из того же инструментария:
$ wasm-interp --run-all-exports hello.wasm
Должен появиться следующий вывод:
main() => i32:42
Тот же код мы можем запустить и в браузере:
<html>
<body>
<script>
WebAssembly
.instantiateStreaming(fetch('hello.wasm'))
.then(({instance}) =>
console.log(instance.exports.main())
);
</script>
</body>
</html>
Для работы Fetch API HTML-страница должна обслуживаться через HTTP(s). Такие инструменты, как dir2http, делают свое дело.
После открытия страницы в браузере мы должны увидеть ответ в консоли разработчика:
» 42
Как только что показано, одна и та же программа WebAssembly может работать как внутри, так и вне браузера. Это показывает большой потенциал WebAssembly в качестве универсальной платформы программирования как для веб-клиентов, так и для серверных приложений.
Дальнейшие шаги
Итак, мы написали нашу первую программу на Wasm и теперь знаем ответ на главный вопрос. Что дальше?
Во второй части этой серии мы углубимся и байт за байтом объясним, что на самом деле происходит под капотом.
