Вопросы на экзамен

Экзаменационные требования

Дисциплина: «Оптимизация веб-приложений»

1. Теоретические вопросы

Понятие оптимизации веб-приложений. Цели, задачи и основные направления оптимизации.
Производительность веб-приложения. Основные метрики и влияние на пользовательский опыт.
SEO. Назначение и роль поисковой оптимизации в веб-разработке.
Семантическое ядро сайта. Понятие, структура и принципы формирования.
Внутренняя SEO-оптимизация. Основные элементы и область применения.
Техническая оптимизация сайта. Назначение и основные направления.
Внутренняя техническая оптимизация. Структура страницы, мета-теги, заголовки, ссылки, изображения.
Сборщики в JavaScript. Назначение и роль в оптимизации веб-приложений.
Инструменты сборки. Общая характеристика современных сборщиков.
Минификация и бандлинг ресурсов. Назначение и особенности применения.
Оптимизация JavaScript. Основные подходы и практики.
Code Splitting. Принципы, назначение и преимущества.
Динамический импорт модулей. Назначение и применение.
Оптимизация CSS. Основные подходы к уменьшению объёма и ускорению загрузки стилей.
Критический CSS. Назначение и способы применения.
Оптимизация шрифтов. Форматы, подключение, загрузка и влияние на производительность.
CDN. Назначение, принцип работы и преимущества использования.
Клиентское кэширование. Назначение, механизмы и основные заголовки.
Lazy-loading. Принцип работы и области применения.
Оптимизация изображений и медиа-ресурсов. Основные методы и влияние на скорость загрузки.
Service Workers. Назначение, архитектура и сценарии применения.
IndexedDB. Назначение и использование в клиентских веб-приложениях.
Прогрессивные веб-приложения (PWA). Понятие, особенности и преимущества.
Основные компоненты PWA. Manifest, Service Worker, offline-режим.
Main Thread. Роль главного потока в работе браузера.
Процесс отрисовки страницы. Основные этапы и их влияние на производительность.
Работа с DOM. Влияние манипуляций с DOM на производительность.
Reflow и Repaint. Причины возникновения и способы уменьшения их влияния.
Debounce. Назначение и примеры применения.
requestAnimationFrame (RAF). Назначение и использование для анимации и оптимизации интерфейсов.
Работа с консолью браузера. Использование для анализа и отладки производительности.
Оценка производительности веб-приложений. Подходы и основные показатели.
Lighthouse. Назначение, возможности и интерпретация отчётов.
Аудит производительности веб-приложения. Основные этапы и рекомендации по улучшению.

2. Типовые задачи

Анализ страницы на предмет SEO-ошибок
Подбор ключевых слов для семантического ядра
Оптимизация мета-тегов страницы
Выявление проблем внутренней технической оптимизации
Настройка сборки JavaScript-проекта
Разделение JavaScript-кода на чанки
Оптимизация загрузки CSS
Подключение и оптимизация веб-шрифтов
Настройка раздачи статических файлов через CDN
Настройка клиентского кэширования
Реализация lazy-loading для изображений
Анализ работы Service Worker
Организация хранения данных в IndexedDB
Подготовка веб-приложения к PWA-формату
Анализ загрузки main thread
Поиск узких мест в отрисовке страницы
Оптимизация обработчиков событий через debounce
Использование requestAnimationFrame для анимации
Анализ DOM-операций и их оптимизация
Проверка производительности страницы с помощью Lighthouse

3. Практические навыки

Студент должен уметь:

анализировать веб-приложение с точки зрения производительности;
выполнять базовую SEO-оптимизацию страниц;
формировать семантическое ядро сайта;
выявлять и исправлять ошибки технической и внутренней оптимизации;
использовать сборщики JavaScript;
применять минификацию и бандлинг ресурсов;
выполнять code splitting и динамическую загрузку модулей;
оптимизировать CSS и шрифты;
использовать CDN для доставки статических ресурсов;
настраивать клиентское кэширование;
реализовывать lazy-loading;
использовать Service Workers;
работать с IndexedDB;
подготавливать и анализировать PWA;
понимать работу main thread и процесса отрисовки;
применять debounce и requestAnimationFrame;
оптимизировать работу с DOM;
использовать консоль разработчика для анализа производительности;
выполнять аудит производительности с помощью Lighthouse.

4. Формат экзамена

Экзамен включает:

теоретический вопрос
задачу на анализ или оптимизацию веб-приложения
практическое задание