Рубрика «WebGL»

Конвертируем цвета в JS со скоростью 6 миллиардов операций в секунду

В начале этого года я создал @colordx/core, самую быструю JS‑библиотеку для работы с цветом: парсинг различных форматов, конвертация в OKLAB/OKLCH, проверка попадания в P3-гамут и многое другое. Библиотека весит всего 7 КБ и не имеет внешних зависимостей. Высокую скорость обеспечили оптимизации под V8: мономорфизм, скрытые классы, ноль лишних аллокаций.

Читать полностью »

Меня не устраивало, что мой мини-ПК на Windows 11 с AMD Ryzen 7 7735HS (8 ядер, 16 потоков) и 32 ГБ DDR5 (в одноканальном режиме) компилирует WebGL для яндекс игр в полтора раза дольше, чем MacBook Air M1 с 16 ГБ.

Эта статья о том, как получить двойную скоростью без апгрейда комплектующих! От создания флешки до первого билда с использованием tmpfs и символьных ссылок Symlinks (для одновременной работы над несколькими проектами).


Шаг 1. Подготовка и правильная запись ISO-образа

Для миграции был выбран дистрибутив CachyOSЧитать полностью »

Уж казалось бы, онлайн гляделок dxf — пруд пруди. Но кто сталкивался с удивительным форматом dxf, знают — сколько вьюеров, столько и вариантов отображения. К тому же, большинство таких гляделок используют бэкенд для рендера. Но зачем, неужели так сложно отобразить 2D‑чертёж в браузере? Насколько это может быть сложно?

Читать полностью »

Привет. Я пресс атташе команды ГИГАХРУЩ — браузерный survival horror / ARPG shooter про вылазки внутри безграничной бетонной структуры.

Да, звучит как питч из папки после этого меня точно забанят, поэтому начну с технической части. Это не Unity WebGL, не Phaser, не Godot export, не React‑обвязка вокруг canvas и не набор купленных ассетов. Игра собрана как один браузерный билд на TypeScript/Vite, WebGL/canvas, процедурных текстурах, процедурных спрайтах, процедурном звуке и плоских структурах данных.

Читать полностью »

Хочу рассказать о генераторе GLSL-кода для WebGL, позволяющем писать шейдеры буквально на JavaScript с некоторыми условностями, используя все удобства IDE, такие как рефакторинг, подсветка синтаксиса, автокомплит и проверка на ошибки, а в математических выражениях использовать обычные JS операторы: +, -, *, /, =, +=, -=, *=, /=, ++, --.

Сразу приведу пример рабочего кода, чтобы было понятно, о чем идет речь:

Читать полностью »

Читать полностью »

Хотя я немного разочаровался в web-движке PlayCanvas, после того как его апгрейды поломали мне первый диаблоид - для каких-то очень маленьких легковесных игр он остаётся достаточно хорош. Поэтому для разнообразия реанимировал аккаунт и немного погрузился в программирование на js, написав аркаду (с механикой что-то вроде специфического урезанного BattleCity, но на сфере), где инопланетный космический кораблик летает над некоей планеткой.

Nanoplanet

Orange Pi 5 Plus 32GB

Производительность ARM процессоров каждый год увеличивается и все ближе приближается к x86 процессорам. Компания Apple давно отказалась от процессоров Intel в пользу процессоров собственной разработки на ARM архитектуре. Но домашний/офисный ПК это не только процессор, но и софт, драйвера, и подключение любых устройств из коробки. Компания Shenzhen Xunlong Software вначале 2023 г. выпустила одноплатный компьютер Orange PI 5 Plus на базе высокопроизводительного процессора Rockchip RK3588 с 32 ГБ ОЗУ и возможностью подключения NVMe SSD дисков. По техническим характеристикам такой одноплатный компьютер сопоставим с домашним/офисным ПК. Проверим на сколько комфортно работать за таким одноплатником, смотреть YouTube, видео, и конечно же поиграем, установим Steam от Valve. Но самое главное оценим работу системы «из коробки» т.е. без танцев с бубном. Вначале рассмотрим характеристики Orange PI 5 Plus, затем процессор Rockchip RK3588, установку и настройку системы, подключение периферийных устройств, и посмотрим, на сколько хорош Linux на ARM для домашнего использования. В итоге рассмотрим какие существуют преграды замены текущих x86 систем на ARM.
Читать полностью »

Фото Алексея Румянцева

Фото Алексея Румянцева

Читать полностью »

Задавались ли вы когда-нибудь вопросом, можно ли выйти за рамки привычных трёх измерений? Мы привыкли видеть мир в 3D: кубы, сферы, пирамиды — все эти объекты легко вообразить и визуализировать. Но что, если мы попробуем заглянуть в четвёртое измерение? Это звучит как научная фантастика, но в мире математики и компьютерной графики всё возможно.

Сегодня я расскажу вам, как создать интерактивный гиперкуб, или тессеракт — четырехмерный аналог обычного куба. Мы будем использовать Three.js, популярную библиотеку для работы с 3D-графикой в браузере.

Почему гиперкуб?

Читать полностью »


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js