Создание графических приложений с помощью Wasmer и WASI
MVP WebAssembly предоставил разработчикам множество действительно интересных функций и большой потенциал для будущих приложений! Однако, поскольку технология еще молода, есть еще много функций, которые еще не совсем готовы. Например, такие функции, как потоки, типы интерфейсов и т. Д., В настоящее время являются предложениями для спецификации, но многие приложения зависят от этих функций. 🤔
Сегодня в Wasmer мы рады представить предварительную версию экспериментальной функции, над которой мы работаем: Устройства ввода-вывода! Устройства ввода-вывода создают специальные файлы, которые модули WebAssembly могут читать и записывать, для рисования графики и обработки ввода.
Устройства ввода-вывода можно включить, передав флаг в интерфейс командной строки Wasmer, и они доступны в виде пакета для Wasmer-JS. 🔌
Давайте сделаем шаг назад и узнаем, как устройства ввода-вывода могут помочь сообществу сегодня.
Узнаем, какие функции может использовать сообщество уже сегодня
Мы провели небольшое исследование того, что люди в сообществе открытого исходного кода пытаются создать с помощью WebAssembly, и обнаружили, что это было много игр! Sandspeil, WasmBoy и Порт продолжения DOOM 3 - все это потрясающие игры, созданные с помощью WebAssembly. Игровые движки, такие как Unity, Gdevelop и Construct 3, поддерживают вывод игр для веб-браузеров, использующих WebAssembly. 🎮
Однако ни одна из этих игр или движков не поддерживает автономный запуск игры. Например, в настоящее время у вас не может быть единого двоичного файла Wasm для создания и взаимодействия с графикой и вводом, поскольку вам все равно потребуется дополнительный код для конкретной платформы (например, веб-браузера) на другом языке.
Ввод-вывод Wasmer devices позволяет разработчикам иметь один двоичный файл Wasm для открытия окна, записи в буфер кадра и чтения событий ввода от пользователя. 💪
Давайте посмотрим, как работают устройства ввода-вывода, и включим эту функцию.
Создание приложений WASI с помощью устройств ввода-вывода Wasmer
Устройства ввода-вывода работают, создавая файлы виртуальных устройств в файловой системе времени выполнения, аналогично файлу устройства в операционной системе UNIX. Если модуль Wasm использует привязки WASI для чтения / записи файлов, среда выполнения может реагировать на события и выполнять действия для модуля Wasm. 😎
Например, устройства ввода-вывода создают файл/_wasmer/dev/fb0/fb, содержащий байтовый массив RGBA буфера для рисования. Что похоже на запись напрямую в фреймбуфер Linux! 🖼️
Поскольку API по сути является абстракцией по сравнению с обычной файловой системой и текущей спецификацией WASI, устройства ввода-вывода Wasmer можно опробовать сегодня с любым языком / набором инструментов, поддерживающим WASI!
Фактически, у нас даже есть рабочая автономная версия WasmBoy, которую можно попробовать со средой выполнения Wasmer! Это работает с использованием пакета io-devices-lib-assemblyscript, который мы создали. Пакет, а также ящик Rust для взаимодействия с устройствами ввода-вывода можно найти в нашем репозитории io-devices-lib.
WasmBoy теперь доступен на WAPM, как WasmerBoy. Вы можете установить Wasmer и WAPM, следуя инструкциям здесь. Затем Wasmerboy можно установить автономно, запустив: wapm install -g torch2424/wasmerboy. Затем, запустив wasmerboy --dir=my-dir my-dir/my-rom-file.gb. Например, мы можем запустить Tobu Tobu Girl под лицензией MIT, используя WasmerBoy из WAPM:
Вы можете скачать ром Tobu Tobug Girl по этой ссылке.
WasmerBoy также работает с Wasmer-JS / WebAssembly.sh (в Desktop Chrome)! Вы можете перетащить файл ROM в WebAssembly.sh, который добавит его в файловую систему. Затем вы можете запустить ту же команду: wasmerboy /tmp/my-rom-file.gb. Откроется всплывающее окно, в котором работает WasmerBoy!
Спасибо!
Мы ТАК рады видеть интерес и проекты, которые могут возникнуть в результате этого. Мы действительно надеемся, что это поможет расширить сообщество WebAssembly и поможет авторам спецификаций как трамплин, когда это в конечном итоге будет предложено для спецификации WASI. 🙌
Опять же, мы хотели бы повторить итерацию, это экспериментальная функция, которая не стандартизирована. Устройства ввода-вывода предназначены для экспериментов со сборкой автономных модулей WebAssembly, чтобы заглянуть в будущее, когда в спецификации WASI может быть стандартизованная функция для этого типа функциональности. Поскольку эта идея является важной частью веб-платформы, как подчеркивается в лекции Пола Льюиса Custom Web Shadow Elements, or Anything… ».
Чтобы начать работу с устройствами ввода-вывода, в последней версии Wasmer появился новый флаг: --enable-experimental-io-devices.
Устройства ввода-вывода имеют собственный пакет Wasmer-JS, @wasmer/io-devices. Пакет устройств ввода-вывода используется в пакете @wasmer/wasm-temrinal и WebAssembly.sh для поддержки устройств ввода-вывода по умолчанию.
Затем вы можете попробовать модуль Wasm, который использует устройства ввода-вывода, например WasmBoy на WAPM, или создать модуль Wasm на Rust или AssemblyScript, используя экспериментальную Библиотеку устройств ввода-вывода. 🦀🚀
Спасибо, что прочитали эту статью! Не стесняйтесь открывать вопросы, присылайте нам идеи или присылайте нам свои крутые проекты! Мы рады помочь сообществу, чем можем! Ваше здоровье! 🍻
