Почему веб-приложения, созданные с помощью ИИ, тормозят
Современные ИИ-инструменты позволяют за считаные минуты собрать интерфейс, сгенерировать компоненты и даже создать полноценное веб-приложение. Однако готовый функционал еще не означает высокую скорость работы. Страница может долго загружаться, интерфейс — реагировать с задержкой, а браузер — выполнять множество ненужных скриптов.
Проблема характерна не только для кода, созданного нейросетями. Даже вручную написанное приложение не обязательно будет быстрым. Чтобы находить причины задержек, разработчику необходимо понимать, как браузер загружает и отображает страницу, какие показатели связаны с пользовательским опытом и на каких этапах возникают узкие места.
Производительность как часть пользовательского опыта
Эдди Османи рассматривает эту тему в книге «Современный Web Performance Engineering. Улучшаем скорость и качество приложений с ИИ». Автор предлагает оценивать производительность не как набор абстрактных технических показателей, а как составляющую взаимодействия пользователя с сайтом. Посетителю неважно, какой фреймворк использовала команда и насколько сложен JavaScript-код. Важнее, чтобы основной контент появлялся быстро, интерфейс не зависал, а элементы страницы не меняли положение во время чтения.
Какие показатели и инструменты использовать
Одна из центральных тем книги — Core Web Vitals. Османи разбирает LCP, который отражает скорость появления основного содержимого, INP, связанный с отзывчивостью интерфейса, и CLS, показывающий стабильность макета. Эти метрики помогают перейти от субъективной оценки «сайт работает медленно» к измеримому анализу.
Для диагностики автор рассматривает лабораторные тесты и данные реальных пользователей, а также работу с Lighthouse, Chrome DevTools и WebPageTest. С их помощью можно определить, какие ресурсы задерживают загрузку, как выполняется JavaScript и какие изменения действительно улучшают пользовательский опыт.
Что происходит между запросом и отображением страницы
Для оптимизации недостаточно знать итоговые значения метрик. Важно понимать последовательность работы браузера: загрузку ресурсов, обработку HTML, CSS и JavaScript, расчет стилей, построение макета и отрисовку. Отдельное внимание уделяется выполнению JavaScript, разделению кода и гидратации — этапам, которые часто становятся источниками лишних задержек в современных приложениях.
Как проверять код, созданный ИИ
Нейросеть способна быстро предложить рабочее решение, но не гарантирует, что оно будет оптимальным по скорости и расходу ресурсов. Поэтому сгенерированный код нужно проверять с помощью измерений и инструментов профилирования. В книге рассматриваются типичные проблемы ИИ-сгенерированных приложений, способы их обнаружения, ИИ-возможности Chrome DevTools и работа через MCP.
Практические рекомендации включают сокращение объема JavaScript и оптимизацию его выполнения, контроль сторонних скриптов аналитики, рекламы, виджетов и ИИ-чатов, а также регулярную проверку показателей LCP, INP и CLS. Автор предлагает внедрять контроль производительности на всех этапах разработки и выстраивать соответствующие процессы внутри команды.
Для кого предназначена книга
«Современный Web Performance Engineering» ориентирована на фронтенд-разработчиков, performance-инженеров и технических лидеров. Ее подход не предполагает отказа от нейросетей или ручной проверки каждой строки кода. ИИ можно использовать для ускорения работы, но качество результата следует оценивать по измеримым показателям и пониманию того, почему конкретное решение работает.
Автор книги Эдди Османи работает в технической команде Anthropic. Ранее он возглавлял инженерное направление Google Cloud AI, где занимался инструментами Gemini, Vertex AI и другими ИИ-платформами. До этого почти 14 лет Османи работал в команде Chrome над производительностью, разработкой и пользовательским опытом. Этот опыт лег в основу системного подхода к оптимизации приложений, созданных человеком, нейросетью или в смешанном режиме.
