Web App Manifest

Web App Manifest
================

**Экспериментальная возможность:** **Это экспериментальная технология**
Так как спецификация этой технологии ещё не стабилизировалась, смотрите таблицу совместимости по поводу использования в различных браузерах. Также заметьте, что синтаксис и поведение экспериментальной технологии может измениться в будущих версиях браузеров, вслед за изменениями спецификации.

**Манифесты веб-приложений** являются частью набора веб-технологий, называемых прогрессивными веб-приложениями (en-US) (PWA, progressive web apps), представляющими собой веб-сайты, которые можно установить на домашний экран устройства без магазина приложений. В отличие от обычных веб-приложений с простыми ссылками на домашний экран или закладками, PWA можно загружать заранее и работать в автономном режиме, а также использовать обычные `Web API`.

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

Содержимое манифеста
--------------------

Манифест может содержать следующие элементы:

* background\_color
* categories
* description
* display
* icons
* name
* orientation
* prefer\_related\_applications
* related\_applications
* scope
* screenshots
* short\_name
* start\_url
* theme\_color
Пример манифеста
----------------

```json
{
  "name": "HackerWeb",
  "short\_name": "HackerWeb",
  "start\_url": ".",
  "display": "standalone",
  "background\_color": "#fff",
  "description": "A simply readable Hacker News app.",
  "icons": [
    {
      "src": "images/touch/homescreen48.png",
      "sizes": "48x48",
      "type": "image/png"
    },
    {
      "src": "images/touch/homescreen72.png",
      "sizes": "72x72",
      "type": "image/png"
    },
    {
      "src": "images/touch/homescreen96.png",
      "sizes": "96x96",
      "type": "image/png"
    },
    {
      "src": "images/touch/homescreen144.png",
      "sizes": "144x144",
      "type": "image/png"
    },
    {
      "src": "images/touch/homescreen168.png",
      "sizes": "168x168",
      "type": "image/png"
    },
    {
      "src": "images/touch/homescreen192.png",
      "sizes": "192x192",
      "type": "image/png"
    }
  ],
  "related\_applications": [
    {
      "platform": "web"
    },
    {
      "platform": "play",
      "url": "https://play.google.com/store/apps/details?id=cheeaun.hackerweb"
    }
  ]
}
```

Внедрение манифеста
-------------------

Манифест веб-приложения внедряется в вашу HTML-страницу, с помощью тега ссылки в заголовке вашего документа:

```html
<link rel="manifest" href="/manifest.webmanifest" />
```

**Примечание:** Расширение `.webmanifest` указывается в разделе спецификации Media type registration section of the specification (ответ файла манифеста должен возвращать `Content-Type: application/manifest+json`). Браузеры обычно поддерживают манифесты с другими соответствующими расширениями, такими как `.json` (`Content-Type: application/json`).

**Примечание:** Если для получения манифеста требуются учётные данные - атрибут `crossorigin` должен иметь значение `"use-credentials"`, даже если файл манифеста находится в том же источнике, что и текущая страница.

Заставки
--------

В Chrome 47 и более поздних версиях заставки отображаются при загрузке веб-приложения с домашнего экрана. Эти заставки автоматически генерируются с использованием свойств, указанных в манифесте приложения, например: `name`, `background_color` и иконки в массиве `icons,` которые ближе к 128dpi для устройства.

Спецификации
------------

| Specification |
| --- |
| Web Application Manifest # background\_color-member |
| Web App Manifest - Application Information # categories-member |
| Web App Manifest - Application Information # description-member |
| Web Application Manifest # display-member |
| Manifest Incubations # display\_override-member |
| Manifest Incubations # file\_handlers-member |
| Web Application Manifest # icons-member |
| Web Application Manifest # id-member |
| Web App Launch Handler API # launch\_handler-member |
| Web Application Manifest # name-member |
| Manifest Incubations # note\_taking-member |
| Web Application Manifest # orientation-member |
| Web Application Manifest # prefer\_related\_applications-member |
| Manifest Incubations # protocol\_handlers-member |
| Web Application Manifest # related\_applications-member |
| Web Application Manifest # scope-member |
| Web App Manifest - Application Information # screenshots-member |
| Web Share Target API # share\_target-member |
| Web Application Manifest # short\_name-member |
| Web Application Manifest # shortcuts-member |
| Web Application Manifest # start\_url-member |
| Web Application Manifest # theme\_color-member |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.


Учебники

Учебники
========

Ссылки на этой странице ведут к целому ряду учебных пособий и материалов. Если вы только начинаете учить основы, или же вы уже бывалый веб-разработчик, то здесь вы сможете найти полезные ресурсы для получения передового практического опыта. Эти ресурсы создаются дальновидными компаниями и веб-разработчиками, включают открытые стандарты и лучшие практики для веб-разработки, предоставляют или позволяют переводы под открытой лицензией, такой, как Creative Commons.

HTML учебники
-------------

### Вводный уровень

Введение в HTML

Что такое HTML, что он делает, его краткая история, и что представляет собой структура HTML документа. В последующих статьях мы подробнее рассмотрим отдельные части HTML.

Базовая структура веб-страницы (SitePoint)

Узнайте как HTML элементы сочетаются в общую картину.

MDN HTML Element Reference

Комплексный справочник для HTML элементов, и, как различные браузеры поддерживают их.

HTML Challenges (Wikiversity)

Используйте эти задачки, чтобы отточить свои HTML навыки (для примера, "Какой элемент нужно использовать - <h2> или <STRONG>?"), фокусируясь на смысле разметки.

### Продвинутый уровень

Tips for Authoring Fast-Loading HTML Pages (en-US)

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

HTML5 Tutorials (HTML5 Rocks)

Совершите экскурсию в код, который использует возможности HTML5.

Semantics in HTML5 (A List Apart)

Изучите рабочую разметку, обеспечивающую обратную совместимость, расширяемую и поддерживающую будущие изменения (совместимость вперёд).

Canvas Tutorial (en-US)

Узнайте, как рисовать с помощью скриптов, используя элемент `canvas`.

HTML5 Doctor

Статьи о том, как используется HTML5 прямо сейчас.

The Joy of HTML5 Audio (Elated)

Узнайте как использовать HTML аудио элемент для того, чтобы вставлять звуки в ваши веб-страницы. В учебнике представлено много примеров кода.

Javascript учебники
-------------------

### Вводный уровень

**JavaScript First Steps**

JavaScript руководство, написанное как часть MDN Learning Area.

Codecademy (Codecademy)

Codecademy это простой способ изучить JavaScript. Он интерактивный, и вы можете делать это вместе с друзьями

Getting Started with JavaScript

Что такое JavaScript и как он может пригодиться вам?

JavaScript Best Practices (WebPlatform.org)

Узнайте о некоторых из очевидных (и не очень очевидных) лучших практиках для написания кода на JavaScript.

### Средний уровень

A Re-Introduction to JavaScript (en-US)

Повторение языка программирования JavaScript для разработчиков среднего уровня.

Eloquent JavaScript

Полное руководство по "средним" и "продвинутым" методикам JavaScript.

Essential JavaScript Design Patterns (Addy Osmani)

Введение в основы шаблонов проектирования JavaScript.

The JavaScript Programming Language (YUI Blog)

Douglas Crockford исследует язык, какой он есть сегодня, и как он пришёл, чтобы быть.

Introduction to Object-Oriented JavaScript (en-US)

Узнайте об ООП в JavaScript.

**Speaking JavaScript (Dr. Axel Rauschmayer)**

Для тех программистов, кто хочет быстро и хорошо выучить JavaScript, а так же для тех, кто хочет углубить свои навыки или же изучить какие-то специфические темы.

### Продвинутый уровень

JavaScript Guide

Полное, регулярно обновляемое руководство по JavaScript для всех уровней обучения от начального до продвинутого.

Learning Advanced JavaScript (John Resig)

Гид по "продвинутому" JavaScript от John Resig.

Introducing the JavaScript DOM (Elated)

Что такое Document Object Model, и зачем она нужна? Эта статья даёт вам постепенное введение в эту мощную способность JavaScript.

An Inconvenient API: The Theory of the DOM (YUI Blog)

Douglas Crockford объясняет Document Object Model.

Advanced JavaScript (YUI Blog)

Douglas Crockford пристально следит за шаблоном кода, который JavaScript программисты могут выбрать в авторстве своих приложений.

JavaScript Garden

Документация из самых необычных частей JavaScript

Which JavaScript Framework? (StackOverflow)

Советы по выбору основы JavaScript..

Non-Blocking JavaScript Downloads (YUI Blog)

Советы по улучшению производительности скачивания страниц, содержащих JavaScript

JavaScript Patterns

Шаблоны и антишаблоны проектирования JavaScript, которые охватывают функциональные шаблоны, шаблоны JQuery, шаблоны плагинов JQuery, шаблоны проектирования, основные шаблоны, literal patterns и шаблоны конструирования, шаблоны создания объекта, переиспользуемый шаблонный код, DOM.

How Browsers Work

Статья с подробным исследованием, описывающая различные современные браузеры, их движки, рендеринг страниц и пр.

**Exploring ES6 (Dr. Axel Rauschmayer)**

Надёжная и подробная информация об ECMAScript 2015.

JavaScript Videos (GitHub)

Видео о JavaScript.

CSS учебники
------------

### Вводный уровень

CSS Getting Started (en-US)

Этот учебник познакомит вас с каскадными таблицами стилей (CSS). Он проведёт вас через основные особенности CSS и предложит практические примеры, которые можно попробовать на вашем компьютере.

CSS Selector Classes (Wikiversity)

Что такое классы в CSS?

External CSS (Wikiversity)

Использование CSS из внешних источников.

Adding a Touch of Style (W3C)

Краткое руководство для начинающих по стилизации веб-страниц с помощью CSS.

Common CSS Questions (en-US)

Общие вопросы и ответы для начинающих.

CSS Selectors (en-US)

Введение в CSS селекторы.

### Средний уровень

CSS Reference (en-US)

Полный справочник по CSS, с информацией о поддержке в Firefox и других браузерах.

CSS Challenges (Wikiversity)

Улучшите ваши навыки CSS, и обратите внимание на то, где вам нужно больше практики.

Intermediate CSS Concepts (HTML.net)

Группировка, псевдоклассы и многое другое.

CSS Positioning 101 (A List Apart)

Использование позиционирования в соответствии со стандартами, без использования таблиц.

Progressive Enhancement with CSS (A List Apart)

Прогрессивное улучшение в веб-страницы с помощью CSS.

Fluid Grids (A List Apart)

Дизайн вёрстки, который плавно изменяется вместе с размерами окна, основанный на сетке.

### Продвинутый уровень

Using CSS Transforms (en-US)

Как применять поворот, наклон, масштабирование и перемещение при помощи CSS

CSS Transitions (en-US)

CSS переходы, спецификация CSS3 по этой теме, как анимировать изменения стилей в CSS, вместо того, чтобы делать их "сразу".

Quick Guide to Implement Web Fonts with @font-face (HTML5 Rocks)

Возможности @font-face в CSS3, создание собственных шрифтов и работа с ними.

Starting to Write CSS (David Walsh)

Введение в инструменты и методологии для разработки более краткого, масштабируемого и поддерживаемого CSS.


XML: Extensible Markup Language

XML: Extensible Markup Language
===============================

The **Extensible Markup Language** is a strict serialisation of the Document Object Model.

XML ВведениеXML - это язык разметки подобный HTML. Расшифровывается как (англ. Extensible Markup Language - Расширяемый Язык Разметки) и является рекомендацией сообщества W3C в качестве языка разметки общего назначения (W3C recommended). В отличии от остальных языков разметки, XML сам по себе не определён (это означает, что вы должны сами определять используемые теги). Основной целью XML является передача данных между разными системами (даже концептуально разными), такими как интернет.

Прямая и обратная обработка XMLИногда возникает необходимость в обработке XML и в последующей конвертации в древо DOM. Или наоборот, необходимо перевести древо DOM в XML. В этой статье рассмотрим объекты платформы web для обработки XML.


