Получить доступ

Браузерные API

Полезно знать с Junior

Хранилища, Web Workers, Service Worker и PWA, Intersection Observer и другие возможности платформы.

Браузер умеет гораздо больше, чем показывать страницы.

APIдля чего
localStorage, sessionStorageмаленькие данные строками, синхронно
IndexedDBбольшие структурированные данные, офлайн
Cookiesмаленькие данные, уходят на сервер с каждым запросом
Web Workersвычисления в отдельном потоке
Service Workerперехват запросов, офлайн-режим, push-уведомления
Intersection Observerэлемент появился в видимой области: ленивая загрузка, бесконечная лента
ResizeObserverизменился размер элемента
History APIмаршрутизация в SPA
Clipboard, Notifications, Geolocationдоступ к возможностям устройства с разрешения пользователя

PWA — веб-приложение с манифестом и Service Worker: устанавливается на домашний экран, работает офлайн. Для многих задач заменяет отдельное мобильное приложение.

Критерии освоения

Junior ≈ 3 ч

  • Использует localStorage и sessionStorage и понимает их ограничения

Практика. Сохранять черновик формы в localStorage с обработкой ошибок доступа.

Middle ≈ 6 ч

  • Использует Intersection Observer для ленивой загрузки и бесконечной ленты
  • Выносит тяжёлые вычисления в Web Worker
  • Объясняет Service Worker и делает простое офлайн-кэширование

Практика. Сделать бесконечную ленту на Intersection Observer и офлайн-режим страницы на Service Worker.

Вопросы с собеседований

Документация

← Вся карта «Frontend-разработчик»

Закрытая бета

Знать тему — половина дела

На живом собеседовании sotto слышит вопрос интервьюера и показывает короткий ответ и план. Оставьте контакт — пришлём доступ и промокод.

  • Промокод на 2 часа — сверх пробных 30 минут
  • Программа для Windows — скачать сразу, войти — через Яндекс ID или VK ID
  • Прямая связь с разработчиком: что улучшить — сделаем