Преимущества использования WebAssembly для ваших приложений

20 декабря 2022 г.

В настоящее время веб-разработчики обычно используют JavaScript (JS) для написания внешнего интерфейса веб-приложений. Или они прибегают к языку, такому как TypeScript, который они должны скомпилировать в JS, прежде чем браузер сможет его выполнить. В отличие от TypeScript, JS является стандартом консорциума World Wide Web (W3C) наряду с HTML и CSS.

В декабре 2019 года стандарт W3C утвердил четвертый официальный язык: WebAssembly (Wasm). Этот язык значительно отличается от предыдущих языков в отношении структуры, использования и возможностей.

Самое главное, Wasm — это не язык программирования в традиционном понимании. Вместо этого это двоичный формат, который позволяет разработчикам программного обеспечения писать веб-приложения на языках по своему выбору. Эти языки включают C, C++, Rust, C# или, теоретически, любой язык программирования, который включает необходимые инструменты для компиляции исходного кода в Wasm.

Однако Wasm предназначен не только для того, чтобы дать разработчикам возможность писать веб-приложения на их любимом языке. Кроме того, речь идет о том, чтобы предложить конечным пользователям высокопроизводительное программное обеспечение без дополнительных загрузок или установок.

Разработчики JS могут писать более производительный и относительно безопасный код, чем это было возможно ранее. В то время как TypeScript и другие сопоставимые надмножества языков JS помогали создавать безопасный код, мало влияли на производительность.

Прежде чем углубляться в то, что такое WebAssembly, стоит отметить, что, хотя название подразумевает язык ассемблера, на самом деле он предоставляет низкоуровневые языки, подобные языкам ассемблера, и двоичный формат, поддерживаемый современными веб-браузерами. Разработчикам не нужно писать его вручную, но они могут использовать его в качестве цели компиляции для программ, написанных на любом предпочитаемом языке.

Что такое WebAssembly?

Давайте начнем с определения WebAssembly и краткой истории этой технологии.

В 2015 году Брендан Эйх, создатель JavaScript и соучредитель Mozilla, объявил о начале кроссбраузерная разработка на WebAssembly. Эта технология в конечном итоге станет лучшей альтернативой JS в качестве цели компилятора. WebAssembly версии 1.0 был запущен в 2017 году, а W3C утвердил его в качестве стандарта в 2019 году.

WebAssembly — это свободно доступный общедоступный стандарт реализации, который позволяет выполнять низкоуровневый двоичный код в Интернете. Разработчики могут использовать эту технологию (также известную как формат двоичного кода), чтобы обеспечить производительность C, C++, Rust и подобных языков для веб-программирования. Это обычно используется в браузерах для быстрых вычислений.

Иными словами, это формат файлового объекта, который является безопасным и переносимым. И он выполняется с той же скоростью, что и нативный код, благодаря надежной оптимизации формата. Это означает, что любой язык, который компилируется в этот формат, должен работать в браузере. Как заявил создатель JS, это делает WebAssembly бинарным форматом для полиглот-программирования язык для Интернета.

В компилируемых языках, таких как C, объектный файл – это файл создается после завершения компиляции исходного кода. Его основная цель — обеспечить производительность, близкую к нативной, при сохранении совместимости с текущей средой веб-разработки.

Благодаря совместным усилиям Google, Microsoft, Mozilla и некоторых других компаний Wasm теперь поддерживается Chrome, Firefox, Safari и Edge.

Asm.js и Wasm

Когда дело доходит до любой проблемы разработки программного обеспечения, разработчики постоянно пытаются найти решение. Обеспокоенное производительностью веб-приложений в браузерах, сообщество создало asm.js, подмножество JS, предназначенное для выполнения компьютерное программное обеспечение в виде веб-приложений. Это было написано на таких языках, как Rust, с более высокой производительностью, чем обычный JavaScript.

Asm.js — это ограниченное подмножество JS. Компилятор, такой как Emscripten, преобразует код, написанный на языки со статической типизацией в Asm.js. Появление Wasm, в котором используется более быстрый формат синтаксического анализа и сжатия, заменило его и усилия по расширению JS дополнительными низкоуровневыми функциями, такими как SIMD.js, срок действия которого истек в 2017 году.

Благодаря программному обеспечению преобразования, созданному организацией WebAssembly, asm.js остается полезным в качестве запасного варианта для Wasm.

Когда и где использовать Wasm

Есть два общих сценария, в которых разработчики могут захотеть использовать Wasm.

Во-первых, это веб-разработчик, который хочет писать более производительный код.

Другой — как разработчик программного обеспечения, который хочет использовать имеющиеся навыки работы с другими языками программирования (такими как C++ или Rust) для создания программного обеспечения, которое работает в Интернете и доступно для пользователей через веб-браузеры без необходимости дополнительных шагов, таких как загрузка и установка программ.

Хотя в первом сценарии разработчикам по-прежнему придется использовать JavaScript, они также могут использовать Wasm для создания элементов, требующих скорости, близкой к естественной, например модули и загрузить их с помощью JS. Это связано с тем, что возможность двунаправленной связи между модулями JS и WebAssembly позволяет приложениям использовать превосходную производительность WebAssembly.

Разработчики могут продолжать использовать популярные библиотеки пользовательского интерфейса, такие как React, для создания пользовательского интерфейса веб-приложений и косвенно использовать Wasm для высокопроизводительной внутренней логики. Популярные приложения, такие как Figma, переняли эту технику с помощью React и C++.