MathML

MathML
======

**Mathematical Markup Language (MathML)** разновидность языка разметки XML (en-US), предназначенная для построения математических выражений с сохранением их структуры и содержания. Здесь вы найдёте ссылки к документации, примеры и инструменты, которые помогут вам работать с этой мощной технологией. Для быстрого обзора - смотрите слайды для выставки инноваций на саммите Mozilla 2013.

Справочные данные по MathML
---------------------------

Справка по элементам MathML

Детальная информация о каждом элементе MathML, а также информация по совместимости для настольных и мобильных браузеров.

Справка по атрибутам MathML

Информация по атрибутам MathML, которые могут изменять внешний вид или поведение элементов.

Примеры MathML

Примеры и образцы работы технологии MathML, которые помогут вам понять её принципы.

Средство разработки MathML

Предложения и советы по написанию на MathML, включая рекомендации по редакторам MathML, а также информация о том как интегрировать результат в Web контент.

Получение помощи из сообщества
------------------------------

* IRC канал
* Wiki от авторов Mozilla
* Домашняя страница W3C Math
* Почтовый архив www-math w3.org
Инструменты
-----------

* W3C Validator (проверка online)
* Дополнение FireMath к Firefox
* Коллекция дополнений к Mathzilla Firefox
* TeXZilla - Javascript конвертер LaTeX в MathML (живая демонстрация, web-приложение Firefox OS, дополнение к Firefox, использование в Web странице, программа на JS, и.т.п.)
* LaTeXML - Конвертация документов LaTeX в HTML+MathML Web-страницы
* Web Equation - Вставка рукописных формул в MathML или LaTeX
* MathJax - Кросс-платформенное средство отображения математического контента на JavaScript. Для ускорения MathJax c использованием нативного MathML, испытайте это дополнение для Mozilla, это расширение для Safari или этот скрипт для GreaseMonkey.
Похожие темы
------------

* CSS
* HTML
* SVG
Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.


Интерфейсы веб API

Интерфейсы веб API
==================

При написании кода на JavaScript для Веба доступно большое количество API. Ниже приведён список всех интерфейсов (то есть, типов объектов), которые вы можете использовать при разработке веб-приложения или сайта.

Спецификации
------------

Список доступных API.

### A

* Audio Output Devices API (en-US)
Экспериментальная возможность

### B

* Background Fetch API
Экспериментальная возможность
* Background Sync (en-US)
Экспериментальная возможность
* Background Tasks (en-US)
* Badging API (en-US)
* Barcode Detection API (en-US)
Экспериментальная возможность
* Battery API (en-US)
* Beacon
* Bluetooth API (en-US)
Экспериментальная возможность
* Broadcast Channel API (en-US)

### C

* CSS Counter Styles (en-US)
* CSS Custom Highlight API (en-US)
* CSS Font Loading API (en-US)
* CSS Painting API (en-US)
Экспериментальная возможность
* CSS Properties and Values API (en-US)
* CSS Typed Object Model API (en-US)
* CSSOM
* Canvas API
* Channel Messaging API (en-US)
* Clipboard API
* Compression Streams API (en-US)
* Console API
* Contact Picker API (en-US)
Экспериментальная возможность
* Content Index API (en-US)
Экспериментальная возможность
* Cookie Store API (en-US)
Экспериментальная возможность
* Credential Management API

### D

* DOM
* Device Memory API (en-US)
* Device Orientation Events (en-US)
* Document Picture-in-Picture API (en-US)
Экспериментальная возможность

### E

* EditContext API (en-US)
Экспериментальная возможность
* Encoding API (en-US)
* Encrypted Media Extensions (en-US)
* EyeDropper API (en-US)
Экспериментальная возможность

### F

* FedCM API (en-US)
Экспериментальная возможность
* Fetch API
* File API (en-US)
* File System API (en-US)
* File and Directory Entries API
* Force Touch Events (en-US)
Non-standard
* Fullscreen API (en-US)

### G

* Gamepad API
* Geolocation API
* Geometry Interfaces (en-US)

### H

* HTML DOM (en-US)
* HTML Drag and Drop API
* HTML Sanitizer API (en-US)
Экспериментальная возможность
* History API
* Houdini API (en-US)

### I

* Idle Detection API (en-US)
Экспериментальная возможность
* Image Capture API (en-US)
Экспериментальная возможность
* IndexedDB
* Ink API (en-US)
Экспериментальная возможность
* Input Device Capabilities API (en-US)
Экспериментальная возможность
* Insertable Streams for MediaStreamTrack API (en-US)
* Intersection Observer API

### K

* Keyboard API (en-US)
Экспериментальная возможность

### L

* Launch Handler API (en-US)
Экспериментальная возможность
* Local Font Access API (en-US)
Экспериментальная возможность

### M

* Media Capabilities API (en-US)
* Media Capture and Streams (en-US)
* Media Session API
* Media Source Extensions (en-US)
Экспериментальная возможность
* MediaStream Recording

### N

* Navigation API (en-US)
Экспериментальная возможность
* Network Information API
Экспериментальная возможность

### P

* Page Visibility API
* Payment Handler API (en-US)
Экспериментальная возможность
* Payment Request API (en-US)
* Performance API (en-US)
* Periodic Background Sync (en-US)
Экспериментальная возможность
* Permissions API (en-US)
* Picture-in-Picture API (en-US)
* Pointer Events
* Pointer Lock API
* Popover API (en-US)
* Presentation API (en-US)
Экспериментальная возможность
* Prioritized Task Scheduling API (en-US)
* Push API

### R

* Remote Playback API (en-US)
* Reporting API (en-US)
Экспериментальная возможность
* Resize Observer API (en-US)

### S

* SVG (en-US)
* Screen Capture API (en-US)
* Screen Orientation API (en-US)
* Screen Wake Lock API (en-US)
* Selection API (en-US)
* Sensor API
* Server Sent Events
* Service Workers API
* Shared Storage API (en-US)
Экспериментальная возможность
* Speculation Rules API (en-US)
Экспериментальная возможность
* Storage (en-US)
* Storage Access API
* Streams

### T

* Touch Events
* Trusted Types API (en-US)

### U

* UI Events (en-US)
* URL API (en-US)
* URL Pattern API (en-US)
Экспериментальная возможность
* User-Agent Client Hints API (en-US)
Экспериментальная возможность

### V

* Vibration API (en-US)
* View Transitions API (en-US)
Экспериментальная возможность
* VirtualKeyboard API (en-US)
Экспериментальная возможность
* Visual Viewport (en-US)

### W

* Web Animations
* Web Audio API
* Web Authentication API (en-US)
* Web Components
* Web Crypto API
* Web Locks API (en-US)
* Web MIDI API (en-US)
* Web NFC API (en-US)
Экспериментальная возможность
* Web Notifications
* Web Serial API (en-US)
Экспериментальная возможность
* Web Share API (en-US)
* Web Speech API
* Web Storage API
* Web Workers API
* WebCodecs API (en-US)
* WebGL
* WebGPU API (en-US)
Экспериментальная возможность
* WebHID API (en-US)
Экспериментальная возможность
* WebOTP API (en-US)
* WebRTC
* WebTransport API (en-US)
* WebUSB API (en-US)
Экспериментальная возможность
* WebVR API
Non-standard

Устарело
* WebVTT
* WebXR Device API
Экспериментальная возможность
* Websockets API
* Window Controls Overlay API (en-US)
Экспериментальная возможность
* Window Management API (en-US)
Экспериментальная возможность

### X

* XMLHttpRequest API (en-US)

Интерфейсы
----------

Список доступных интерфейсов (типы объектов).

### A

* `AbortController`
* `AbortSignal`
* `AbsoluteOrientationSensor` (en-US)
* `AbstractRange` (en-US)
* `Accelerometer` (en-US)
Экспериментальная возможность
* `AesCbcParams` (en-US)
* `AesCtrParams` (en-US)
* `AesGcmParams` (en-US)
* `AesKeyGenParams` (en-US)
* `AmbientLightSensor` (en-US)
Экспериментальная возможность
* `AnalyserNode`
* `ANGLE_instanced_arrays`
* `Animation`
* `AnimationEffect` (en-US)
* `AnimationEvent`
* `AnimationPlaybackEvent` (en-US)
* `AnimationTimeline` (en-US)
* `Attr`
* `AudioBuffer`
* `AudioBufferSourceNode` (en-US)
* `AudioContext`
* `AudioData` (en-US)
Экспериментальная возможность
* `AudioDecoder` (en-US)
Экспериментальная возможность
* `AudioDestinationNode` (en-US)
* `AudioEncoder` (en-US)
Экспериментальная возможность
* `AudioListener` (en-US)
* `AudioNode`
* `AudioParam` (en-US)
* `AudioParamDescriptor` (en-US)
* `AudioParamMap` (en-US)
* `AudioProcessingEvent` (en-US)
Устарело
* `AudioScheduledSourceNode` (en-US)
* `AudioSinkInfo` (en-US)
Экспериментальная возможность
* `AudioTrack` (en-US)
* `AudioTrackList` (en-US)
* `AudioWorklet` (en-US)
* `AudioWorkletGlobalScope` (en-US)
* `AudioWorkletNode` (en-US)
* `AudioWorkletProcessor` (en-US)
* `AuthenticatorAssertionResponse` (en-US)
* `AuthenticatorAttestationResponse` (en-US)
* `AuthenticatorResponse` (en-US)

### B

* `BackgroundFetchEvent`
Экспериментальная возможность
* `BackgroundFetchManager`
Экспериментальная возможность
* `BackgroundFetchRecord`
Экспериментальная возможность
* `BackgroundFetchRegistration`
Экспериментальная возможность
* `BackgroundFetchUpdateUIEvent`
Экспериментальная возможность
* `BarcodeDetector` (en-US)
Экспериментальная возможность
* `BarProp` (en-US)
* `BaseAudioContext` (en-US)
* `BatteryManager`
* `BeforeInstallPromptEvent`
Экспериментальная возможность

Non-standard
* `BeforeUnloadEvent`
* `BiquadFilterNode` (en-US)
* `Blob`
* `BlobEvent` (en-US)
* `Bluetooth`
Экспериментальная возможность
* `BluetoothCharacteristicProperties` (en-US)
Экспериментальная возможность
* `BluetoothDevice` (en-US)
Экспериментальная возможность
* `BluetoothRemoteGATTCharacteristic` (en-US)
Экспериментальная возможность
* `BluetoothRemoteGATTDescriptor` (en-US)
Экспериментальная возможность
* `BluetoothRemoteGATTServer`
Экспериментальная возможность
* `BluetoothRemoteGATTService` (en-US)
Экспериментальная возможность
* `BluetoothUUID` (en-US)
* `BroadcastChannel`
* `ByteLengthQueuingStrategy` (en-US)

### C

