Видео о веб-разработке с Microsoft Edge
Узнайте о новых технологиях и продуктах веб-разработки Microsoft Edge, включая Средства разработки, API и функции веб-платформы, прогрессивные веб-приложения и WebView2.
Эта страница содержит ссылки на короткие видео, каждое из которых посвящено только одной функции и включает демонстрацию.
Корпорация Майкрософт регулярно публикует новые видео на канале Microsoft Edge YouTube, и они также перечислены ниже.
Щелкните эскиз из следующего списка, чтобы watch соответствующее видео на YouTube.
DevTools — новые возможности DevTools 105
Опубликовано 6 сентября 2022 г.
Дополнительные сведения о наших последних объявлениях от команды разработчиков Microsoft Edge см. в статье Новые возможности в DevTools 105.
DevTools . Общие сведения о пользовательском интерфейсе DevTools
Опубликовано 1 сентября 2022 г.
Узнайте, как организован пользовательский интерфейс Средств разработки Microsoft Edge. Если вы запутались в том, какие инструменты доступны и что делают main части интерфейса DevTools, это видео поможет вам более комфортно.
В этом видео мы рассмотрим структуру пользовательского интерфейса с его main панели инструментов и панели, а также области ящика. Мы также рассмотрим, как найти, открыть и закрыть инструменты, восстановить параметры по умолчанию и просмотреть список доступных средств.
DevTools — новые возможности devTools 104
Опубликовано 5 августа 2022 г.
Дополнительные сведения о наших последних объявлениях от команды разработчиков Microsoft Edge см. в статье Новые возможности в devTools 104.
DevTools — новые возможности devTools 103
Опубликовано 5 июля 2022 г.
Дополнительные сведения о наших последних объявлениях от команды разработчиков Microsoft Edge см. в статье Новые возможности в devTools 103.
Средства разработки — отладка Интернета в трехмерном формате
Опубликовано 21 июня 2022 г.
Инструмент 3D-представления в Средствах разработки Microsoft Edge предоставляет трехмерное представление проверяемой веб-страницы. Используйте средство трехмерного просмотра для отладки распространенных проблем веб-разработки, таких как:
- Глубоко вложенные узлы DOM.
- Элементы вне документа.
- Нежелательные полосы прокрутки.
- Проблемы с стеком индексов Z.
- Производительность составных слоев.
Чтобы узнать больше о инструменте 3D-представления, проверка навигация по уровням веб-страницы, z-index и DOM с помощью инструмента 3D-представления или Отладка веб-страницы в трехмерном формате с помощью инструмента трехмерного представления.
DevTools — использование предпочитаемого языка в средствах разработки
Опубликовано 9 июня 2022 г.
Microsoft Edge DevTools поддерживает 13 различных языков. В этом видео команда показывает, как выбрать язык, наиболее удобный для написания кода и отладки.
Чтобы узнать больше об изменении языковых параметров DevTools, проверка в разделе Изменение языковых параметров DevTools.
Чтобы сообщить об ошибках перевода, проверка обратитесь к команде Microsoft Edge DevTools.
DevTools — новые возможности devTools 102
Опубликовано 1 июня 2022 г.
Дополнительные сведения о наших последних объявлениях от команды Разработчиков Microsoft Edge см. в статье Новые возможности в DevTools 102.
Веб-платформа — полный стиль раскрывающейся части объекта <select> с помощью нового <selectmenu> элемента
Опубликовано 31 мая 2022 г.
Стилизация <select> элементов была сложной задачей. Экспериментальный <selectmenu> элемент обещает преодолеть оставшиеся ограничения, позволяя веб-разработчикам стилистики всех частей элемента.
Дополнительные сведения об элементах стиля <select> и новом <selectmenu> элементе см. в записи блога Стилизация <select> элементов для реальных.
DevTools — дополнительные проблемы с фильтрацией в средствах разработки Edge и VSCode
Опубликовано 20 мая 2022 г.
У каждого веб-продукта есть проблемы. Средство Microsoft Edge DevTools Issues анализирует текущую веб-страницу и сообщает о проблемах, сгруппированных по типам, включая специальные возможности, совместимость, производительность и многое другое.
Если у вас есть Visual Studio Code, расширение Microsoft Edge DevTools для Visual Studio Code делает проблемы доступными в исходном коде напрямую.
Выпущенные продукты также могут иметь много проблем. На основе ваших отзывов мы добавили полезные способы фильтрации проблем. Например, вы можете отключить проблемы, поступающие из сторонних библиотек, и выбрать браузеры для просмотра проблем.
Дополнительные сведения о средстве "Проблемы" см. в статье Поиск и устранение проблем с помощью средства "Проблемы".
Дополнительные сведения о расширении Microsoft Edge DevTools для Visual Studio Code см. в статье Расширение Microsoft Edge DevTools для Visual Studio Code.
Веб-платформа— создание анимации, связанной с прокруткой, без JavaScript
Опубликовано 12 мая 2022 г.
Узнайте о предстоящей функции анимации, связанной с прокруткой CSS, и о том, как ее можно использовать для создания индикатора хода чтения на веб-странице без использования JavaScript.
Анимация, связанная с прокруткой CSS, является экспериментальной функцией в Microsoft Edge. Чтобы попробовать эту функцию, перейдите к edge://flags и включите параметр Функции экспериментальной веб-платформы .
Чтобы воспроизвести демонстрационное приложение, показанное в видео, ознакомьтесь с демонстрацией для чтения и его исходным кодом.
Дополнительные сведения о функции анимации, связанной с прокруткой CSS, см. в разделе @scroll-временная шкала в MDN.
Средства разработки. Настройка средств разработчика Microsoft Edge и быстрый доступ к функциям
Опубликовано 5 мая 2022 г.
Узнайте, как настроить Средства разработки в соответствии со своими потребностями.
В этом видео показано, как закрепить или отстыковать средства Разработки, открыть новые инструменты и закрыть те, которые вам не нужны. В нем описывается перемещение инструментов в нижней панели и настройка размера текста и темы. В видео также объясняется, как использовать сочетания клавиш меню команд для быстрой настройки средств разработки.
DevTools — новые возможности devTools 101
Опубликовано 28 апреля 2022 г.
Дополнительные сведения о наших последних объявлениях от команды разработчиков Microsoft Edge см. в статье Новые возможности в devTools 101.
Веб-платформа— выделение текста в Интернете с помощью API пользовательского выделения CSS
Опубликовано 28 апреля 2022 г.
Стилизация диапазонов текста в Интернете очень полезно, но исторически было сложно сделать.
Новый API пользовательского выделения CSS — это будущее выделения текстовых диапазонов в Интернете. Он предоставляет веб-разработчикам функции JavaScript и CSS, которые упрощают и эффективнее стили любого диапазона текста.
Дополнительные сведения см. в статье API пользовательского выделения CSS: будущее выделения текстовых диапазонов в Интернете.
DevTools — новые возможности DevTools 100
Опубликовано 19 апреля 2022 г.
Дополнительные сведения о наших последних объявлениях от команды разработчиков Microsoft Edge см. в статье Новые возможности в devTools 100.
DevTools — новые возможности DevTools 99
Опубликовано 21 марта 2022 г.
Дополнительные сведения о наших последних объявлениях от команды разработчиков Microsoft Edge см. в статье Новые возможности в DevTools 99.
DevTools — новые возможности DevTools 98
Опубликовано 23 февраля 2022 г.
Дополнительные сведения о наших последних объявлениях от команды Разработчиков Microsoft Edge см. в статье Новые возможности в DevTools 98.
DevTools — новые возможности devTools 97
Опубликовано 1 февраля 2022 г.
Дополнительные сведения о наших последних объявлениях от команды разработчиков Microsoft Edge см. в статье Новые возможности в DevTools 97.
DevTools — новые возможности DevTools 96
Опубликовано 9 декабря 2021 г.
Дополнительные сведения о наших последних объявлениях от команды разработчиков Microsoft Edge см. в статье Новые возможности в DevTools 96.
Средства разработки— отладка утечек памяти с помощью средства "Отсоединенные элементы" в Microsoft Edge
Опубликовано 9 декабря 2021 г.
Мы рады сообщить о новом инструменте "Отсоединенные элементы" в Средствах разработки Microsoft Edge, которое поможет вам исследовать и устранять утечки памяти DOM.
Утечка памяти возникает, когда код JavaScript приложения сохраняет все больше объектов в памяти, а не освобождает их для сборки мусора браузером. Мы создали это средство вместе с разработчиками Microsoft Teams, и оно уже помогло нам найти и устранить утечки памяти на многих наших веб-сайтах и приложениях.
Дополнительные сведения см. в статье Отладка утечек памяти DOM с помощью инструмента "Отсоединенные элементы" и в соответствующей записи блога Отладка утечек памяти с помощью средства Отсоединенные элементы Microsoft Edge.
DevTools — новые возможности DevTools 95
Опубликовано 8 декабря 2021 г.
Дополнительные сведения о наших последних объявлениях от команды разработчиков Microsoft Edge см. в статье Новые возможности в DevTools 95.
Веб-платформа — API пипетка
Опубликовано 22 ноября 2021 г.
Команда Microsoft Edge указала и реализовала новый API EyeDropper в сотрудничестве с проектом Chromium с открытым кодом. Оставьте отзыв на странице Проблемы — WICG/пипетка | github.com.
Многие творческие приложения позволяют пользователям выбирать цвета из частей окна приложения или даже со всего экрана, обычно используя метафору пипеты. API EyeDropper позволяет авторам использовать предоставленные браузером пипеты при создании пользовательских средств выбора цвета в Интернете.
Дополнительные сведения см. в статье Выбор цветов любого пикселя на экране с помощью API eyeDropper | web.dev и API EyeDropper — веб-API | MDN developer.mozilla.org.
DevTools — новые возможности devTools 94
Опубликовано 12 ноября 2021 г.
Дополнительные сведения о наших последних объявлениях от команды разработчиков Microsoft Edge см. в статье Новые возможности в devTools 94.