WebAssembly - Работа с Node.js
Здравствуйте, стремящиеся к программированию! Сегодня мы отправимся в увлекательное путешествие в мир WebAssembly и Node.js. Не волнуйтесь, если эти термины кажутся вам инопланетными языками - к концу этого руководства вы будете говорить на них свободно!
Что такое WebAssembly?
WebAssembly, часто сокращаемое до Wasm, является супергероем в мире программирования. Это двоичный формат инструкций, который позволяет коду, написанному на языках, таких как C, C++ и Rust, работать в веб-браузерах с了近-native скоростью. Представьте себе возможность играть в сложные 3D-игры прямо в браузере - это та сила, которую WebAssembly привносит в дело!
Зачем Node.js?
Теперь вы можете задаться вопросом: "Что Node.js имеет общего со всем этим?" Ну, Node.js - это как команда за кулисами, которая делает магию возможной. Это среда выполнения JavaScript, которая позволяет нам запускать JavaScript за пределами веб-браузера. Когда мы combine WebAssembly с Node.js, мы получаем лучшее из обоих миров - скорость WebAssembly и гибкость Node.js.
Настройка нашего окружения
Прежде чем окунуться в код, давайте настроим наше рабочее пространство. Не волнуйтесь, это проще, чем настроить новый смартфон!
- Установите Node.js с официального сайта (https://nodejs.org)
- Откройте ваш терминал или командную строку
- Создайте новую директорию для нашего проекта:
mkdir wasm-nodejs-tutorial cd wasm-nodejs-tutorial
- Инициализируйте новый проект Node.js:
npm init -y
Отлично! Теперь мы готовы начать программирование.
Ваш первый модуль WebAssembly
Давайте создадим простой модуль WebAssembly, который складывает два числа. Мы напишем его на C и скомпилируем в WebAssembly.
Шаг 1: Написание C кода
Создайте файл с именем add.c
и следующим содержимым:
#include <emscripten.h>
EMSCRIPTEN_KEEPALIVE
int add(int a, int b) {
return a + b;
}
Не паникуйте, если это выглядит как иероглифы! Давайте разберем это:
-
#include <emscripten.h>
включает библиотеку Emscripten, которая помогает нам компилировать C в WebAssembly. -
EMSCRIPTEN_KEEPALIVE
- это специальная директива, которая говорит компилятору сделать эту функцию доступной из JavaScript. -
int add(int a, int b)
- это наша функция, которая принимает два целых числа и возвращает их сумму.
Шаг 2: Компиляция в WebAssembly
Чтобы скомпилировать этот C код в WebAssembly, мы должны установить Emscripten. Следуйте инструкциям по установке на сайте Emscripten (https://emscripten.org/docs/getting_started/downloads.html).
Once installed, run this command:
emcc add.c -s WASM=1 -s EXPORTED_FUNCTIONS='["_add"]' -o add.js
Эта команда компилирует наш C код в WebAssembly и создает два файла: add.wasm
и add.js
.
Использование WebAssembly в Node.js
Теперь comes the exciting part - using our WebAssembly module in Node.js!
Create a file named index.js
with the following content:
const fs = require('fs');
const path = require('path');
const wasmBuffer = fs.readFileSync(path.join(__dirname, 'add.wasm'));
WebAssembly.instantiate(wasmBuffer).then(wasmModule => {
const add = wasmModule.instance.exports._add;
console.log('5 + 3 =', add(5, 3));
});
Давайте разберем это:
- Мы импортируем необходимые модули Node.js:
fs
для операций с файловой системой иpath
для работы с путями к файлам. - Мы читаем WebAssembly файл в буфер.
- Мы используем
WebAssembly.instantiate()
для загрузки и компиляции нашего WebAssembly модуля. - Once loaded, we can access our
add
function throughwasmModule.instance.exports._add
. - Finally, we call our function and log the result.
Запустите этот скрипт с помощью:
node index.js
Если все прошло правильно, вы должны увидеть: 5 + 3 = 8
Поздравления! Вы только что запустили свой первый модуль WebAssembly в Node.js!
Сравнение производительности
Теперь давайте сравним производительность нашей функции WebAssembly с natvie JavaScript функцией.
Добавьте это в ваш index.js
:
function jsAdd(a, b) {
return a + b;
}
const iterations = 1000000;
console.time('WebAssembly');
for (let i = 0; i < iterations; i++) {
add(5, 3);
}
console.timeEnd('WebAssembly');
console.time('JavaScript');
for (let i = 0; i < iterations; i++) {
jsAdd(5, 3);
}
console.timeEnd('JavaScript');
Этот код запускает как WebAssembly, так и JavaScript версии нашей функции сложения миллион раз и меряет, как долго это занимает.
Запустите скрипт снова, и вы, вероятно, увидите, что версия WebAssembly быстрее!
Заключение
Мы только что поцарапали поверхность того, что возможно с WebAssembly и Node.js. Представьте себе возможности - вы могли бы использовать сложные алгоритмы, написанные на C или Rust, игровые движки или даже целые приложения, все работающие с了近-native скоростью в Node.js!
помните, что обучение программированию похоже на обучение езде на велосипеде. Сначала это может казаться неустойчивым, но с практикой вы быстро научитесьzooming along. Continue experimenting, keep learning, and most importantly, have fun!
Вот таблица, резюмирующая основные методы, которые мы использовали:
Метод | Описание |
---|---|
WebAssembly.instantiate() |
Компилирует и инстанцирует модуль WebAssembly |
fs.readFileSync() |
Читает файл синхронно |
path.join() |
Объединяет сегменты пути |
console.time() |
Начинает таймер |
console.timeEnd() |
Останавливает таймер и логирует продолжительность |
Счастливого кодирования, будущие маги WebAssembly!
Credits: Image by storyset