* `Cache`
* `CacheStorage`
* `CanMakePaymentEvent` (en-US)
Экспериментальная возможность
* `CanvasCaptureMediaStreamTrack`
* `CanvasGradient`
* `CanvasPattern`
* `CanvasRenderingContext2D`
* `CaptureController` (en-US)
Экспериментальная возможность
* `CaretPosition` (en-US)
Экспериментальная возможность
* `CDATASection`
* `ChannelMergerNode` (en-US)
* `ChannelSplitterNode` (en-US)
* `CharacterBoundsUpdateEvent` (en-US)
Экспериментальная возможность
* `CharacterData`
* `Client` (en-US)
* `Clients`
* `Clipboard` (en-US)
* `ClipboardEvent`
* `ClipboardItem` (en-US)
* `CloseEvent` (en-US)
* `Comment`
* `CompositionEvent` (en-US)
* `CompressionStream` (en-US)
* `console`
* `ConstantSourceNode` (en-US)
* `ContactAddress` (en-US)
Экспериментальная возможность
* `ContactsManager` (en-US)
Экспериментальная возможность
* `ContentIndex` (en-US)
Экспериментальная возможность
* `ContentIndexEvent` (en-US)
Экспериментальная возможность
* `ContentVisibilityAutoStateChangeEvent` (en-US)
Экспериментальная возможность
* `ConvolverNode` (en-US)
* `CookieChangeEvent` (en-US)
Экспериментальная возможность
* `CookieStore` (en-US)
Экспериментальная возможность
* `CookieStoreManager` (en-US)
Экспериментальная возможность
* `CountQueuingStrategy` (en-US)
* `Credential` (en-US)
* `CredentialsContainer` (en-US)
* `Crypto`
* `CryptoKey` (en-US)
* `CryptoKeyPair`
* `CSPViolationReportBody` (en-US)
* `CSS`
* `CSSAnimation` (en-US)
* `CSSConditionRule` (en-US)
* `CSSContainerRule` (en-US)
* `CSSCounterStyleRule` (en-US)
* `CSSFontFaceRule` (en-US)
* `CSSFontFeatureValuesRule` (en-US)
* `CSSFontPaletteValuesRule` (en-US)
* `CSSGroupingRule` (en-US)
* `CSSImageValue` (en-US)
* `CSSImportRule` (en-US)
* `CSSKeyframeRule` (en-US)
* `CSSKeyframesRule` (en-US)
* `CSSKeywordValue` (en-US)
* `CSSLayerBlockRule` (en-US)
* `CSSLayerStatementRule` (en-US)
* `CSSMathInvert` (en-US)
* `CSSMathMax` (en-US)
* `CSSMathMin` (en-US)
* `CSSMathNegate` (en-US)
* `CSSMathProduct` (en-US)
* `CSSMathSum` (en-US)
* `CSSMathValue` (en-US)
* `CSSMatrixComponent` (en-US)
* `CSSMediaRule` (en-US)
* `CSSNamespaceRule` (en-US)
* `CSSNumericArray` (en-US)
* `CSSNumericValue` (en-US)
* `CSSPageRule` (en-US)
* `CSSPerspective` (en-US)
* `CSSPositionValue` (en-US)
Non-standard

Устарело
* `CSSPrimitiveValue` (en-US)
Устарело
* `CSSPropertyRule` (en-US)
* `CSSPseudoElement` (en-US)
Экспериментальная возможность
* `CSSRotate` (en-US)
* `CSSRule`
* `CSSRuleList` (en-US)
* `CSSScale` (en-US)
* `CSSScopeRule` (en-US)
Экспериментальная возможность
* `CSSSkew` (en-US)
* `CSSSkewX` (en-US)
* `CSSSkewY` (en-US)
* `CSSStartingStyleRule` (en-US)
Экспериментальная возможность
* `CSSStyleDeclaration`
* `CSSStyleRule` (en-US)
* `CSSStyleSheet`
* `CSSStyleValue` (en-US)
* `CSSSupportsRule` (en-US)
* `CSSTransformComponent` (en-US)
* `CSSTransformValue` (en-US)
* `CSSTransition` (en-US)
* `CSSTranslate` (en-US)
* `CSSUnitValue` (en-US)
* `CSSUnparsedValue` (en-US)
* `CSSValue`
Устарело
* `CSSValueList` (en-US)
Устарело
* `CSSVariableReferenceValue` (en-US)
* `CustomElementRegistry` (en-US)
* `CustomEvent` (en-US)
* `CustomStateSet` (en-US)
Экспериментальная возможность

### D

* `DataTransfer`
* `DataTransferItem` (en-US)
* `DataTransferItemList` (en-US)
* `DecompressionStream` (en-US)
* `DedicatedWorkerGlobalScope` (en-US)
* `DelayNode` (en-US)
* `DeprecationReportBody` (en-US)
Экспериментальная возможность
* `DeviceMotionEvent` (en-US)
* `DeviceMotionEventAcceleration` (en-US)
* `DeviceMotionEventRotationRate` (en-US)
* `DeviceOrientationEvent` (en-US)
* `DirectoryEntrySync` (en-US)
Non-standard

Устарело
* `DirectoryReaderSync` (en-US)
Non-standard

Устарело
* `Document`
* `DocumentFragment`
* `DocumentPictureInPicture` (en-US)
Экспериментальная возможность
* `DocumentPictureInPictureEvent` (en-US)
Экспериментальная возможность
* `DocumentTimeline` (en-US)
* `DocumentType` (en-US)
* `DOMError` (en-US)
Устарело
* `DOMException` (en-US)
* `DOMHighResTimeStamp`
* `DOMImplementation`
* `DOMMatrix` (WebKitCSSMatrix) (en-US)
* `DOMMatrixReadOnly` (en-US)
* `DOMParser`
* `DOMPoint` (en-US)
* `DOMPointReadOnly` (en-US)
* `DOMQuad` (en-US)
* `DOMRect` (en-US)
* `DOMRectReadOnly` (en-US)
* `DOMStringList`
* `DOMStringMap`
* `DOMTokenList`
* `DragEvent` (en-US)
* `DynamicsCompressorNode` (en-US)

### E

* `EcdhKeyDeriveParams` (en-US)
* `EcdsaParams` (en-US)
* `EcKeyGenParams` (en-US)
* `EcKeyImportParams` (en-US)
* `EditContext` (en-US)
Экспериментальная возможность
* `Element`
* `ElementInternals` (en-US)
* `EncodedAudioChunk` (en-US)
Экспериментальная возможность
* `EncodedVideoChunk` (en-US)
* `ErrorEvent` (en-US)
* `Event`
* `EventCounts` (en-US)
* `EventSource`
* `EventTarget`
* `ExtendableCookieChangeEvent` (en-US)
* `ExtendableEvent` (en-US)
* `ExtendableMessageEvent` (en-US)
* `EyeDropper` (en-US)
Экспериментальная возможность

### F

* `FeaturePolicy` (en-US)
Экспериментальная возможность
* `FederatedCredential` (en-US)
Экспериментальная возможность
* `FetchEvent`
* `File`
* `FileEntrySync` (en-US)
Non-standard

Устарело
* `FileList`
* `FileReader`
* `FileReaderSync` (en-US)
* `FileSystem` (en-US)
* `FileSystemDirectoryEntry` (en-US)
* `FileSystemDirectoryHandle` (en-US)
* `FileSystemDirectoryReader` (en-US)
* `FileSystemEntry` (en-US)
* `FileSystemFileEntry` (en-US)
* `FileSystemFileHandle` (en-US)
* `FileSystemHandle` (en-US)
* `FileSystemSync` (en-US)
Non-standard

Устарело
* `FileSystemSyncAccessHandle` (en-US)
* `FileSystemWritableFileStream` (en-US)
* `FocusEvent` (en-US)
* `FontData` (en-US)
Экспериментальная возможность
* `FontFace`
* `FontFaceSet` (en-US)
* `FontFaceSetLoadEvent` (en-US)
* `FormData`
* `FormDataEvent` (en-US)
* `FragmentDirective` (en-US)
Экспериментальная возможность

### G

* `GainNode` (en-US)
* `Gamepad`
* `GamepadButton`
* `GamepadEvent`
* `GamepadHapticActuator` (en-US)
* `GamepadPose` (en-US)
Экспериментальная возможность
* `Geolocation`
* `GeolocationCoordinates`
* `GeolocationPosition`
* `GeolocationPositionError`
* `GestureEvent` (en-US)
Non-standard
* `GPU` (en-US)
Экспериментальная возможность
* `GPUAdapter` (en-US)
Экспериментальная возможность
* `GPUAdapterInfo` (en-US)
Экспериментальная возможность
* `GPUBindGroup` (en-US)
Экспериментальная возможность
* `GPUBindGroupLayout` (en-US)
Экспериментальная возможность
* `GPUBuffer` (en-US)
Экспериментальная возможность
* `GPUCanvasContext` (en-US)
Экспериментальная возможность
* `GPUCommandBuffer` (en-US)
Экспериментальная возможность
* `GPUCommandEncoder` (en-US)
Экспериментальная возможность
* `GPUCompilationInfo` (en-US)
Экспериментальная возможность
* `GPUCompilationMessage` (en-US)
Экспериментальная возможность
* `GPUComputePassEncoder` (en-US)
Экспериментальная возможность
* `GPUComputePipeline` (en-US)
Экспериментальная возможность
* `GPUDevice` (en-US)
Экспериментальная возможность
* `GPUDeviceLostInfo` (en-US)
Экспериментальная возможность
* `GPUError` (en-US)
Экспериментальная возможность
* `GPUExternalTexture` (en-US)
Экспериментальная возможность
* `GPUInternalError` (en-US)
Экспериментальная возможность
* `GPUOutOfMemoryError` (en-US)
Экспериментальная возможность
* `GPUPipelineError` (en-US)
Экспериментальная возможность
* `GPUPipelineLayout` (en-US)
Экспериментальная возможность
* `GPUQuerySet` (en-US)
Экспериментальная возможность
* `GPUQueue` (en-US)
Экспериментальная возможность
* `GPURenderBundle` (en-US)
Экспериментальная возможность
* `GPURenderBundleEncoder` (en-US)
Экспериментальная возможность
* `GPURenderPassEncoder` (en-US)
Экспериментальная возможность
* `GPURenderPipeline` (en-US)
Экспериментальная возможность
* `GPUSampler` (en-US)
Экспериментальная возможность
* `GPUShaderModule` (en-US)
Экспериментальная возможность
* `GPUSupportedFeatures` (en-US)
Экспериментальная возможность
* `GPUSupportedLimits` (en-US)
Экспериментальная возможность
* `GPUTexture` (en-US)
Экспериментальная возможность
* `GPUTextureView` (en-US)
Экспериментальная возможность
* `GPUUncapturedErrorEvent` (en-US)
Экспериментальная возможность
* `GPUValidationError` (en-US)
Экспериментальная возможность
* `GravitySensor` (en-US)
* `Gyroscope`

### H

* `HashChangeEvent` (en-US)
* `Headers` (en-US)
* `HID` (en-US)
Экспериментальная возможность
* `HIDConnectionEvent` (en-US)
Экспериментальная возможность
* `HIDDevice` (en-US)
Экспериментальная возможность
* `HIDInputReportEvent` (en-US)
Экспериментальная возможность
* `Highlight` (en-US)
* `HighlightRegistry` (en-US)
* `History`
* `HkdfParams` (en-US)
* `HmacImportParams` (en-US)
* `HmacKeyGenParams` (en-US)
* `HMDVRDevice` (en-US)
Non-standard

Устарело
* `HTMLAllCollection` (en-US)
* `HTMLAnchorElement`
* `HTMLAreaElement`
* `HTMLAudioElement`
* `HTMLBaseElement`
* `HTMLBodyElement`
* `HTMLBRElement`
* `HTMLButtonElement`
* `HTMLCanvasElement`
* `HTMLCollection`
* `HTMLDataElement`
* `HTMLDataListElement` (en-US)
* `HTMLDetailsElement` (en-US)
* `HTMLDialogElement`
* `HTMLDivElement`
* `HTMLDListElement` (en-US)
* `HTMLDocument`
* `HTMLElement`
* `HTMLEmbedElement` (en-US)
* `HTMLFieldSetElement` (en-US)
* `HTMLFontElement` (en-US)
Устарело
* `HTMLFormControlsCollection` (en-US)
* `HTMLFormElement` (en-US)
* `HTMLFrameSetElement` (en-US)
Устарело
* `HTMLHeadElement`
* `HTMLHeadingElement`
* `HTMLHRElement` (en-US)
* `HTMLHtmlElement` (en-US)
* `HTMLIFrameElement` (en-US)
* `HTMLImageElement`
* `HTMLInputElement` (en-US)
* `HTMLLabelElement` (en-US)
* `HTMLLegendElement` (en-US)
* `HTMLLIElement` (en-US)
* `HTMLLinkElement`
* `HTMLMapElement` (en-US)
* `HTMLMarqueeElement` (en-US)
Устарело
* `HTMLMediaElement`
* `HTMLMenuElement` (en-US)
* `HTMLMenuItemElement` (en-US)
Non-standard

