Один из действительно замечательных аспектов работы инженером в AppsFlyer заключается в том, что вам предоставляется возможность постоянно исследовать новые технологии - даже если они не имеют прямого отношения к вашей сегодняшней работе или в настоящее время являются частью технологического стека. быть использованным. Так я пришел к WebAssembly и решил, что действительно хочу изучить его и узнать больше.
Так что на случай, если вы никогда не слышали о WebAssembly, кратко коснемся:
- Хорошо, - что это?
- Что мне нужно для его запуска?
- И в конце концов - как мне запустить его в браузере?
Итак, вы слышали о WebAssembly и взволнованы, потому что все говорят об этом и говорят, что это, по сути, будущее Интернета. За исключением того, что, помимо чтения нескольких сообщений в блоге и некоторой документации, вы действительно не знаете, что это на самом деле, вы не знаете, как запустить его на своем компьютере, и особенно не знаете, как запустить его на своем компьютере. браузер.
Не судите о платформе SaaS по ее обложке. Наша команда разработчиков глубоко разбирается в последних разработках систем. ›› Смотрите наши открытые роли
Для меня это было то же самое, поэтому я начал читать и пытаться настроить свою среду так, чтобы она работала, и пыталась понять ее лучше.
Во-первых, я должен сказать, по крайней мере, для меня - я действительно не нашел достаточно простого пошагового руководства, чтобы легко добраться до него. Вот почему я решил написать этот пост, и я постараюсь сделать все возможное, чтобы вы могли начать работу с WebAssembly и узнать о прекрасных преимуществах, которые он предоставляет.
Я расскажу вам о некоторых основных концепциях, таких как настройка вашей среды, так что, когда вы закончите читать этот пост, у вас будет достаточно базовых знаний, чтобы знать, что такое WebAssembly, и иметь базовую настройку на простом рабочем примере.
В этом посте я решил использовать язык программирования Rust для запуска нашего примера, но имейте в виду, что это был мой выбор, и нет никаких ограничений на использование другого языка, который поддерживает компиляцию в WASM.
Фото focusblurred на flickr
Если вы не можете объяснить это просто, значит, вы недостаточно хорошо это понимаете. ~ Альберт Эйнштейн
Что такое WebAssembly?
WebAssembly (WASM, WA) - это веб-стандарт, который определяет двоичный формат с соответствующим текстовым форматом, подобным сборке, для исполняемого кода на веб-страницах. Подробнее об этом можно прочитать здесь.
Ассемблерный код относится к коду, который написан людьми, где ассемблерный код преобразуется в исполняемый машинный код служебной программой, называемой ассемблером. Процесс преобразования называется сборкой или сборкой исходного кода.
WebAssembly позволяет вам взять такие вещи, как C / C ++, Rust, Go или любой другой поддерживаемый код, и скомпилировать его в так называемый модуль WebAssembly. Вы можете загрузить это в свое веб-приложение и вызвать его из JavaScript.
WebAssembly имеет текстовый формат, который легко читать (.wat), но двоичное представление - это то, что вы фактически доставляете в браузер (.wasm).
Вы можете начать писать код в формате WAT:
Хотя я не думаю, что вам захочется начинать писать такой код, когда можно написать что-то более читаемое. См. Приведенный ниже пример использования Rust для доставки того же кода с той же функциональностью, создания простой программы с функцией:
Еще один важный аспект - поддержка, WebAssembly поддерживается всеми основными браузерами.
Итак, зачем нам WebAssembly?
Неважно, насколько мы любим JavaScript, есть действия, в которых JS менее силен, и именно здесь на помощь приходит WebAssembly. Одна из основных целей WebAssembly - обеспечить лучшую переносимость, скорость и гибкость.
- Скорость. Двоичные файлы намного меньше текстовых файлов (файлов JavaScript) и из-за их размера загружаются быстрее.
- Переносимость - с WebAssembly у нас есть только один этап компиляции, не нужно заботиться о разных операционных системах, потому что ваше приложение будет работать в браузере.
- Гибкость. До сих пор для написания веб-приложений вам приходилось использовать JavaScript. С WebAssembly вы можете выбрать Java, Rust и многие другие поддерживаемые языки.
Помните, что WebAssembly не заменяет JavaScript, это новый партнер, который будет работать вместе с ним.
Итак, как вы используете WebAssembly?
Теперь пришло время, которого все ждали, как писать / компилировать и запускать WebAssembly.
Для этого есть несколько вариантов:
- Без какой-либо настройки, то есть вы можете использовать онлайн-инструменты для написания и компиляции кода.
- Настройте свою среду, здесь у вас есть несколько вариантов в зависимости от того, какой язык вы хотите использовать. Я упомянул несколько, но помните, что их гораздо больше.
Вот список языков, поддерживающих компиляцию в WASM.
- LLVM - Возможность настройки для работы с разными языками.
- Emscripten - C / C ++
- Rustc - Ржавчина
Вариант 1 (настройка не требуется)
1. Откройте webassembly.studio.
2. Что у нас здесь:
main.rs
- Это простой файл, написанный на «Rust», где код экспортирует общедоступную функцию, которая получает одно число для ввода и возвращает результат добавления «1» к переданному вводу.
- no_mangle extern «C» - функции используются для экспорта их как общедоступных из ящика (модуля ржавчины) с целью связывания с другими библиотеками
- Этот код будет скомпилирован в файл «wasm», то есть фактический файл, который будет загружен в браузер.
main.js
- Это дополнительный простой файл, написанный на «JS», где код извлекает скомпилированный файл типа «wasm».
- Загруженный файл ответов преобразуется в arrayBuffer, а затем инициализирует объект WebAssembly с помощью WebAssembly.instantiate, в этом объекте у нас есть экспортированные функции instance.exports.myFunc.
main.html
- Файл «HTML», загружающий файл «JS».
- Чтобы запустить его, нажмите кнопку «Сборка», а затем кнопки «Выполнить» соответственно.
Вариант 2 (требуется настройка)
Этот пример предоставляет несколько способов запустить пример в вашей локальной среде, а также языки на выбор. Я снова выбрал Rust (и вы можете найти здесь отличное руководство для Rust Setup), но не стесняйтесь выбирать свой любимый язык для работы.
В моем случае я использовал вариант установка с помощью Docker.
Для начала вам понадобится файл «Rust», который я использовал в этом примере:
После его компиляции вам понадобится такой HTML-файл:
- После запуска «HTML» и если все пойдет по плану, вы увидите это в браузере:
Надеюсь, я немного прояснил, что такое WebAssembly и как с ним поиграться.
Использование языка высокого уровня, такого как Rust или Java, открывает для нас множество вариантов, а также множество вариантов использования, к которым это можно применить, например:
- Инструменты для редактирования видео / аудио
- Инструменты для потоковой передачи видео / аудио
- Игры
- Видео / аудио звонки
- Виртуальная / дополненная реальность
- Искусственный интеллект
Наслаждаться!