Обновить
8K+

WebAssembly *

Низкоуровневый байт-код для исполнения в браузере

0,75
Рейтинг
Сначала показывать
Порог рейтинга
Уровень сложности

Компилятор WebAssembly, который помещается в один твит

Уровень сложностиСредний
Время на прочтение11 мин
Охват и читатели21K

▍ Введение


Наш первый «компилятор WebAssembly в твите» имел длину 269 байт; с тех пор мы смогли снизить её всего до 192 байтов.

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

let c=(b,l)=>WebAssembly.instantiate(new Int8Array(
[,97,115,109,1,,,,1,5,1,96,,1,127,3,2,1,,7,4,1,,,,10,
l=(b=b.split` `.flatMap(t=>t>-1?[65,t]:107+'-*/'.indexOf(t)))
.length+4,1,l-2,,...b,11]))

А вот пример его использования:

(await c('11 11 1 - + 4 * 2 /')).instance.exports['']()

Но это не просто хитрый трюк — если вы начнёте разбираться, как работает этот код, то на удивление много узнаете о WebAssembly! В этом посте мы объясним, как это всё работает, пошагово деобфусцируя код.
Читать дальше →

Веб-приложения будущего: что нужно знать о WebAssembly

Уровень сложностиПростой
Время на прочтение8 мин
Охват и читатели50K


Часто при разговоре о веб-разработке на ум приходят JavaScript и различные фреймворки. Но что, если бы веб-приложения могли запускаться с той же производительностью, что и нативные, а разработчики могли бы писать их на Rust, C++ или Go? Вот тут-то на сцену и выходит WebAssembly (Wasm) — инструмент, который позволяет взглянуть на веб-разработку иначе. Он открывает возможности для выполнения сложных вычислений, запуска игр, виртуальных машин и приложений для анализа данных прямо в браузере. Все это — с высокой производительностью и кроссплатформенностью, от настольных компьютеров до мобильных устройств.

В этой статье разберемся, как работает WebAssembly, чем он привлекает разработчиков и какие проблемы решает. Вы узнаете, почему его активно поддерживают такие компании, как Google, Unity и Unreal Engine, и какие перспективы открывает Wasm для будущего веб-разработки. Подробности под катом!
Читать дальше →

Используем всю мощь JavaScript для написания счётчика. Разбор от Олега Иванова, фронтенд-разработчика WMT Group

Уровень сложностиСредний
Время на прочтение11 мин
Охват и читатели17K

Приветствуют читателей Хабра. Меня зовут Олег Иванов, последние пару лет являюсь фронтенд-разработчиком в ит-компании WMT Group. На разных этапах работы я сталкивался с , нашел способ упросить . В этой статье не будет серьёзных рассуждений, глобальных задач и историй успеха. Скандалов, интриг и расследований из глобального ит-мира тоже не планируется.

Вместо этого мы напишем функцию-счётчика на JavaScript. Несколько раз, причём всякий раз по-разному с пользой.

Казалось бы, задача простейшая, даже старый-добрый to-do list куда сложнее и заковыристее. Предложение написать функцию-счётчика на собеседованиях уже классика, которая делается на автомате. Уверен, что большинство опытных воинов фронтенда либо помнят традиционное решение, либо по памяти накатают его в течение 30 секунд. Традиционно эту задачу решают замыканием. Однако, почему именно им? А если попробовать сделать это как-то иначе? Я попробовал и реализовал счётчик несколькими разными (подчас неочевидными) способами, попутно спросив совета у нейросетей, а также подключив тяжёлую артиллерию в лице Babel, TypeScript и даже WebAssembly. Давайте посмотрим, что получилось!

Читать далее

Flutter 3.27 — Что нового во Flutter?

Уровень сложностиСредний
Время на прочтение16 мин
Охват и читатели7.1K

Давайте погрузимся в Flutter 3.27! Этот релиз полон улучшений и функций, направленных на улучшение вашего опыта разработки и повышение производительности вашего приложения.

Читать далее

Dioxus 0.6

Время на прочтение21 мин
Охват и читатели6.6K

Значительное улучшение инструментария: эмуляторы для мобильных устройств, магический Hot-Reloading, интерактивный CLI, и многое другое!

Читать далее

Запускаем 8B LLM в браузере: AQLM.rs

Время на прочтение4 мин
Охват и читатели27K

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

В этом посте я расскажу о своём пет‑проекте AQLM.rs. Я написал инференс модели Llama 3.1 8B, работающий в браузере на WebAssembly без использования GPU, с помощью алгоритма сжатия, разработанного нашей лабораторией.