Устарело
* `HTMLMetaElement` (en-US)
* `HTMLMeterElement` (en-US)
* `HTMLModElement` (en-US)
* `HTMLObjectElement` (en-US)
* `HTMLOListElement` (en-US)
* `HTMLOptGroupElement` (en-US)
* `HTMLOptionElement` (en-US)
* `HTMLOptionsCollection` (en-US)
* `HTMLOutputElement` (en-US)
* `HTMLParagraphElement` (en-US)
* `HTMLParamElement` (en-US)
Устарело
* `HTMLPictureElement` (en-US)
* `HTMLPreElement` (en-US)
* `HTMLProgressElement` (en-US)
* `HTMLQuoteElement` (en-US)
* `HTMLScriptElement`
* `HTMLSelectElement` (en-US)
* `HTMLSlotElement`
* `HTMLSourceElement` (en-US)
* `HTMLSpanElement` (en-US)
* `HTMLStyleElement` (en-US)
* `HTMLTableCaptionElement` (en-US)
* `HTMLTableCellElement` (en-US)
* `HTMLTableColElement` (en-US)
* `HTMLTableElement`
* `HTMLTableRowElement` (en-US)
* `HTMLTableSectionElement` (en-US)
* `HTMLTemplateElement` (en-US)
* `HTMLTextAreaElement` (en-US)
* `HTMLTimeElement`
* `HTMLTitleElement` (en-US)
* `HTMLTrackElement`
* `HTMLUListElement` (en-US)
* `HTMLUnknownElement`
* `HTMLVideoElement`

### I

* `IDBCursor` (en-US)
* `IDBCursorWithValue` (en-US)
* `IDBDatabase` (en-US)
* `IDBFactory` (en-US)
* `IDBIndex` (en-US)
* `IDBKeyRange` (en-US)
* `IDBLocaleAwareKeyRange` (en-US)
Экспериментальная возможность

Non-standard
* `IDBObjectStore` (en-US)
* `IDBOpenDBRequest` (en-US)
* `IDBRequest` (en-US)
* `IDBTransaction` (en-US)
* `IDBVersionChangeEvent` (en-US)
* `IdentityCredential` (en-US)
Экспериментальная возможность
* `IdentityProvider` (en-US)
Экспериментальная возможность
* `IdleDeadline` (en-US)
* `IdleDetector` (en-US)
Экспериментальная возможность
* `IIRFilterNode` (en-US)
* `ImageBitmap`
* `ImageBitmapRenderingContext` (en-US)
* `ImageCapture` (en-US)
Экспериментальная возможность
* `ImageData`
* `ImageDecoder` (en-US)
Экспериментальная возможность
* `ImageTrack` (en-US)
Экспериментальная возможность
* `ImageTrackList` (en-US)
Экспериментальная возможность
* `Ink` (en-US)
Экспериментальная возможность
* `InkPresenter` (en-US)
Экспериментальная возможность
* `InputDeviceCapabilities` (en-US)
Экспериментальная возможность
* `InputDeviceInfo` (en-US)
* `InputEvent` (en-US)
* `InstallEvent` (en-US)
Non-standard

Устарело
* `IntersectionObserver`
* `IntersectionObserverEntry` (en-US)
* `InterventionReportBody` (en-US)
Экспериментальная возможность

### K

* `Keyboard` (en-US)
Экспериментальная возможность
* `KeyboardEvent`
* `KeyboardLayoutMap` (en-US)
Экспериментальная возможность
* `KeyframeEffect` (en-US)

### L

* `LargestContentfulPaint` (en-US)
* `LaunchParams` (en-US)
Экспериментальная возможность
* `LaunchQueue` (en-US)
Экспериментальная возможность
* `LayoutShift` (en-US)
Экспериментальная возможность
* `LayoutShiftAttribution` (en-US)
Экспериментальная возможность
* `LinearAccelerationSensor` (en-US)
* `Location`
* `Lock` (en-US)
* `LockManager` (en-US)

### M

* `Magnetometer` (en-US)
Экспериментальная возможность
* `MathMLElement` (en-US)
* `MediaCapabilities` (en-US)
* `MediaDeviceInfo` (en-US)
* `MediaDevices`
* `MediaElementAudioSourceNode`
* `MediaEncryptedEvent` (en-US)
* `MediaError`
* `MediaKeyMessageEvent` (en-US)
* `MediaKeys` (en-US)
* `MediaKeySession` (en-US)
* `MediaKeyStatusMap` (en-US)
* `MediaKeySystemAccess` (en-US)
* `MediaList` (en-US)
* `MediaMetadata` (en-US)
* `MediaQueryList` (en-US)
* `MediaQueryListEvent` (en-US)
* `MediaRecorder`
* `MediaRecorderErrorEvent` (en-US)
Non-standard

Устарело
* `MediaSession` (en-US)
* `MediaSource`
* `MediaSourceHandle` (en-US)
Экспериментальная возможность
* `MediaStream`
* `MediaStreamAudioDestinationNode` (en-US)
* `MediaStreamAudioSourceNode` (en-US)
* `MediaStreamEvent` (en-US)
Non-standard

Устарело
* `MediaStreamTrack`
* `MediaStreamTrackAudioSourceNode` (en-US)
* `MediaStreamTrackEvent` (en-US)
* `MediaStreamTrackGenerator` (en-US)
Экспериментальная возможность

Non-standard
* `MediaStreamTrackProcessor` (en-US)
Экспериментальная возможность
* `MediaTrackConstraints` (en-US)
* `MediaTrackSettings` (en-US)
* `MediaTrackSupportedConstraints` (en-US)
* `MerchantValidationEvent` (en-US)
Устарело
* `MessageChannel` (en-US)
* `MessageEvent` (en-US)
* `MessagePort` (en-US)
* `Metadata` (en-US)
Экспериментальная возможность

Non-standard
* `MIDIAccess` (en-US)
* `MIDIConnectionEvent` (en-US)
* `MIDIInput` (en-US)
* `MIDIInputMap` (en-US)
* `MIDIMessageEvent` (en-US)
* `MIDIOutput` (en-US)
* `MIDIOutputMap` (en-US)
* `MIDIPort` (en-US)
* `MimeType` (en-US)
Устарело
* `MimeTypeArray` (en-US)
Устарело
* `MouseEvent`
* `MouseScrollEvent` (en-US)
Non-standard

Устарело
* `MutationEvent` (en-US)
Устарело
* `MutationObserver`
* `MutationRecord` (en-US)

### N

* `NamedNodeMap`
* `NavigateEvent` (en-US)
Экспериментальная возможность
* `Navigation` (en-US)
Экспериментальная возможность
* `NavigationCurrentEntryChangeEvent` (en-US)
Экспериментальная возможность
* `NavigationDestination` (en-US)
Экспериментальная возможность
* `NavigationHistoryEntry` (en-US)
Экспериментальная возможность
* `NavigationPreloadManager` (en-US)
* `NavigationTransition` (en-US)
Экспериментальная возможность
* `Navigator`
* `NavigatorUAData` (en-US)
Экспериментальная возможность
* `NDEFMessage` (en-US)
Экспериментальная возможность
* `NDEFReader` (en-US)
Экспериментальная возможность
* `NDEFReadingEvent` (en-US)
Экспериментальная возможность
* `NDEFRecord` (en-US)
Экспериментальная возможность
* `NetworkInformation`
Экспериментальная возможность
* `Node`
* `NodeIterator` (en-US)
* `NodeList`
* `Notification`
* `NotificationEvent` (en-US)

### O

* `OES_draw_buffers_indexed` (en-US)
* `OfflineAudioCompletionEvent` (en-US)
* `OfflineAudioContext` (en-US)
* `OffscreenCanvas` (en-US)
* `OffscreenCanvasRenderingContext2D` (en-US)
* `OrientationSensor` (en-US)
* `OscillatorNode` (en-US)
* `OTPCredential` (en-US)
Экспериментальная возможность
* `OverconstrainedError` (en-US)

### P

* `PageTransitionEvent` (en-US)
* `PaintWorkletGlobalScope` (en-US)
Экспериментальная возможность
* `PannerNode`
* `PasswordCredential` (en-US)
Экспериментальная возможность
* `Path2D` (en-US)
* `PaymentAddress` (en-US)
Non-standard

Устарело
* `PaymentManager` (en-US)
Экспериментальная возможность
* `PaymentMethodChangeEvent` (en-US)
* `PaymentRequest`
* `PaymentRequestEvent` (en-US)
Экспериментальная возможность
* `PaymentRequestUpdateEvent` (en-US)
* `PaymentResponse` (en-US)
* `Pbkdf2Params` (en-US)
* `Performance`
* `PerformanceElementTiming` (en-US)
Экспериментальная возможность
* `PerformanceEntry` (en-US)
* `PerformanceEventTiming` (en-US)
* `PerformanceLongTaskTiming` (en-US)
Экспериментальная возможность
* `PerformanceMark` (en-US)
* `PerformanceMeasure` (en-US)
* `PerformanceNavigation` (en-US)
Устарело
* `PerformanceNavigationTiming` (en-US)
* `PerformanceObserver` (en-US)
* `PerformanceObserverEntryList` (en-US)
* `PerformancePaintTiming` (en-US)
* `PerformanceResourceTiming` (en-US)
* `PerformanceServerTiming` (en-US)
* `PerformanceTiming` (en-US)
Устарело
* `PeriodicSyncEvent` (en-US)
Экспериментальная возможность
* `PeriodicSyncManager` (en-US)
Экспериментальная возможность
* `PeriodicWave` (en-US)
* `Permissions` (en-US)
* `PermissionStatus` (en-US)
* `PictureInPictureEvent` (en-US)
* `PictureInPictureWindow` (en-US)
* `Plugin` (en-US)
Устарело
* `PluginArray` (en-US)
Устарело
* `Point` (en-US)
Non-standard

Устарело
* `PointerEvent` (en-US)
* `PopStateEvent` (en-US)
* `PositionSensorVRDevice` (en-US)
Non-standard

Устарело
* `Presentation` (en-US)
Экспериментальная возможность
* `PresentationAvailability` (en-US)
Экспериментальная возможность
* `PresentationConnection` (en-US)
Экспериментальная возможность
* `PresentationConnectionAvailableEvent` (en-US)
Экспериментальная возможность
* `PresentationConnectionCloseEvent` (en-US)
Экспериментальная возможность
* `PresentationConnectionList` (en-US)
Экспериментальная возможность
* `PresentationReceiver` (en-US)
Экспериментальная возможность
* `PresentationRequest` (en-US)
Экспериментальная возможность
* `ProcessingInstruction` (en-US)
* `ProgressEvent` (en-US)
* `PromiseRejectionEvent` (en-US)
* `PublicKeyCredential` (en-US)
* `PushEvent` (en-US)
* `PushManager`
* `PushMessageData` (en-US)
* `PushSubscription` (en-US)
* `PushSubscriptionOptions` (en-US)

### R

