Тип доклада: Воркшоп

Воркшоп. Новые приключения во фронтенде, версия 2021

  • Доклад на русском языке
Смотреть запись

Мы все еще стараемся просчитать верную стратегию для эффективного создания веб-сайтов и приложений. Хотим использовать все технологии и смарт-процессы, но как нам использовать всё это эффективно и уложиться в разумные сроки?

В этом воркшопе мы рассмотрим устойчивую и действенную стратегию по созданию быстрого и адаптивного опыта. Также обратим внимание на доступность, сжатие текста, оптимизацию изображений, доставку веб-шрифтов, CSS, CSS-верстку, доставку JavaScript и улучшение Core Web Vitals вместе с узкими местами производительности. Также рассмотрим тулинг, как разобраться в сетевых водопадах DevTools и диаграммах flame charts, WebPageTest и нескольких небольших утилитах.

В течение этого воркшопа затронем такие темы, как:

  • компонентный воркфлоу и тулинг с полезными инструментами и ресурсами для улучшения среды разработки;
  • погружение в DevTools и WebPageTest, разберемся с производительностью flame charts, сетевой панелью и водопадами WebPagetest для выявления узких мест в производительности;
  • сжатие текста с Brotli, локализация/i18n-техники и практические советы;
  • оптимизация изображений и видео (AVIF, AV1, форматы, способы доставки и тулинг);
  • стратегии загрузки веб-шрифтов и рецепты;
  • организация CSS и Critical CSS для оптимизации доставки и минимизации пересчета положения элементов;
  • CSS Custom Properties — как их использовать;
  • продвинутые методы CSS-вестки, такие как CSS Grid + CSS Custom Properties + Subgrid;
  • HTML-почта в 2020, как быть с Gmail, Apple Mail, Outlook и другими почтовыми клиентами с шаблонами и тулингом;
  • общие сложности и решения фронтенда, и важные новые задачи и возможности, о которых следует помнить.
  • #performance

Спикеры

Приглашенные эксперты

Доклады