Попробовать можно на сайте проекта, подробности под катом.

Читать далее

Ускоряем браузерные вычисления на коленке с помощью WebAssembly на примере генерации шума

Уровень сложностиСредний
Время на прочтение7 мин
Охват и читатели5.9K

Так ли производителен WebAssembly в сравнении с JavaScript как о нем говорят? Какие подводные камни могут ожидать при попытке ускорить CPU-bound задачи и в каких ситуациях он must have? Автор предлагает рассмотреть один кейс и разобраться в этих вопросах на практике

Приступим

Как в цифровом мире безопасно рассказать информацию не выдавая себя?

Уровень сложностиСредний
Время на прочтение5 мин
Охват и читатели18K

К примеру контрибьютер опенсорс проекта хочет рассказать о планах но при этом остаться анонимным.

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

Или просто какая-то тема запрещена для обсуждения которую очень хочется обсудить.

Как же быть? Использовать кольцевые подписи!

Читать далее

Как мы перенесли распознавание на базе ИИ в веб и изменили веб-банкинг? А в Markswebb это оценили

Уровень сложностиПростой
Время на прочтение7 мин
Охват и читатели3K

Привет, Хабр! Недавно аналитическое агентство Markswebb выкатило ежегодный рейтинг лучших веб-версий банковских приложений в 2024 году. Эксперты сравнили удобство и функциональность использования банковских услуг в браузере и выбрали банки с лучшими веб-приложениями по качеству клиентского опыта. Лидирующие позиции в обеих номинациях рейтинга - «Цифровой офис» (Digital Office) и «Цифровой банк для повседневных операций» (Daily Banking) - заняли наши клиенты!

Достичь крутых результатов удалось в том числе благодаря использованию систем распознавания Smart Engines. Рассказываем, как наши ИИ-решения помогли ведущим банкам поставить новые рекорды в сфере цифрового гостеприимства. 

Добро пожаловать!

Блеск и нищета WebAssembly

Уровень сложностиСложный
Время на прочтение20 мин
Охват и читатели23K

Всем привет! Сейчас за окном осенние деньки 2024 года. Вещает Пройдаков Евгений. Сейчас я руковожу группой разработки среды исполнения языка eXtraction and Processing в R&D департаменте Positive Technologies.

Доменно специфичный язык eXtraction and Processing является важной частью движка поведенческого анализа, используемого в таких продуктах Positive Technologies, как MaxPatrol SIEM и PT ISIM. Сегодня хотелось представить вашему вниманию выжимку нашего R&D процесса в экспериментах с WebAssembly.

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

Кроме того, мы разберем некоторые проблемы, которые могут появиться у вас при попытке собрать и отладить большой С++ проект под WebAssembly. Материал может быть особенно полезен тем, кто хочет использовать WebAssembly за пределами веб‑браузера.

Более подробно про сам язык eXtraction and Processing можно почитать в прошлой статье цикла от моего коллеги Михаила Максимова.

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

На старт, внимание, поехали!

Обзор Kwasm — оператора для запуска WebAssembly-приложений в кластере Kubernetes

Уровень сложностиПростой
Время на прочтение4 мин
Охват и читатели2.4K

Продолжаем обозревать инструменты, которые позволяют использовать WebAssembly-приложения в кластере Kubernetes. В этот раз пробуем оператор Kwasm: установим его в кластер, развёрнутый с помощью kind, и запустим тестовое приложение.

Читать далее

Как построить мост между JavaScript и C++ через WASM, или гайд для самых маленьких

Уровень сложностиПростой
Время на прочтение11 мин
Охват и читатели12K

Всем привет. Сегодня я хочу рассказать об использовании WASM с C++ и разберу, как взаимодействовать с этим всем делом через JavaScript.

Материал предназначен для новичков в данной теме.

Читать далее

Новый AI UI дизайнер для «Silverlight» приложений

Уровень сложностиПростой
Время на прочтение4 мин
Охват и читатели3.9K

Мы занимаемся разработкой фреймворка OpenSilveropensource наследника платформы Silverlight. В версии 3.0 мы добавили современный UI дизайнер в Visual Studio расширение и сделали веб-версию дизайнера.

Читать далее

Ближайшие события

Машинное обучение в браузере

Время на прочтение9 мин
Охват и читатели11K