* `RadioNodeList` (en-US)
* `Range`
* `ReadableByteStreamController` (en-US)
* `ReadableStream` (en-US)
* `ReadableStreamBYOBReader` (en-US)
* `ReadableStreamBYOBRequest` (en-US)
* `ReadableStreamDefaultController` (en-US)
* `ReadableStreamDefaultReader` (en-US)
* `RelativeOrientationSensor` (en-US)
* `RemotePlayback` (en-US)
* `Report` (en-US)
* `ReportBody` (en-US)
* `ReportingObserver` (en-US)
* `Request`
* `ResizeObserver` (en-US)
* `ResizeObserverEntry` (en-US)
* `ResizeObserverSize` (en-US)
* `Response`
* `RsaHashedImportParams` (en-US)
* `RsaHashedKeyGenParams` (en-US)
* `RsaOaepParams` (en-US)
* `RsaPssParams` (en-US)
* `RTCAudioSourceStats` (en-US)
* `RTCCertificate` (en-US)
* `RTCCertificateStats` (en-US)
* `RTCDataChannel` (en-US)
* `RTCDataChannelEvent` (en-US)
* `RTCDtlsTransport` (en-US)
* `RTCDTMFSender` (en-US)
* `RTCDTMFToneChangeEvent` (en-US)
* `RTCEncodedAudioFrame` (en-US)
* `RTCEncodedVideoFrame` (en-US)
* `RTCError` (en-US)
* `RTCErrorEvent` (en-US)
* `RTCIceCandidate` (en-US)
* `RTCIceCandidatePair` (en-US)
* `RTCIceCandidatePairStats` (en-US)
* `RTCIceCandidateStats` (en-US)
* `RTCIceParameters` (en-US)
* `RTCIceTransport` (en-US)
* `RTCIdentityAssertion` (en-US)
Экспериментальная возможность
* `RTCInboundRtpStreamStats` (en-US)
* `RTCOutboundRtpStreamStats` (en-US)
* `RTCPeerConnection`
* `RTCPeerConnectionIceErrorEvent` (en-US)
* `RTCPeerConnectionIceEvent` (en-US)
* `RTCPeerConnectionStats` (en-US)
* `RTCRemoteOutboundRtpStreamStats` (en-US)
* `RTCRtpCodecParameters` (en-US)
* `RTCRtpReceiver` (en-US)
* `RTCRtpScriptTransform` (en-US)
* `RTCRtpScriptTransformer` (en-US)
* `RTCRtpSender` (en-US)
* `RTCRtpStreamStats` (en-US)
* `RTCRtpTransceiver` (en-US)
* `RTCSctpTransport` (en-US)
* `RTCSessionDescription` (en-US)
* `RTCStatsReport` (en-US)
* `RTCTrackEvent` (en-US)
* `RTCTransformEvent` (en-US)
* `RTCTransportStats` (en-US)

### S

* `Sanitizer` (en-US)
Экспериментальная возможность
* `Scheduler` (en-US)
* `Scheduling` (en-US)
Экспериментальная возможность
* `Screen`
* `ScreenDetailed` (en-US)
Экспериментальная возможность
* `ScreenDetails` (en-US)
Экспериментальная возможность
* `ScreenOrientation` (en-US)
* `ScriptProcessorNode` (en-US)
Устарело
* `ScrollTimeline` (en-US)
Экспериментальная возможность
* `SecurePaymentConfirmationRequest` (en-US)
* `SecurityPolicyViolationEvent` (en-US)
* `Selection` (en-US)
* `Sensor`
* `SensorErrorEvent` (en-US)
* `Serial` (en-US)
Экспериментальная возможность
* `SerialPort` (en-US)
Экспериментальная возможность
* `ServiceWorker`
* `ServiceWorkerContainer`
* `ServiceWorkerGlobalScope` (en-US)
* `ServiceWorkerRegistration`
* `ShadowRoot` (en-US)
* `SharedStorage` (en-US)
Экспериментальная возможность
* `SharedStorageOperation` (en-US)
Экспериментальная возможность
* `SharedStorageRunOperation` (en-US)
Экспериментальная возможность
* `SharedStorageSelectURLOperation` (en-US)
Экспериментальная возможность
* `SharedStorageWorklet` (en-US)
Экспериментальная возможность
* `SharedStorageWorkletGlobalScope` (en-US)
Экспериментальная возможность
* `SharedWorker`
* `SharedWorkerGlobalScope` (en-US)
* `SourceBuffer` (en-US)
* `SourceBufferList` (en-US)
* `SpeechGrammar`
Экспериментальная возможность
* `SpeechGrammarList` (en-US)
Экспериментальная возможность
* `SpeechRecognition`
* `SpeechRecognitionAlternative` (en-US)
* `SpeechRecognitionErrorEvent` (en-US)
* `SpeechRecognitionEvent` (en-US)
* `SpeechRecognitionResult` (en-US)
* `SpeechRecognitionResultList` (en-US)
* `SpeechSynthesis` (en-US)
* `SpeechSynthesisErrorEvent` (en-US)
* `SpeechSynthesisEvent` (en-US)
* `SpeechSynthesisUtterance`
* `SpeechSynthesisVoice` (en-US)
* `StaticRange` (en-US)
* `StereoPannerNode` (en-US)
* `Storage`
* `StorageEvent` (en-US)
* `StorageManager`
* `StylePropertyMap` (en-US)
* `StylePropertyMapReadOnly` (en-US)
* `StyleSheet`
* `StyleSheetList` (en-US)
* `SubmitEvent` (en-US)
* `SubtleCrypto`
* `SVGAElement`
* `SVGAngle` (en-US)
* `SVGAnimateColorElement` (en-US)
Устарело
* `SVGAnimatedAngle` (en-US)
* `SVGAnimatedBoolean` (en-US)
* `SVGAnimatedEnumeration` (en-US)
* `SVGAnimatedInteger` (en-US)
* `SVGAnimatedLength` (en-US)
* `SVGAnimatedLengthList` (en-US)
* `SVGAnimatedNumber` (en-US)
* `SVGAnimatedNumberList` (en-US)
* `SVGAnimatedPreserveAspectRatio` (en-US)
* `SVGAnimatedRect` (en-US)
* `SVGAnimatedString` (en-US)
* `SVGAnimatedTransformList` (en-US)
* `SVGAnimateElement` (en-US)
* `SVGAnimateMotionElement` (en-US)
* `SVGAnimateTransformElement` (en-US)
* `SVGAnimationElement` (en-US)
* `SVGCircleElement` (en-US)
* `SVGClipPathElement` (en-US)
* `SVGComponentTransferFunctionElement` (en-US)
* `SVGCursorElement` (en-US)
Устарело
* `SVGDefsElement` (en-US)
* `SVGDescElement` (en-US)
* `SVGElement` (en-US)
* `SVGEllipseElement` (en-US)
* `SVGEvent` (en-US)
* `SVGFEBlendElement` (en-US)
* `SVGFEColorMatrixElement` (en-US)
* `SVGFEComponentTransferElement` (en-US)
* `SVGFECompositeElement` (en-US)
* `SVGFEConvolveMatrixElement` (en-US)
* `SVGFEDiffuseLightingElement` (en-US)
* `SVGFEDisplacementMapElement` (en-US)
* `SVGFEDistantLightElement` (en-US)
* `SVGFEDropShadowElement` (en-US)
* `SVGFEFloodElement` (en-US)
* `SVGFEFuncAElement` (en-US)
* `SVGFEFuncBElement` (en-US)
* `SVGFEFuncGElement` (en-US)
* `SVGFEFuncRElement` (en-US)
* `SVGFEGaussianBlurElement` (en-US)
* `SVGFEImageElement` (en-US)
* `SVGFEMergeElement` (en-US)
* `SVGFEMergeNodeElement` (en-US)
* `SVGFEMorphologyElement` (en-US)
* `SVGFEOffsetElement` (en-US)
* `SVGFEPointLightElement` (en-US)
* `SVGFESpecularLightingElement` (en-US)
* `SVGFESpotLightElement` (en-US)
* `SVGFETileElement` (en-US)
* `SVGFETurbulenceElement` (en-US)
* `SVGFilterElement` (en-US)
* `SVGFontElement` (en-US)
Устарело
* `SVGFontFaceElement` (en-US)
Устарело
* `SVGFontFaceFormatElement` (en-US)
Устарело
* `SVGFontFaceNameElement` (en-US)
Устарело
* `SVGFontFaceSrcElement` (en-US)
Устарело
* `SVGFontFaceUriElement` (en-US)
Устарело
* `SVGForeignObjectElement` (en-US)
* `SVGGElement` (en-US)
* `SVGGeometryElement` (en-US)
* `SVGGlyphElement` (en-US)
Устарело
* `SVGGlyphRefElement` (en-US)
Устарело
* `SVGGradientElement` (en-US)
* `SVGGraphicsElement`
* `SVGHKernElement` (en-US)
Устарело
* `SVGImageElement` (en-US)
* `SVGLength` (en-US)
* `SVGLengthList` (en-US)
* `SVGLinearGradientElement` (en-US)
* `SVGLineElement` (en-US)
* `SVGMarkerElement` (en-US)
* `SVGMaskElement` (en-US)
* `SVGMetadataElement` (en-US)
* `SVGMissingGlyphElement` (en-US)
Устарело
* `SVGMPathElement` (en-US)
* `SVGNumber` (en-US)
* `SVGNumberList` (en-US)
* `SVGPathElement` (en-US)
* `SVGPatternElement` (en-US)
* `SVGPoint` (en-US)
Устарело
* `SVGPointList` (en-US)
* `SVGPolygonElement` (en-US)
* `SVGPolylineElement` (en-US)
* `SVGPreserveAspectRatio` (en-US)
* `SVGRadialGradientElement` (en-US)
* `SVGRect` (en-US)
* `SVGRectElement` (en-US)
* `SVGRenderingIntent` (en-US)
Устарело
* `SVGScriptElement` (en-US)
* `SVGSetElement` (en-US)
* `SVGStopElement` (en-US)
* `SVGStringList` (en-US)
* `SVGStyleElement` (en-US)
* `SVGSVGElement` (en-US)
* `SVGSwitchElement` (en-US)
* `SVGSymbolElement` (en-US)
* `SVGTextContentElement`
* `SVGTextElement`
* `SVGTextPathElement` (en-US)
* `SVGTextPositioningElement` (en-US)
* `SVGTitleElement` (en-US)
* `SVGTransform` (en-US)
* `SVGTransformList` (en-US)
* `SVGTRefElement` (en-US)
Устарело
* `SVGTSpanElement` (en-US)
* `SVGUnitTypes` (en-US)
* `SVGUseElement` (en-US)
* `SVGViewElement` (en-US)
* `SVGVKernElement` (en-US)
Устарело
* `SyncEvent` (en-US)
Экспериментальная возможность
* `SyncManager` (en-US)
Экспериментальная возможность

### T

* `TaskAttributionTiming` (en-US)
Экспериментальная возможность
* `TaskController` (en-US)
* `TaskPriorityChangeEvent` (en-US)
* `TaskSignal` (en-US)
* `Text`
* `TextDecoder` (en-US)
* `TextDecoderStream` (en-US)
* `TextEncoder` (en-US)
* `TextEncoderStream` (en-US)
* `TextFormat` (en-US)
Экспериментальная возможность
* `TextFormatUpdateEvent` (en-US)
Экспериментальная возможность
* `TextMetrics` (en-US)
* `TextTrack` (en-US)
* `TextTrackCue` (en-US)
* `TextTrackCueList` (en-US)
* `TextTrackList` (en-US)
* `TextUpdateEvent` (en-US)
Экспериментальная возможность
* `TimeEvent` (en-US)
* `TimeRanges` (en-US)
* `ToggleEvent` (en-US)
* `Touch`
* `TouchEvent`
* `TouchList`
* `TrackEvent` (en-US)
* `TransformStream` (en-US)
* `TransformStreamDefaultController` (en-US)
* `TransitionEvent` (en-US)
* `TreeWalker` (en-US)
* `TrustedHTML` (en-US)
* `TrustedScript` (en-US)
* `TrustedScriptURL` (en-US)
* `TrustedTypePolicy` (en-US)
* `TrustedTypePolicyFactory` (en-US)

### U

* `UIEvent` (en-US)
* `URL`
* `URLPattern` (en-US)
Экспериментальная возможность
* `URLSearchParams`
* `USB`
Экспериментальная возможность
* `USBAlternateInterface` (en-US)
Экспериментальная возможность
* `USBConfiguration` (en-US)
Экспериментальная возможность
* `USBConnectionEvent` (en-US)
Экспериментальная возможность
* `USBDevice` (en-US)
Экспериментальная возможность
* `USBEndpoint` (en-US)
Экспериментальная возможность
* `USBInterface` (en-US)
Экспериментальная возможность
* `USBInTransferResult` (en-US)
Экспериментальная возможность
* `USBIsochronousInTransferPacket` (en-US)
Экспериментальная возможность
* `USBIsochronousInTransferResult` (en-US)
Экспериментальная возможность
* `USBIsochronousOutTransferPacket` (en-US)
Экспериментальная возможность
* `USBIsochronousOutTransferResult` (en-US)
Экспериментальная возможность
* `USBOutTransferResult` (en-US)
Экспериментальная возможность
* `UserActivation` (en-US)

