← Блог Стирая Грань

Оптимизация Flutter Web для тяжелых нарративных игр: как мы победили долгую загрузку и лаги

12 июня 2026·Технологии·7 мин чтения

Flutter Web для нарративной RPG — не типичный CRUD. Длинный чат, боковая панель, карта, портреты и анимации создают нагрузку. Вот что реально помогло снизить время до первого хода.

Gzip и размер main.dart.js

Без сжатия main.dart.js весил ~3.5 MB — через FRP-туннель это критично. Включение gzip в Nginx снизило передаваемый объём до ~1 MB. Обязательно проверяйте Content-Encoding: gzip на проде — без него мобильные пользователи ждут минуту.

Кэширование ассетов

Шрифты, иконки и AssetManifest кэшируются агрессивно. Версионирование через asset_version в version.json даёт безопасный cache-bust при деплое без invalidation всего CDN.

Перерисовки и const

Чат — самый горячий экран. Мы разбили UI на мелкие StatelessWidget, вынесли списки в ListView.builder, добавили const там, где текст статичен. Каждый лишний rebuild во время стриминга ответа ИИ ощущается как лаг.

Изоляция стилей лендинга

Статический лендинг в index.html живёт до загрузки Flutter. Стили лендинга изолированы от композитора — иначе глобальные CSS правила ломают Material-тему приложения после bootstrap.

Играть бесплатно

5 бесплатных ходов без регистрации — прямо в браузере.

Начать кампанию