Size: a a a

Веб-стандарты

2021 January 19
Веб-стандарты
Начиная с Chrome 88 цепочки таймеров начнут тротлиться до раза в минуту, если страница не видна больше 5 минут, количество таймеров в цепочке больше 5 и на ней не воспроизводится аудио или WebRTC-видео. Подробности от Джейка Арчибальда.

https://developer.chrome.com/blog/timer-throttling-in-chrome-88/
источник
2021 January 20
Веб-стандарты
Энди Белл на примере приложения для ведения заметок показывает, как сделать минимально жизнеспособный продукт, а затем его прогрессивно улучшать, и какие плюсы у такого подхода.

https://piccalil.li/blog/a-minimum-viable-experience-makes-for-a-resilient-inclusive-website-or-app
источник
Веб-стандарты
Разбираемся в clip-path. Ахмад Шадид рассматривает современные способы создания фигур и масок: от примитивов до кривых из внешних файлов и сочетаний calc с единицами вьюпорта.

https://ishadeed.com/article/clip-path/
источник
Веб-стандарты
Новинки Chrome 88 в обзоре Пита Лепажа: 3 версия манифеста для расширений, свойство aspect-ratio, тротлинг таймеров на фоновых страницах, no-opener для target=_blank, новая опция для addEventListener и другое.

Видео https://youtu.be/cqAO2xR7lzM
Текст https://developers.google.com/web/updates/2021/01/nic88
источник
2021 January 21
Веб-стандарты
Коты во флексах. Сержио Виллар из Igalia о том, как они улучшили поведение картинок внутри флексов для WebKit, чтобы они не искажались по умолчанию, а также о ценности WPT (тестов для веб-платформы).

https://blogs.igalia.com/svillar/2021/01/20/flexbox-cats-a-k-a-fixing-images-in-flexbox/
источник
Веб-стандарты
Опубликован первый рабочий черновик WCAG 3.0, руководства W3C по доступности контента и интерфейсов. Вместе с черновиком опубликован обзор отличий от предыдущей версии WCAG 2.1, изменений и улучшений.

WCAG 3.0 https://www.w3.org/TR/wcag-3.0/
Подробности https://www.w3.org/WAI/standards-guidelines/wcag/wcag3-intro/
источник
2021 January 22
Веб-стандарты
Подробнее о новой системе создания слоёв CSS-каскада и управлении специфичностью, предложенной в черновике спецификации CSS Cascading and Inheritance 5 уровня.

Илья Стрельцын https://css-live.ru/vecssti-s-polej/pervyj-publichnyj-chernovik-css-kaskada-5-urovnya.html
София Валитова https://ariarzer.dev/css-cascade-layer.html
источник
Веб-стандарты
Новый элемент <popup> предлагают разработчики Microsoft, Google и Salesforce для выпадающих меню и других похожих случаев, за исключением модальных диалогов. Первый прототип планируют реализовать в Chromium.

Интент https://groups.google.com/a/chromium.org/g/blink-dev/c/9y-Thg9UCxY/m/_4gShWjQAAAJ
Подробности https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/Popup/explainer.md
источник
Веб-стандарты
Как запустить WebKit на Windows с помощью Playwright. Кристиан Шефер с коротким рецептом, который позволит вам получить почти полноценный Safari на Windows, за некоторыми исключениями в виде проприетарных API или интеграции в ОС.

https://schepp.dev/posts/running-webkit-on-windows/
источник
2021 January 25
Веб-стандарты
Чтобы быть впереди веба, веб-стандартам нужно бежать в два раза быстрее. Максим Усачев размышляет, почему нативные браузерные реализации фичей лучше библиотечных, но всё равно медленно внедряются в реальные проекты.

https://css-live.ru/articles-css/chtoby-byt-vperedi-veba-veb-standartam-nuzhno-bezhat-v-dva-raza-bystree.html
источник
Веб-стандарты
Как мы улучшили перфоманс Smashing Magazine. Виталий Фридман делится опытом оптимизации сайта издания и рассказывает о неочевидных изменениях, которые помогли значительно ускориться.

https://www.smashingmagazine.com/2021/01/smashingmag-performance-case-study/
источник
Веб-стандарты
Важность порядка подключения шрифтов в @​font-face при использовании <link rel=preload>. Мэтт Хоббс разбирается в принципах загрузки и предзагрузки шрифтов на примере сайта Белого дома США и даёт советы, как не загрузить лишнего.

https://nooshu.github.io/blog/2021/01/23/the-importance-of-font-face-source-order-when-used-with-preload/
источник
2021 January 26
Веб-стандарты
Как записать действия на экране в виде скрипта для Puppeteer. Стефан Юдис демонстрирует появившуюся за флагом в Chrome 89 возможность записывать действия на странице.

https://www.stefanjudis.com/blog/how-to-record-screen-actions-as-a-puppeteer-script/
источник
Веб-стандарты
Вам показалось! Всё о Perceived Performance. Расшифровка доклада Алексея Охрименко про набор психологических и инженерных трюков, создающих у пользователя ощущение быстрой загрузки страницы.

https://habr.com/p/538466/
источник
Веб-стандарты
Выпуск №266. Вадим Макеев, Андрей Мелихов, Маша Просвирнина и Иван Дмитриев про Chrome 88, флексы, JS-метод at, управление CSS-каскадом, разработку под Smart TV и видео в вебе.

Слушайте на Ютубе https://youtu.be/KvOitGw_81k
Читайте на Медиуме https://medium.com/p/9e6874606ea0
источник
Веб-стандарты
00:01:36 События
00:02:18 Chrome 88
00:10:21 Картинки во флексах
00:12:06 Новый JS-метод at
00:16:56 Управление CSS-каскадом
00:26:58 Экосистема Smart TV
00:39:26 Интерфейс ТВ
00:47:41 Разработка под ТВ
00:58:54 Устройство ТВ-приложения
01:08:44 Видео для веба
источник
2021 January 27
Веб-стандарты
Новинки Firefox 85: поддержка <link rel=preload>, псевдокласс :focus-visible, удаление поддержки Flash, улучшение Intl.Collator и другие.

Обзор Марата Таналина https://tanalin.com/blog/2021/01/firefox-85/
Список изменений на MDN https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/85
источник
Веб-стандарты
Как использовать HTTPS для локальной разработки. Мод Нальпас показывает различные способы: mkcert, самоподписанный сертификат, прокси, флаг в браузере.

https://web.dev/how-to-use-local-https/
источник
Веб-стандарты
Open Web Docs, новый проект для создания и поддержки документации для веба, основанный Coil, Google, Microsoft при поддержке Igalia, Mozilla, Samsung и W3C. В ближайших приоритетах — работа над MDN.

Анонс https://opencollective.com/open-web-docs/updates/introducing-open-web-docs
Планы на 2021 https://github.com/openwebdocs/project/blob/main/2021-goals.md
источник
2021 January 28
Веб-стандарты
Инструкция по работе в Figma для верстальщика и чек-лист для передачи макета в разработку. Анастасия Свеженцева рассказывает, что надо знать дизайнеру и веб-разработчику при совместной работе с макетом в Figma.

https://breezzly.ru/guides/start-v-figma-dlya-verstalshhika
источник