### V

* `ValidityState`
* `VideoColorSpace` (en-US)
* `VideoDecoder` (en-US)
* `VideoEncoder` (en-US)
* `VideoFrame` (en-US)
* `VideoPlaybackQuality` (en-US)
* `VideoTrack` (en-US)
* `VideoTrackList` (en-US)
* `ViewTimeline` (en-US)
Экспериментальная возможность
* `ViewTransition` (en-US)
Экспериментальная возможность
* `VirtualKeyboard` (en-US)
Экспериментальная возможность
* `VisibilityStateEntry` (en-US)
Экспериментальная возможность
* `VisualViewport` (en-US)
* `VRDisplay` (en-US)
Non-standard

Устарело
* `VRDisplayCapabilities`
Non-standard

Устарело
* `VRDisplayEvent`
Non-standard

Устарело
* `VREyeParameters` (en-US)
Non-standard

Устарело
* `VRFieldOfView` (en-US)
Non-standard

Устарело
* `VRFrameData`
Non-standard

Устарело
* `VRLayerInit` (en-US)
Устарело
* `VRPose` (en-US)
Non-standard

Устарело
* `VRStageParameters` (en-US)
Non-standard

Устарело
* `VTTCue` (en-US)
* `VTTRegion` (en-US)

### W

* `WakeLock` (en-US)
* `WakeLockSentinel` (en-US)
* `WaveShaperNode` (en-US)
* `WebGL2RenderingContext` (en-US)
* `WebGLActiveInfo` (en-US)
* `WebGLBuffer` (en-US)
* `WebGLContextEvent` (en-US)
* `WebGLFramebuffer` (en-US)
* `WebGLObject` (en-US)
* `WebGLProgram`
* `WebGLQuery` (en-US)
* `WebGLRenderbuffer` (en-US)
* `WebGLRenderingContext`
* `WebGLSampler` (en-US)
* `WebGLShader` (en-US)
* `WebGLShaderPrecisionFormat` (en-US)
* `WebGLSync` (en-US)
* `WebGLTexture` (en-US)
* `WebGLTransformFeedback` (en-US)
* `WebGLUniformLocation` (en-US)
* `WebGLVertexArrayObject` (en-US)
* `WebSocket`
* `WebTransport` (en-US)
* `WebTransportBidirectionalStream` (en-US)
* `WebTransportDatagramDuplexStream` (en-US)
* `WebTransportError` (en-US)
* `WebTransportReceiveStream` (en-US)
Экспериментальная возможность
* `WebTransportSendStream` (en-US)
Экспериментальная возможность
* `WGSLLanguageFeatures` (en-US)
Экспериментальная возможность
* `WheelEvent` (en-US)
* `Window`
* `WindowClient`
* `WindowControlsOverlay` (en-US)
Экспериментальная возможность
* `WindowControlsOverlayGeometryChangeEvent` (en-US)
Экспериментальная возможность
* `WindowSharedStorage` (en-US)
Экспериментальная возможность
* `Worker`
* `WorkerGlobalScope` (en-US)
* `WorkerLocation` (en-US)
* `WorkerNavigator` (en-US)
* `Worklet` (en-US)
* `WorkletGlobalScope` (en-US)
* `WorkletSharedStorage` (en-US)
Экспериментальная возможность
* `WritableStream` (en-US)
* `WritableStreamDefaultController` (en-US)
* `WritableStreamDefaultWriter` (en-US)

### X

* `XMLDocument`
* `XMLHttpRequest`
* `XMLHttpRequestEventTarget` (en-US)
* `XMLHttpRequestUpload` (en-US)
* `XMLSerializer`
* `XPathEvaluator` (en-US)
* `XPathException` (en-US)
* `XPathExpression` (en-US)
* `XPathNSResolver` (en-US)
* `XPathResult` (en-US)
* `XRAnchor` (en-US)
Экспериментальная возможность
* `XRAnchorSet` (en-US)
Экспериментальная возможность
* `XRBoundedReferenceSpace` (en-US)
Экспериментальная возможность
* `XRCompositionLayer` (en-US)
Экспериментальная возможность
* `XRCPUDepthInformation` (en-US)
Экспериментальная возможность
* `XRCubeLayer` (en-US)
Экспериментальная возможность
* `XRCylinderLayer` (en-US)
Экспериментальная возможность
* `XRDepthInformation` (en-US)
Экспериментальная возможность
* `XREquirectLayer` (en-US)
Экспериментальная возможность
* `XRFrame` (en-US)
Экспериментальная возможность
* `XRHand` (en-US)
* `XRHitTestResult` (en-US)
Экспериментальная возможность
* `XRHitTestSource` (en-US)
Экспериментальная возможность
* `XRInputSource` (en-US)
* `XRInputSourceArray` (en-US)
Экспериментальная возможность
* `XRInputSourceEvent` (en-US)
* `XRInputSourcesChangeEvent` (en-US)
* `XRJointPose` (en-US)
* `XRJointSpace` (en-US)
* `XRLayer` (en-US)
Экспериментальная возможность
* `XRLayerEvent` (en-US)
Экспериментальная возможность
* `XRLightEstimate` (en-US)
Экспериментальная возможность
* `XRLightProbe` (en-US)
Экспериментальная возможность
* `XRMediaBinding` (en-US)
Экспериментальная возможность
* `XRPose` (en-US)
* `XRProjectionLayer` (en-US)
Экспериментальная возможность
* `XRQuadLayer` (en-US)
Экспериментальная возможность
* `XRRay` (en-US)
Экспериментальная возможность
* `XRReferenceSpace` (en-US)
* `XRReferenceSpaceEvent` (en-US)
* `XRRenderState` (en-US)
Экспериментальная возможность
* `XRRigidTransform` (en-US)
* `XRSession` (en-US)
Экспериментальная возможность
* `XRSessionEvent` (en-US)
* `XRSpace` (en-US)
* `XRSubImage` (en-US)
Экспериментальная возможность
* `XRSystem` (en-US)
Экспериментальная возможность
* `XRTransientInputHitTestResult` (en-US)
Экспериментальная возможность
* `XRTransientInputHitTestSource` (en-US)
Экспериментальная возможность
* `XRView` (en-US)
Экспериментальная возможность
* `XRViewerPose` (en-US)
* `XRViewport` (en-US)
* `XRWebGLBinding` (en-US)
Экспериментальная возможность
* `XRWebGLDepthInformation` (en-US)
Экспериментальная возможность
* `XRWebGLLayer` (en-US)
Экспериментальная возможность
* `XRWebGLSubImage` (en-US)
Экспериментальная возможность
* `XSLTProcessor` (en-US)


XSLT

XSLT
====

**XSLT** (*Extensible Stylesheet Language Transformations*) — является языком на основе XML, используемым вместе со специализированным программным обеспечением для преобразования XML-документов. Спецификация XSLT является рекомендацией W3C.

Хотя этот процесс называется «преобразованием», исходный документ не изменяется; скорее новый документ XML создаётся на основе содержимого существующего документа. Затем новый документ может быть сериализован (выведен) процессором в стандартном синтаксисе XML или в другом формате, таком как HTML или простой текст.

XSLT чаще всего используется для преобразования данных между различными схемами XML или для преобразования данных XML в веб-страницы или документы PDF.


Web Performance

Web Performance
===============

Производительность в web - это объективные измерения и пользовательские ощущения, связанные с загрузкой и работой приложения. Производительность - это о том, как долго сайт грузится, становится интерактивным и отзывчивым, о том, как плавно происходит взаимодействие с контентом. Плавный ли скролл страницы? Все ли кнопки кликабельны? Всплывающие окна загружаются и показываются быстро? А анимируются? Хорошая производительность требует учёта всех аспектов: как объективных, например, фактическое время загрузки страницы или частота смены кадров; так и субъективных - в буквальном смысле "как пользователь воспринимает систему".

Чем дольше загружается ваше приложение, тем больше пользователей решаются избавиться от него. Очень важно уменьшать время загрузки приложения, а так же промежутка времени, за которое оно становится интерактивным. Но в то же время, важно добавлять в приложение новые возможности, которые уменьшают время отклика и делают приложение интерактивным за счёт неочевидных хитростей, например, за счёт асинхронной загрузки данных, которые не понадобятся пользователю "здесь и сейчас".

Существуют инструменты измерения производительности, API и лучшие практики, которые помогут нам измерять и улучшать производительность. Мы постараемся раскрыть их в следующей секции:

Ключевые статьи о производительности
------------------------------------

Lazy loading**Lazy loading (ленивая загрузка)** - это стратегия, направленная на определение ресурсов как неблокирующих (не критических) для того, чтобы отложить загрузку этих ресурсов на тот момент, когда они действительно необходимы. Так можно сократить длину критических этапов рендеринга, что приводит к уменьшению времени загрузки приложения.

Бюджет производительностиБюджет производительности - это лимит для предотвращения регрессий. Этот бюджет может быть применён к файлам, типам файлов, всем ресурсам приложения, определённым общим показателям (например, Время до интерактивности) пользовательским показателям (например, Время до главного элемента) или к пороговым значениям к определённым точкам во времени.

Время загрузки страницы и ресурсов**Тайминги навигации (Navigation timings)** - это показатели, указывающие временные метки, в которые произошли события навигации. **Тайминги ресурсов (Resource timings)** - это детальные показатели по времени загрузки ресурсов.

Время ожидания (latency)**Latency** (дальше - **время ожидания**) - это время, которое требуется на доставку пакета данных от источника к пункту назначения. В деле оптимизации производительности важно сокращать проблемы, которые приводят к длительному времени ожидания. Также необходимо научиться тестировать работу приложения в условиях плохого соединения. В этой статье мы рассмотрим само понятие времени ожидание, его причины, способы детекции и исправления.

Использование dns-prefetch**`DNS-prefetch`** (предзагрузка DNS) - это попытка определить IP адрес по имени домена до того, как ресурс с этого домена будет фактически запрошен. Это может быть загрузчик файлов, который используется позже или ссылка, по которой, вероятно, перейдёт пользователь.

Как работают браузерыПользователи хотят использовать приложения, в которых загрузка контента происходит быстро, а взаимодействие - плавно. Разработчик должен стараться оптимизировать своё приложение как минимум по этим двум показателям.

Критические этапы рендерингаКритические этапы рендеринга (Critical Rendering Path) - это последовательность шагов, которые выполняет браузер, когда преобразуется HTML, CSS и JavaScript в пиксели, которые вы видите на экране. Оптимизация этих шагов улучшает производительность рендера. Эти этапы включают в себя работу с Document Object Model(DOM), CSS Object Model(CSSOM), деревом рендера (render tree) и компоновкой объектов (layout)

Мониторинг производительности: реальные пользователи и их эмуляция**Синтетический мониторинг** и **мониторинг реальных пользователей (Real User Monitoring, RUM)** - два способа мониторинга и получения данных о веб-производительности. Эти два подхода дают два разных обзора производительности и каждый имеет свои преимущества, области применения и минусы. RUM, в основном, лучше подходит для понимания долгосрочных трендов, в то время как синтетический мониторинг хорошо подходит для тестирования регрессий, их быстрого обнаружения и быстрой реакции на них в процессе разработки. В этой статье мы определим и сравним оба подхода.

Оптимизация запускаЧасто упускаемый из вида аспект разработки приложений - это скорость запуска приложения. Даже если вы прикладываете много усилий к оптимизации работы приложений, именно этот этап может быть пропущен. Как долго запускается ваше приложение? Создаётся ли впечатление, что устройство зависает, пока приложение запускается? Все эти симптомы заставляют пользователя считать, что приложение сломано или что-то идёт не так. Всегда будет не лишним убедиться, что ваше приложение запускается плавно. В этой статье мы поделимся некоторыми подсказками, которые помогут вам оптимизировать запуск приложения, вне зависимости от того, пишете ли вы его с нуля или работаете над уже существующим.