Как отметил Брендан Эйх, тот факт, что Wasm в конечном итоге позволит компилировать множество различных языков для Интернета, не повлияет на продолжающееся доминирование JS. Разработчики чаще комбинируют JS и Wasm различными способами, чем полностью отказываются от JS.

Во втором сценарии разработчики могут использовать такие языки, как Rust, C++ или C#, с Blazor для написания веб-приложений. Или даже спроектируйте игру на C# и легко скомпилируйте ее в Wasm, а затем предложите потребителям через Интернет.

Такие инструменты, как Emscripten, генерирующий короткий и быстрый код, используют Wasm в качестве выходного формата. Это компилятор для WebAssembly, использующий LLVM, с упором на скорость, малый размер и веб-совместимость.

Реальные кодовые базы, в том числе коммерческие, такие как Unreal Engine 4 и Unity, уже использовали Emscripten для преобразования своих кодовых баз в Wasm.

Разработчики должны использовать Emscripten с приложением C или C++. Для Rust разработчики могут использовать wasm-pack.

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

В исключительных случаях, например при разработке специальных инструментов, таких как компиляторы, разработчикам может потребоваться вручную написать весь код на Wasm.

Вкратце, разработчики могут использовать Wasm следующими способами:

• Помимо JS, разработчики могут писать критически важный для производительности код на Wasm и импортировать его с помощью JS.
• Разработчики могут использовать Wasm в качестве цели компиляции, которая позволяет другим языкам программирования писать код, работающий в Интернете.

WebAssembly предназначен не только для браузеров. Разработчики также используют его на серверах с Node.js, смартфонах и пограничных средах, таких как Воркеры Cloudflare.

Запуск Wasm вне браузера

WebAssembly, как следует из названия, должен работать в браузерах. Однако разработчики могут использовать его как в Интернете, так и за его пределами.

Wasm может работать в браузерах и на серверах с Node.js и виртуальными машинами или средами выполнения Wasm. Разработчики могут использовать среду выполнения Wasm для запуска Wasm в не-веб-среде с помощью системного интерфейса WebAssembly (WASI).

Возможности его применения в несетевых средах варьируются от блокчейна в качестве среды выполнения смарт-контрактов до приложений, работающих на устройствах IoT, мобильных и настольных приложений, серверов или в качестве исполняемого файла в больших программных системах.

Для справки, вот список сред выполнения WebAssembly.

Написание Wasm

WebAssembly поддерживает текстовый формат WebAssembly (WAT) и двоичный формат. Хотя WAT – это текстовый формат, достаточно простой для чтения и записи, браузер выполняет его двоичный формат.

А что, если веб-разработчик хочет написать Wasm, не прибегая к другим языкам программирования, таким как Rust, для компиляции в Wasm? Разработчики могут либо написать WAT вручную, что требует высокой кривой обучения, поскольку в нем отсутствуют высокоуровневые абстракции, такие как операторы if и циклы for. Или используйте AssemblyScript, который является отличным подходом к написанию кода, если вы уже знакомы с TypeScript. Это связано с тем, что AssemblyScript на самом деле напоминает TypeScript, что позволяет разработчикам работать с более привычным синтаксисом.

Помимо использования AssemblyScript, существует множество способов создания двоичных файлов Wasm, таких как написание WebAssembly вручную и преобразовать его в двоичный файл с помощью таких инструментов, как wabt.

Создание веб-приложений

Существует множество наборов инструментов для разработки веб-приложений с помощью Wasm. Некоторые примеры включают Blazor, тис и Кузница.

Blazor, например, позволяет разработчикам использовать C# вместо JavaScript для создания интерактивных пользовательских веб-интерфейсов. Приложения Blazor — это повторно используемые компоненты пользовательского веб-интерфейса C#, HTML и CSS. Код клиента и сервера написан на языке C#, что позволяет совместно использовать код и библиотеки.

Заключение

Вот краткий обзор преимуществ WebAssembly:

* Это веб-стандарт W3C. Его поддерживают все основные веб-браузеры. * Это более безопасно, чем JavaScript. * Он портативный, поскольку основан на веб-браузерах. * Он работает почти на исходной скорости и использует файлы небольшого размера из-за своего двоичного формата. * Нет необходимости изучать новый язык программирования. Теоретически разработчики могут использовать любой язык программирования, который может компилировать код в Wasm. * Он универсальный. Разработчики могут использовать его в качестве среды выполнения для различных платформ, отличных от Интернета.

Подводя итог, можно сказать, что WebAssembly может сосуществовать с движком JS, управляющим веб-браузерами.

Разработчики могут компилировать другие языки программирования высокого уровня, такие как Rust, C и C++, в Wasm для повышения производительности благодаря низкоуровневому двоичному формату.

За исключением нескольких случаев, например при разработке компилятора, разработчикам не нужно писать WebAssembly. Вместо этого они могут использовать его как цель компиляции.

Благодаря Wasm Интернет, и в первую очередь его внешний интерфейс, стал мощной платформой для запуска всех типов высокопроизводительных программ, таких как 3D-игры и программное обеспечение для обработки видео. Однако это не означает, что WebAssembly в конечном итоге заменит JS для разработки веб-приложений, но это отличный инструмент для оптимизации веб-производительности.

Если вы ищете простой способ начать работу с Wasm, попробуйте ComponentOne с Blazor.

ComponentOne, Blazor Edition — это набор элементов управления Blazor UI, предоставляемых ComponentOne. Подробнее см. в демонстрациях и документация.

:::информация Также опубликовано здесь.

:::

---

Оригинал