Меня зовут Алексей, сегодня мы с вами поговорим, как можно ускорить вычисления машинного обучения веб приложения с помощью WASM, WebGL или WebGPU.

Когда фронтенд‑разработчик слышит о машинном обучении в браузере, первое, что приходит ему на ум, это вопрос: «Как это может быть применено? Мы же работаем в браузере на JS, который, как известно, медленный (по сравнению с компилируемыми языками)».

Читать далее

Анонс Dart 3.4

Время на прочтение4 мин
Охват и читатели2.6K

Dart 3.4 вышел сегодня! Этот релиз демонстрирует совместные усилия Dart и Flutter в посте Flutter 3.22 / Dart 3.4 / IO24, так что обязательно ознакомьтесь с полной информацией там. В этом посте мы расскажем о поддержке WebAssembly, а затем подробно остановимся на одном из основных пунктов дорожной карты для языка Dart на этот год: макросы.

Автор: Michael Thomsen

Ура, анонс!

Смарт-контракты на WebAssembly: зачем это надо и как работает

Уровень сложностиСредний
Время на прочтение10 мин
Охват и читатели4.1K

В последнее время многие блокчейн-платформы для исполнения смарт-контрактов переключились на WASM — WebAssembly. Мы не стали исключением, и в последнем обновлении тоже добавили WebAssembly как альтернативу привычному Docker. В этом посте мы расскажем, для каких задач нам потребовался именно WASM, что мы достигли с ним на сегодня и как WASM отражается на производительности блокчейна.

Читать далее

Wasm vs Docker containers vs Kubernetes vs serverless: битва за первенство

Уровень сложностиПростой
Время на прочтение12 мин
Охват и читатели16K

В начале года на YouTube-канале DevOps Toolkit вышло видео с разбором WebAssembly. Автором ролика является Виктор Фарчич (Viktor Farcic) — developer advocate в Upbound, член CNCF Ambassadors, Google Developer Experts, CDF Ambassadors и GitHub Stars.

Мы перевели видео про WebAssembly в текстовый формат и адаптировали для лучшего понимания. В нём автор разбирает, что такое WebAssembly, стоит ли использовать его в браузерах и кластерах Kubernetes или вообще заменить Kubernetes и прочее.

Читать далее

Angular на стероидах: наращиваем производительность при помощи WebAssembly

Время на прочтение9 мин
Охват и читатели5.1K
В этом посте продемонстрировано, как с лёгкостью использовать WebAssembly внутри приложения, написанного на Angular. Иногда в приложении на Angular требуется выполнить задачу, которая в JavaScript завершается не слишком быстро. Конечно, можно переписать алгоритм на другом языке, например, AssemblyScript и Rust — и код станет эффективнее. Затем можно скомпилировать получившиеся фрагменты кода в файле WASM и потоком передать двоичные данные в приложение, чтобы можно было вызывать из него функции WASM. Бывает и так, что разработчику не удаётся найти в реестре NPM опенсорсные библиотеки, нужные для решения задачи. В таком случае можно написать пакет не на JS, а на каком-нибудь другом языке, затем скомпилировать этот пакет в WASM и опубликовать код WASM в реестре NPM. Angular-разработчики устанавливают новый пакет как зависимость и выполняют WASM-функции внутри приложения.

В следующем демонстрационном примере я напишу на AssemblyScript несколько функций для работы с простыми числами, а затем опубликую файл индекса в формате WASM. Затем скопирую файл WASM в приложение Angular, потоком отправлю двоичные данные через WebAssembly API и, наконец, стану вызывать эти функции, чтобы с их помощью выполнять различные действия над простыми числами.
Читать дальше →

Настраиваем минимальный WEB-сервер на Repka Pi 3. NGINX + PHP-FPM + MySQL и ставим Wordpress

Уровень сложностиСредний
Время на прочтение10 мин
Охват и читатели9.6K

В этой статье я расскажу как установить на Repka Pi 3 полноценный WEB сервер на Nginx с php-fpm и MySQL для того, чтоб в конечном счете установить WordPress и начать делать и размещать Ваш сайт на данной платформе. Ставить будем на родную ОС Repka Pi от 11.12.23 (последняя актуальна прошивка на момент написания статьи).

Читать далее

Dart 3.3 — что нового в Dart?

Уровень сложностиСредний
Время на прочтение7 мин
Охват и читатели4.9K

Статья представляет из себя композицию нескольких авторских переводов статей от лица команды разработчиков Dart/Flutter, ссылки на оригинальные материалы будут даны в конце статьи.

Читать далее