ВКонтакте перевела веб-версию на новую архитектуру и ускорила загрузку сайта на 25%

Соцсеть перевела основные разделы vk.com на архитектуру SPA. Это позволило ускорить загрузку интерфейса на 25% и упростило выпуск обновлений. 

Переход на SPA стал частью большой технологической трансформации ВКонтакте. Команда обновила фронтенд-архитектуру веб-версии сервиса и перевела на новую технологическую основу ключевые пользовательские сценарии: ленту, профили, сообщества, мессенджер, друзей, клипы, фотографии, маркет. После перехода показатели производительности улучшились: первая отрисовка страницы ускорилась на 25%, а среднее время перехода между разделами уменьшилось в 3,5 раза. 

До перехода на новую архитектуру многие сценарии в веб-версии работали по классической модели: при открытии раздела страница ожидала серверный ответ и только после этого полностью отрисовывалась на экране. Теперь ВКонтакте быстрее показывает пользователю структуру страницы — например, шапку, навигацию и каркас раздела, — а затем наполняет её контентом. Благодаря этому пользователи раньше начинают взаимодействовать с сервисом и не сталкиваются с пустым экраном при переходах.

Обновление затронуло не только пользовательский интерфейс, но и внутренние процессы разработки. В рамках перехода на SPA команда интегрировала в веб-версию компонентный подход, связанный с дизайн-системой ВКонтакте. Теперь новые интерфейсы можно собирать из готовых компонентов: кнопок, модальных окон, навигационных элементов и других блоков. Это снижает объём ручной вёрстки, помогает поддерживать единый визуальный стиль и ускоряет разработку новых функций.

Новая архитектура позволила командам выпускать веб-обновления быстрее: время деплоя фронтенда сократилось до 20 секунд. Релизы происходят в среднем 6–8 раз в сутки; в продакшене ежедневно появляется более 100