Alfais Adilkhan
Кейс

Этот сайт

Портфолио на WebGPU: покрытая инеем Земля, которую стирает курсор, колонка текста поверх мира и финал на орбите. Одна траектория камеры, одно значение прокрутки, без склеек.

2026

Меньше 8 МБ на критическом пути, меньше 300 вызовов отрисовки

Роль

Дизайн, код и тексты. Один человек.

Результат

  • Критический путь меньше 8 МБ
  • Меньше 300 вызовов отрисовки во всех шести разделах
  • Режим уменьшенного движения и управление с клавиатуры с самого запуска

Условия

  • Шесть цветов, жёсткий лимит; один акцент в кадре
  • Меньше 300 непрозрачных вызовов отрисовки; без теневых карт
  • Каждый 3D-ассет необязателен: отсутствующий файл заменяется процедурной версией, а не ошибкой
  • Все тексты живут в файлах контента; в коде сцены нет биографии

Процесс

  1. Сначала грейбокс: каждая точка камеры, взаимодействие и переход были собраны на примитивах до появления моделей.
  2. Одна траектория камеры Catmull-Rom, одно значение прокрутки; Lenis и цикл рендера делят один тикер, чтобы DOM и WebGL не расходились.
  3. Шейдеры написаны один раз на TSL и компилируются в WGSL и GLSL: рендер на WebGPU с автоматическим откатом на WebGL2.
  4. Тонмаппинг AgX, процедурное окружение полярной ночи и глубинное размытие за колонкой текста.