Воркшоп: оптимізація Web Performance

Оптимізували зображення та мінімізували CSS, але веб-застосунок все одно повільний? Час розібратися, що дійсно впливає на швидкість завантаження та взаємодії!

Перфоменс відіграє ключову роль у сучасному вебі: від нього залежать користувацький досвід (UX), рейтинг у пошукових системах і навіть бізнес-метрики. Core Web Vitals (CWV) визначають якість роботи сайту з точки зору реальних користувачів, а їх оптимізація може значно покращити показники продуктивності.

Ментор: Олександр Лавренчук, Front-end Tech Lead. Має 7+ років досвіду у фронтенд-розробці: від роботи в динамічних стартапах до створення highload застосунків з мільйонами користувачів.

Під час воркшопу ви дізнаєтесь:
• Як аналізувати Largest Contentful Paint (LCP), Cumulative Layout Shift (CLS), Interaction to Next Paint (INP), а також First Contentful Paint (FCP) і Time to First Byte (TTFB).
• Чому оптимізація серверного рендерингу та потокового рендерингу (Streaming) може суттєво покращити CWV.
• Як використовувати React Server Components, Suspense та Next.js для підвищення продуктивності.
• Практичні підходи до вимірювання та усунення вузьких місць (bottlenecks) у вашому застосунку.

Ви отримаєте як теоретичні, так і практичні знання з веб-оптимізації, навчитесь покращувати Web Vitals, а також зрозумієте, як знаходити та усувати проблемні місця, і на що слід звертати увагу у повсякденній розробці веб-застосунків.

Кому буде цікаво?

Фронтенд-розробникам:
• Junior+: які вже мають практичний досвід побудови бізнес веб-застосунків, і хотіли б розібратись в методах оптимізації веб-перфоменсу.
• Middle та Senoir: які вже мають базове розуміння оптимізації, але хотіли б поглибити, систематизувати і розширити свої знання.

Формат:

Дата та час: 29 березня, 11:00 - 15:00, (Kyiv time, GMT+2), тривалість ~4 години.

Платформа: Zoom. Ми відправимо вам посилання напередодні воркшопу, а також ви знайдете його на цій сторінці.

Мова заходу та презентації: українська

Кількість учасників обмежена: 30 місць

Технічні вимоги: Досвід з React - практична частина проходитиме на NextJS

Програма:

• Загальний огляд веб-продуктивності.
• Як браузер рендерить веб-застосунки.
• Ключові етапи рендерингу та можливі проблеми.
• Core Web Vitals: LCP, CLS, INP, FCP, TTFB.
• Детальний аналіз метрик, їх впливу та оптимізації.

• Виявлення проблем у Next.js-застосунку.
• Покрокова оптимізація на основі теоретичних знань.
• Використання React Server Components, Suspense, Streaming.
• Додаткові техніки оптимізації продуктивності.
• Додаткові матеріали та Q&A