Дыня, которая здесь не задрожала: читаем WebGPU-сборку на GLM-5.3-Flash

JACK GROSS · SOURCE REVIEW · 29 SEP 2026

Страница открывается как музейная карточка экспоната: огромным антиквенным шрифтом «Melon Jelly.», а под ним «A slice of summer. A little wobble. Too soft to share.» Справа рука, нож, три цветовых сорта и два ползунка. В центре, в браузере, который я могу проверить, дыни нет. На карточке написано «No WebGPU adapter was found.» С этой пустой сцены история и начинается честно: с того, что модель вложила в исходник, и с того, чего скриншот доказать не может.

HTML + CSS→SoftBody / XPBD→WebGPU→Проверка, которой можно доверять

Что я могу проверить

Страница Melon Jelly, которую я изучал, называет себя созданной с помощью Z.AI GLM-5.3-Flash. У меня есть развёрнутая страница и её исходник. Нет запроса, переписки, логов модели и истории сборки, поэтому я могу приписать создание этому описанию, но не могу подтвердить генерацию с одного раза и не знаю числа правок. Документация Z.AI называет модель и перечисляет входы: изображения, файлы и текст. Это контекст о продукте, а не свидетельство об этом проекте. По живому адресу отдаётся один HTML-документ в 175 592 байта со встроенным CSS, одним встроенным модульным скриптом и без внешних скриптов и стилей. Это наблюдение на уровне исходника, а не аудит безопасности. [source]

Механизм внутри файла

Этот ломтик больше, чем анимированная картинка. Исходник строит тетраэдральную сетку, распределяет массу по объёмам покоя и шагает SoftBody с фиксированным шагом 1/60 секунды и десятью подшагами. Каждый тетраэдр подтягивается к наилучшей повёрнутой форме покоя с членом податливости, а затем ограничение объёма подталкивает его к объёму покоя. Код добавляет коррекцию против выворачивания, более жёсткие области корки, демпфирование относительно рёбер и контакт с полом с трением. Музейная этикетка объясняет те же идеи словами. Реализацию можно читать, а численную устойчивость и физическую реалистичность чтением не установить. [source]

Почему резать труднее всего

В исходнике нож не декоративный переключатель. Мазок становится плоскостью лезвия, код делит выпуклый контур плоскости покоя и строит новые тетраэдральные куски. Он пытается перенести движение старого куска в новые, а не прячет половину сетки. Это более трудная задача непрерывности, чем красивая анимация разреза: новым телам нужны свои объёмы, привязка поверхности, столкновения и показания. В исходнике есть пути splitPiece и planCut/performCut, но на GPU я их не запускал. Строгий вывод требует повторяемого теста разреза, а не надписи в меню. [source]

Свет это половина истории

Освещение живёт в строках шейдеров WGSL и в коде рендера на WebGPU. Собственная панель методов страницы называет толщину по задним граням, преломление, поглощение цвета по закону Бера-Ламберта, молочное рассеяние, отражения Френеля и цветную тень на полу. Вершины поверхности, семечки и пузырьки привязаны к тетраэдрам барицентрическими весами, так что видимая кожа должна следовать симуляции. Это разделение на сетку симуляции и сетку отображения позволяет желе выглядеть гладким, не делая каждое семечко отдельной физической частицей. Это чтение архитектуры, а не измерение качества рендера. [source]

Чего скриншот доказать не может

Интерфейс обещает палитры Crimson, Golden и Rosé, упругость и демпфирование, флажок четверти скорости, каркас, толчок, паузу и показания массы, объёма, кинетической энергии и числа кусков. Исходник подключает эти элементы и выводит числа из состояния сетки в иллюстративном масштабе. В моём захвате запрос адаптера WebGPU не удался, запасной вариант отключил взаимодействие, а показания остались пустыми. Скриншот показывает сильное художественное решение и аккуратный путь ошибки, а не работающее дрожание. В браузере с GPU можно увидеть больше, но я не могу утверждать, что такая проверка здесь была. [source]

Тест, который заслужил бы вывод

Я запустил бы это на устройстве с WebGPU и записал версии браузера и GPU. Начать с успокоившегося ломтика и следить за дрейфом объёма, конечностью координат и временем кадра. Схватить кончик, отпустить и проверить, что энергия затухает, а тело не взрывается и не замирает. Разрезать корку под несколькими углами и убедиться, что число кусков, объём и масса согласованы, а поверхности разреза не проваливаются сквозь стол. Переключить четверть скорости и каркас, повторить после потери устройства и сравнить скриншоты при разных размерах окна. Если цель оценить генерацию моделью, а не только код, нужен журнал запросов и правок. [source]

Тихий герой это запасной вариант

Больше всего поражает сдержанность запасного варианта. Страница не подсовывает тихо статичную картинку, делая вид, что всё запустилось. Она говорит, что рендерер не работает. Эта сборка показывает, как артефакт, созданный с помощью модели, может уместить в одном файле дизайн интерфейса, физическую лексику, исполняемую структуру и честное сообщение об ошибке. Создала ли его GLM-5.3-Flash за один проход и ощущается ли физика верной под настоящей рукой, остаётся вопросом к журналу сборки и испытанию на GPU. [source]

Иллюстративная схема цикла

// Simplified map of the inspected loop, not a copied or run implementation.
const STEP = 1 / 60;
while (elapsed >= STEP && steps < 3) {
  for (let sub = 0; sub < 10; sub++) {
    integrate();
    constrainRotatedTetShape();
    constrainTetVolume();
    resolveGround();
  }
  elapsed -= STEP;
  steps++;
}
// Test real values and cuts on a WebGPU device before claiming stability.

Источники и происхождение: Melon Jelly source and live page · Z.AI GLM-5.3-Flash documentation. Разбор исходника, не подтверждённый лог генерации и не успешный GPU-тест.