Основы производительностиАнглийское слово Performance, которое используется в статьях о производительности приложений, также можно перевести, как "эффективность". Этот документ объясняет основы производительности, того как браузеры помогают улучшить её и какие инструменты и процессы вы можете использовать, чтобы её улучшить.

Производительность CSS и JavaScript анимацииАнимация является критичным инструментом для улучшения пользовательского опыта во многих приложениях. Существует много путей создания анимации в web, например, основанные на CSS-свойствах `transition`/`animation` или на JavaScript (using `Window.requestAnimationFrame`). В этой статье мы проанализируем производительность CSS и JavaScript анимаций и сравним их.

Производительность анимации и частота кадровАнимация в Вебе может быть сделана с помощью `SVGAnimationElement`, `window.requestAnimationFrame`, включая `canvas` и `WebGL_API`, CSS `animation`, `video`, анимированных GIF и даже с помощью анимированных PNG и других типов изображений. Производительность CSS-анимации может отличаться от одного CSS-свойства к другому, а попытка анимировать некоторые "дорогие" CSS-свойства может привести к зависаниям (jank), даже несмотря на то, что браузер борется за то, чтобы смягчить частоту смены кадров frame rate.

Тайминги производительности: как долго - долго?Не существует чётко установленного набора правил, который определяет медленную скорость загрузки страниц, но существуют особые руководства, которые рекомендуют определённые тайминги: загрузка контента - 1 секунда, ожидание - 50мс, анимация - 16,7мс, ответ на действия пользователя - от 50 до 200мс.

Руководства для начинающих
--------------------------

The MDN Web Performance Learning Area contains modern, up-to-date tutorials covering Performance essentials. Start here if you are a newcomer to performance:

Производительность веба: краткий обзор (en-US)

Обзор пути обучения повышения веб-производительности.

Что такое производительность веба? (en-US)

В этой статье рассматривается производительность в целом — сюда входят инструменты, метрики, API, загрузка данных по сети и особые группы пользователей, которые нам нужно учитывать.

Как пользователи воспринимают производительность? (en-US)

То как пользователи воспринимают ваш сайт является более важным, чем значения метрик в миллисекундах. На это восприятие влияет фактическое время загрузки страницы, бездействие, реакция на взаимодействие с пользователем, а также плавность прокрутки и других анимаций. В этой статье мы обсудим различные метрики загрузки, анимацию и показатели отклика, а также лучшие практики для улучшения восприятия пользователем без влияния на сами метрики.

Основы производительности веба (en-US)

В дополнение к HTML, CSS, JavaScript и мультимедийным файлам существуют функции, которые могут замедлить работу приложений, и функции, которые могут сделать приложения субъективно и объективно быстрее. Существует множество API, инструментов разработчика, хороших и плохих практик, связанных с веб-производительностью. Здесь мы представим многие из этих функций на базовом уровне и предоставим ссылки на более подробные сведения для повышения производительности по каждой теме.

Производительность HTML (en-US)

Некоторые атрибуты и порядок элементов разметки могут повлиять на производительность вашего веб-сайта. Сведя к минимуму количество DOM-элементов, обеспечив использование наилучшего порядка и атрибутов для включения контента, такого как стили, скрипты, мультимедиа и сторонние скрипты, вы можете значительно улучшить опыт пользователя (англ. UX). В этой статье подробно рассматривается, как можно использовать HTML для обеспечения максимальной производительности.

Мультимедиа: изображения и видео (en-US)

Наиболее доступным подходом повышения веб-производительности часто является медиа-оптимизация. Возможно обеспечить загрузку различных вариантов медиафайлов в зависимости от возможностей, размера и плотности пикселей дисплея каждого конкретного пользовательского устройства. Дополнительные советы, такие как удаление звуковых дорожек из фоновых видео, могут еще больше улучшить производительность. В этой статье мы обсудим влияние изображений, видео- и аудиоконтента на производительность, а также способы оптимизации.

Производительность CSS (en-US)

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

Производительность JavaScript (en-US)

JavaScript при правильном использовании может обеспечить пользователю интерактивный и захватывающий опыт. Или он может значительно снизить время загрузки, время рендеринга, производительность в приложении, время автономной работы и удобство для пользователя. В этой статье описаны некоторые передовые методы работы с JavaScript, которые следует учитывать, чтобы обеспечить максимально возможную производительность даже сложного контента.

Производительность на мобильных устройствах

Поскольку доступ в Интернет на мобильных устройствах весьма популярен, а все мобильные платформы имеют полноценные браузеры, но, возможно, с ограниченной пропускной способностью, ЦП и временем автономной работы, важно учитывать производительность вашего веб-контента на этих платформах. В этой статье рассматриваются вопросы производительности для мобильных устройств.

Using Performance APIs
----------------------

Performance API

This guide describes how to use the `Performance` interfaces that are defined in the High-Resolution Time standard.

Resource Timing API (en-US)

Resource loading and timing (en-US) the loading of those resources, including managing the resource buffer and coping with CORS

The performance timeline

The Performance Timeline standard defines extensions to the `Performance` interface to support client-side latency measurements within applications. Together, these interfaces can be used to help identify an application's performance bottlenecks.

User Timing API (en-US)

Create application specific timestamps using the user timing API (en-US)'s "mark" and "measure" entry types - that are part of the browser's performance timeline.

Frame Timing API

The `PerformanceFrameTiming` interface provides *frame* timing data about the browser's event loop.

Beacon API (en-US)

The Beacon interface schedules an asynchronous and non-blocking request to a web server.

Intersection Observer API

Learn to time element visibility with the Intersection Observer API and be asynchronously notified when elements of interest becomes visible.

Other documentation
-------------------

Developer Tools Performance Features

This section provides information on how to use and understand the performance features in your developer tools, including Waterfall, Call Tree (en-US), and Flame Charts (en-US).

Profiling with the built-in profiler (en-US)

Learn how to profile app performance with Firefox's built-in profiler.

Glossary Terms
--------------

* Beacon (en-US)
* Brotli compression (en-US)
* Client hints (en-US)
* Code splitting (en-US)
* CSSOM (en-US)
* Domain sharding (en-US)
* Effective connection type (en-US)
* First contentful paint
* First CPU idle
* First input delay
* First interactive
* First meaningful paint
* First paint
* HTTP
* HTTP/2
* Jank (en-US)
* Latency (en-US)
* Lazy load (en-US)
* Long task (en-US)
* Lossless compression (en-US)
* Lossy compression (en-US)
* Main thread (en-US)
* Minification (en-US)
* Network throttling (en-US)
* Packet (en-US)
* Page load time (en-US)
* Page prediction (en-US)
* Parse (en-US)
* Perceived performance (en-US)
* Prefetch (en-US)
* Prerender (en-US)
* QUIC (en-US)
* RAIL (en-US)
* Real User Monitoring (en-US)
* Resource Timing (en-US)
* Round Trip Time (RTT)
* Server Timing (en-US)
* Speculative parsing
* Speed index (en-US)
* SSL (en-US)
* Synthetic monitoring (en-US)
* TCP handshake (en-US)
* TCP slow start (en-US)
* Time to first byte
* Time to interactive
* TLS
* Transmission Control Protocol (TCP)
* Tree shaking (en-US)
* Web performance (en-US)
Documents yet to be written
---------------------------

JavaScript performance best practices (en-US)

JavaScript, when used properly, can allow for interactive and immersive web experiences ... or it can significantly harm download time, render time, in app performance, battery life, and user experience. This article outlines some JavaScript best practices that can ensure even complex content's performance is the highest possible.

Mobile performance

With web access on mobile devices being so popular, and all mobile platforms having fully-fledged web browsers, but possibly limited bandwidth, CPU, and battery life, it is important to consider the performance of your web content on these platforms. This article also looks at mobile-specific performance considerations.

Web font performance

An often overlooked aspect of performance landscape are web fonts. Web fonts are more prominent in web design than ever, yet many developers simply embed them from a third party service and think nothing of it. In this article, we'll covers methods for getting your font files as small as possible with efficient file formats and sub setting. From there, we'll go on to talk about how browsers text, and how you can use CSS and JavaScript features to ensure your fonts render quickly, and with minimal disruption to the user experience.

Performance bottlenecks

…

Understanding bandwidth

Bandwidth is the amount of data measured in Megabits(Mb) or Kilobits(Kb) that one can send per second. This article explains the role of bandwidth in media-rich internet applications, how you can measure it, and how you can optimize applications to make the best use of available bandwidth.

The role of TLS in performance

TLS—or HTTPS as we tend to call it—is crucial in creating secure and safe user experiences. While hardware has reduced the negative impacts TLS has had on server performance, it still represents a substantial slice of the time we spend waiting for browsers to connect to servers. This article explains the TLS handshake process, and offers some tips for reducing this time, such as OCSP stapling, HSTS preload headers, and the potential role of resource hints in masking TLS latency for third parties.

Reading performance charts

Developer tools provide information on performance, memory, and network requests. Knowing how to read waterfall charts, call trees (en-US), traces, flame charts (en-US) , and allocations (en-US) in your browser developer tools will help you understand waterfall and flame charts in other performance tools.

Alternative media formats

When it comes to images and videos, there are more formats than you're likely aware of. Some of these formats can take your highly optimized media-rich pages even further by offering additional reductions in file size. In this guide we'll discuss some alternative media formats, how to use them responsibly so that non-supporting browsers don't get left out in the cold, and some advanced guidance on transcoding your existing assets to them.

Analyzing JavaScript bundles

No doubt, JavaScript is a big part of modern web development. While you should always strive to reduce the amount of JavaScript you use in your applications, it can be difficult to know where to start. In this guide, we'll show you how to analyze your application's script bundles, so you know *what* you're using, as well how to detect if your app contains duplicated scripts between bundles.

Lazy loading

Lazy loading (ленивая загрузка) - это стратегия, направленная на определение ресурсов как неблокирующих (не критических) для того, чтобы отложить загрузку этих ресурсов на тот момент, когда они действительно необходимы.

Lazy-loading JavaScript with dynamic imports

When developers hear the term "lazy loading", they immediately think of below-the-fold imagery that loads when it scrolls into the viewport. But did you know you can lazy load JavaScript as well? In this guide we'll talk about the dynamic import() statement, which is a feature in modern browsers that loads a JavaScript module on demand. Of course, since this feature isn't available everywhere, we'll also show you how you can configure your tooling to use this feature in a widely compatible fashion.

Controlling resource delivery with resource hints

Browsers often know better than we do when it comes to resource prioritization and delivery however they're far from clairyovant. Native browser features enable us to hint to the browser when it should connect to another server, or preload a resource before the browser knows it ever needs it. When used judiciously, this can make fast experience seem even faster. In this article, we cover native browser features like rel=preconnect, rel=dns-prefetch, rel=prefetch, and rel=preload, and how to use them to your advantage.

Performance Budgets

Marketing, design, and sales needs, and developer experience, often ad bloat, third-party scripts, and other features that can slow down web performance. To help set priorities, it is helpful to set a performance budget: a set of restrictions to not exceed during the development phase. In this article, we'll discuss creating and sticking to a performance budget.

Web performance checklist

A performance checklist of features to consider when developing applications with links to tutorials on how to implement each feature, include service workers, diagnosing performance problems, font loading best practices, client hints, creating performant animations, etc.

Mobile performance checklist

A concise checklist of performance considerations impacting mobile network users on hand-held, battery operated devices.

See also
--------

HTML

* The `<picture>` Element
* The `<video>` Element
* The `<source>` Element
* The `<img> srcset` attribute
    + Responsive images
