Веб-приложения — страница 6

PWA, Mini Apps, расширения, совместная работа, карты, медиа и документы.

Темы раздела

Материалы

• Получение изменений и атомарный cursor

  Сохраняем страницу серверного журнала и её cursor одной транзакцией.

• Сравнение версий и ручное объединение

  Разрешаем конфликт явным выбором, сохраняя серверную revision и новый ID намерения.

• Удаление заметки и tombstone

  Передаём удаление как версионированное состояние и удерживаем его для отключённых устройств.

• Повторы, отключение сети и прогресс

  Разделяем временный сетевой отказ, завершение сессии и прикладной конфликт, сохраняя очередь.

• Несколько вкладок и несколько устройств

  Координируем отправителей одного origin и защищаем сохранение устаревшей формы.

• Квоты браузера и экспорт заметок

  Обрабатываем ограниченное хранение и экспортируем согласованный диагностический снимок.

• Аккаунт, локальная база и прекращение сессии

  Разделяем записи разных владельцев и прекращаем отправку при отказе авторизации.

• Передача Блокнота и сценарии восстановления

  Собираем регламент локального хранения, синхронизации, конфликта и экспорта с явными границами.

• SVG и Canvas: графический редактор

  Десять последовательных уроков. Общий пример «Схема».

• Документ, фигура и координаты редактора

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

• SVG из данных, без HTML-строк

  Рисуем документ редактора через SVG: пространства имён, геометрия, подписи, порядок элементов и обновление сцены.

• Координаты указателя и попадание в фигуру

  Переводим координаты PointerEvent в SVG и определяем попадание в прямоугольник или эллипс с учётом слоёв.

• Перемещение и команды изменения

  Организуем перетаскивание фигуры: исходное состояние, захват указателя, ограничения страницы и завершение жеста.

• Масштаб и перемещение камеры

  Управляем SVG viewBox как камерой: масштаб вокруг выбранной точки, перемещение просмотра и возврат к странице.

• Выделение, порядок и свойства фигур

  Связываем SVG со списком слоёв и формой свойств; добавляем изменение координат, подписей и порядка фигур.

• Отмена действий и границы операции

  Строим историю документа из снимков: отдельное изменение, временное перетаскивание, отмена, повтор и ограничение памяти.

• Сохранение документа и проверка импорта

  Сохраняем схему в localStorage и JSON: лимиты файла, проверка формата, гонка загрузок и стабильные состояния.

• Экспорт изображения через Canvas

  Получаем SVG и PNG из единой модели: размеры экспорта, рисование Canvas 2D, текст, Blob и ограничения результата.

• Доступное управление и передача редактора

  Завершаем графический редактор: клавиатура, сообщения состояния, сценарии ручной проверки и явные границы учебной версии.

• Web Audio: локальная аудиомастерская

  Десять последовательных уроков. Общий пример «Аудиомастерская».

• Звуковой файл, семпл и контракт редактора

  Определяем модель локальной аудиомастерской: каналы, кадры, частоту дискретизации, границы фрагмента и ограничения.

• Декодирование локального файла

  Открываем локальный аудиофайл через decodeAudioData: проверка объёма, частота буфера, ошибки и конкурирующие загрузки.

• AudioContext и управляемое воспроизведение

  Управляем прослушиванием AudioBuffer: одноразовый источник, resume, остановка, ended и позиция по часам AudioContext.

• Звуковой граф и громкость без скачка

  Разделяем источник, огибающую и основной GainNode; управляем уровнем через AudioParam и сохраняем смысл настройки экспорта.