* Preloading content with `rel="preload"` (en-US) - (https://w3c.github.io/preload/)

CSS

* will-change
* GPU v CPU
* Measuring layout
* Font-loading best practices

JavaScript

* DOMContentLoaded (en-US)
* Garbage collection (en-US)
* requestAnimationFrame

APIs

* Performance API (en-US)
* Navigation Timing API
* Media Capabilities API (en-US)
* Network Information API
* PerformanceNavigationTiming (en-US)
* Battery Status API (en-US)
* Navigator.deviceMemory (en-US)
* Intersection Observer
* Using the User Timing AP (en-US)I
* Long Tasks API (en-US)
* High Resolution Timing API (https://w3c.github.io/hr-time/)
* Resource Timing API (en-US)
* Page Visibility
* Cooperative Scheduling of Background Tasks API (en-US)
    + requestIdleCallback()
* Beacon API (en-US)
* Resource Hints - dns-prefetch (en-US), preconnect, prefetch (en-US), and prerender
* Fetchevent.navigationPreload (en-US)
* Performance Server Timing API (en-US)

Headers

* Content-encoding
* HTTP/2
* gZip (en-US)
* Client Hints

Tools

* Performance in Firefox Developer Tools
* Flame charts
* The Network panel
* Waterfall charts

Additional Metrics

* Speed Index and Perceptual Speed Index

Best Practices

* Using Service Workers
* Using Web Workers
    + Web Workers API
* PWA (en-US)
* Caching
* Content Delivery Networks (CDN)


Глобальные атрибуты - HTML

Глобальные атрибуты
===================

**Глобальные атрибуты** — **это атрибуты общие для всех HTML-элементов**; они могут использоваться всеми элементами, хотя на некоторые элементы могут не оказывать влияния.

Глобальные атрибуты могут быть указаны для любых элементов HTML, *даже для тех, которые не указаны в стандарте.* Это значит, что все нестандартные элементы должны допускать эти атрибуты, даже если использование этих элементов означает, что документ больше не является HTML5-совместимым. Например, HTML5-совместимые браузеры скрывают содержимое, помеченное как `<foo hidden>...<foo>` , хотя `<foo>` не является верным HTML-элементом.

В дополнение к *основным* для HTML глобальным атрибутам, также существуют следующие глобальные атрибуты:

* **`xml:lang`** и **`xml:base`** — унаследованы от спецификации XHTML, и хотя являются устаревшими, сохранены в целях совместимости.
* Многочисленные **`aria-*`** атрибуты, используемые для улучшения доступности.
* Атрибуты обработчиков событий: `onabort`, `onautocomplete`, `onautocompleteerror`, `onblur`, `oncancel`, `oncanplay`, `oncanplaythrough`, `onchange`, `onclick`, `onclose`, `oncontextmenu`, `oncuechange`, `ondblclick`, `ondrag`, `ondragend`, `ondragenter`, `ondragexit`, `ondragleave`, `ondragover`, `ondragstart`, `ondrop`, `ondurationchange`, `onemptied`, `onended`, `onerror`, `onfocus`, `oninput`, `oninvalid`, `onkeydown`, `onkeypress`, `onkeyup`, `onload`, `onloadeddata`, `onloadedmetadata`, `onloadstart`, `onmousedown`, `onmouseenter`, `onmouseleave`, `onmousemove`, `onmouseout`, `onmouseover`, `onmouseup`, `onmousewheel`, `onpause`, `onplay`, `onplaying`, `onprogress`, `onratechange`, `onreset`, `onresize`, `onscroll`, `onseeked`, `onseeking`, `onselect`, `onshow`, `onsort`, `onstalled`, `onsubmit`, `onsuspend`, `ontimeupdate`, `ontoggle`, `onvolumechange`, `onwaiting`.
Описание
--------

`accesskey`

Даёт подсказку для создания комбинации клавиш для текущего элемента. Этот атрибут содержит список разделённых пробелами символов. Браузер должен использовать первый имеющийся в раскладке клавиатуры символ из списка.

`class`

Это список разделённых пробелами классов элемента. Классы позволяют CSS и JavaScript выбирать и получать доступ к конкретным элементам через селекторы по классу или через функции, такие как метод `Document.getElementsByClassName()`.

`contenteditable`

Это перечислимый атрибут, указывающий, нужно ли предоставить пользователю возможность редактировать элемент. Если это так, браузер изменит свой виджет таким образом, чтобы позволить редактирование. Атрибут должен принимать одно из следующих значений:

* `true` или *пустая строка*, указывает, что элемент должен быть редактируемым;
* `false`, указывает, что элемент не должен быть редактируемым.

`contextmenu` (en-US)

Это **`id`** элемента `<menu>`, который следует использовать в качестве контекстного меню для данного элемента.

`data-*`

Определяет группу атрибутов, называемых атрибутами пользовательских данных, позволяющих осуществлять обмен служебной информацией между HTML и его DOM представлением, что может быть использовано скриптами. Все такие пользовательские данные доступны через интерфейс `HTMLElement` элемента у которого установлен атрибут. Свойство `HTMLElement.dataset` (en-US) предоставляет доступ к ним.

`dir` (en-US)

Это перечислимый атрибут указывающий направление текста в элементе. Он может принимать одно из следующих значений:

* `ltr`, что расшифровывается как *left to right* (слева направо), и предназначено для языков, в которых пишут слева направо (как в русском);
* `rtl`, что расшифровывается как *right to left* (справа налево), и предназначено для языков, в которых пишут справа налево (как в арабском);
* `auto` — позволяет принять решение пользовательскому приложению. Оно применяет базовый алгоритм — анализирует символы внутри элемента до тех пор, пока не найдёт символ со строгим направлением, а затем применяет это направление ко всему элементу.

`draggable` (en-US)
Экспериментальная возможность

Это перечислимый атрибут, указывающий, можно ли перетаскивать элемент с помощью Drag and Drop API. Он может принимать одно из следующих значений:

* `true`, указывающее, что элемент можно перетаскивать;
* `false`, указывающее, что элемент нельзя перетаскивать.

`dropzone`
Экспериментальная возможность

Это перечислимый атрибут, указывающий типы содержимого, которое можно перетащить в элемент с помощью Drag and Drop API. Он может принимать одно из следующих значений:

* `copy`, указывающее, что перетаскивание создаст копию перетаскиваемого элемента;
* `move`, указывающее, что перетаскиваемый элемент будет перемещён в новое расположение;
* `link` — создаст ссылку на перетаскиваемые данные.

`hidden` (en-US)

Это логический атрибут, указывающий, что элемент уже (или ещё) не актуален. Можно использовать этот атрибут, например для того, чтобы спрятать части страницы, которые не должны быть видны до завершения авторизации. Браузер не будет отображать такие элементы. Этот атрибут не должен использоваться, чтобы скрыть содержимое, которое может быть показано на законных основаниях.

`id`

Определяет идентификатор (ID), который должен быть уникален для всего документа. Он предназначен для идентификации элемента при создании ссылок на него, исполнении скриптов или применении стилей (посредством CSS).

`itemid`
Экспериментальная возможность

`itemprop` (en-US)
Экспериментальная возможность

`itemref` (en-US)
Экспериментальная возможность

`itemscope`
Экспериментальная возможность

`itemtype` (en-US)
Экспериментальная возможность

Эти атрибуты относятся к определению микроданных.

`lang`

Участвует в определении языка элемента, языка написания нередактируемых элементов или языка, на котором должны быть написаны редактируемые элементы. Содержит единственное значение в формате, определённом в документе IETF *BCP47*. `xml:lang` имеет приоритет над ним.

`spellcheck` (en-US)
Экспериментальная возможность

Это перечислимый атрибут, определяющий, может ли содержимое элемента быть проверено на наличие орфографических ошибок. Он может принимать одно из следующих значений:

* `true`, указывающее, что элемент должен, по возможности, проверяться на наличие орфографических ошибок;
* `false`, указывающее, что элемент не должен проверяться на наличие орфографических ошибок.

`style`

Содержит описание стилей CSS, которые должны быть применены к элементу. Учтите, что рекомендуется определять стили в отдельном файле или файлах. Этот атрибут, как и элемент `<style>`, предназначен, в основном, для оперативного применения стилей, например в целях тестирования.

`tabindex`

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

* *отрицательное число* означает, что элемент фокусируемый, но он не может получить фокус посредством последовательной навигации с клавиатуры;
* `0` означает, что элемент фокусируемый и может получить фокус посредством последовательной навигации с клавиатуры, но порядок его следования определяется платформой;
* *положительное значение* означает, что элемент фокусируемый и может получить фокус посредством последовательной навигации с клавиатуры. Порядок его следования определяется значением атрибута — последовательно возрастающего числа **tabindex**. В случае, когда несколько элементов имеют одинаковое значение атрибута **tabindex**, порядок их следования при навигации определяется их местом в документе.

`title` (en-US)

Содержит текст, предоставляющий консультативную информацию об элементе. Эта информация может, но не обязательно, показываться пользователю в виде всплывающей подсказки.

`translate` (en-US)

Это перечислимый атрибут, используемый для того, чтобы указать, следует ли переводить значения атрибутов элемента и его текстовое содержимое (содержимое узла `Text`) при локализации страницы. Этот атрибут может принимать следующие значения:

* *пустая строка* или `"yes"` указывает, что элемент должен быть переведён;
* `"no`" указывает, что элемент не должен быть переведён.

Спецификации
------------

| Specification |
| --- |
| HTML Standard # the-accesskey-attribute |
| HTML Standard # attr-autocapitalize |
| HTML Standard # attr-fe-autocomplete |
| HTML Standard # dom-fe-autofocus |
| HTML Standard # global-attributes:classes-2 |
| HTML Standard # attr-contenteditable |
| HTML Standard # attr-data-\* |
| HTML Standard # the-dir-attribute |
| HTML Standard # the-draggable-attribute |
| HTML Standard # attr-enterkeyhint |
| CSS Shadow Parts # element-attrdef-html-global-exportparts |
| HTML Standard # the-hidden-attribute |
| HTML Standard # global-attributes:the-id-attribute-2 |
| HTML Standard # the-inert-attribute |
| HTML Standard # attr-inputmode |
| HTML Standard # attr-is |
| HTML Standard # attr-itemid |
| HTML Standard # names:-the-itemprop-attribute |
| HTML Standard # attr-itemref |
| HTML Standard # attr-itemscope |
| HTML Standard # attr-itemtype |
| HTML Standard # attr-lang |
| HTML Standard # attr-nonce |
| CSS Shadow Parts # part-attr |
| HTML Standard # the-popover-attribute |
| HTML Standard # attr-popovertarget |
| HTML Standard # attr-popovertargetaction |
| HTML Standard # attr-slot |
| DOM Standard # ref-for-dom-element-slot① |
| HTML Standard # attr-spellcheck |
| HTML Standard # the-style-attribute |
| HTML Standard # attr-tabindex |
| HTML Standard # the-title-attribute |
| HTML Standard # attr-translate |
| VirtualKeyboard API # dom-elementcontenteditable-virtualkeyboardpolicy |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* Интерфейсы `Element` и `GlobalEventHandlers`, которые позволяют запрашивать большинство глобальных атрибутов.


Справка по HTML - HTML

Справка по HTML
===============

Эта справка описывает все **элементы** и **атрибуты** HTML, включая **глобальные атрибуты**, которые применяются ко всем элементам.

Справка по HTML-элементам

На этой странице перечислены все HTML-элементы.

Справка по HTML-атрибутам

У элементов в HTML есть атрибуты; это дополнительные величины, которые настраивают элементы или управляют их поведением различными способами, чтобы соответствовать критериям, которые хотят пользователи.

Глобальные атрибуты

Глобальные атрибуты - это атрибуты общие для всех элементов HTML; они могут использоваться на всех элементах, однако могут не оказывать влияние на некоторые элементы.

Типы ссылок

В HTML следующие типы ссылок указывают на связь между двумя документами, в котором один связывается с другим с помощью элементов `<a>`, `<area>` или `<link>`.

Категории контента

Каждый элемент HTML принадлежит одной или более категории контента - эти категории группируют элементы, которые имеют общие характеристики.

Форматы даты и времени, применяемые в HTML (en-US)

Некоторые элементы HTML позволяют вам указывать дату и/или время как значение или как значение атрибута. К ним относятся изменение даты и времени элемента `<input>`, а так же элементов `<ins>` и `<del>`.