Видео с конференции ITeaConf 2021: интерактивная визуализация, хорошие практики React, рендеринг в браузере, контекстно зависимые топологии, монолиты и микросервисы.

Frontend https://www.youtube.com/playlist?list=PL22x71aVq44xE2Z9PdxGnKAV05tTtcPea
Node.js https://www.youtube.com/playlist?list=PL22x71aVq44y1aHBNtViWJ9Kpl-k0ps-R

Параллакс на кастомных свойствах CSS. Джей Томпкинс собирает сцену, которая реагирует на движение курсора мышки.

https://css-tricks.com/parallax-powered-by-css-custom-properties/

SVGcode. Томас Штайнер делится инструментом преобразования растровой графики в векторную и рассказывает, как этот инструмент работает внутри.

Инструмент https://svgco.de/
Описание https://web.dev/svgcode/

Плавное наложение двух DOM-элементов пока невозможно. Джейк Арчибальд погружается в задачу плавного перехода между двумя изображениями и объясняет, почему универсального решения пока нет.

https://jakearchibald.com/2021/dom-cross-fade/

Выпуск №309: Вадим Макеев, Андрей Мелихов, Никита Дубко про Chrome 96 и будущие беты, новинки Safari TP 135, Web Almanac 2021, SVGcode, сложный фронтенд и мифы о доступности.

Слушайте на Ютубе https://youtu.be/mSmE-LqgNvA
Ссылки на сайте https://web-standards.ru/podcast/309/

00:00:54 События
00:03:05 Новинки Chrome 96
00:19:06 Что в бетах Chrome
00:23:56 Safari TP 135
00:29:14 Web Almanac
00:39:23 SVGcode
00:47:05 Сложный фронтенд
00:58:23 Прогресс-бар
01:01:40 Мифы о доступности

Мощные CLI-инструменты для веб-разработки. Луи Лазарис делится списком утилит и инструментов командной строки, упрощающих работу с терминалом.

https://www.smashingmagazine.com/2021/11/powerful-terminal-commandline-tools-modern-web-development/

Мой кастомный CSS Reset. Джош Камю делится своим списком правил для сброса стилей CSS по умолчанию и объясняет каждое на примере.

https://www.joshwcomeau.com/css/custom-css-reset/

Отзывчивая вёрстка, меньше медиавыражений. Темани Афиф показывает, как при помощи гридов, флексов и CSS-функций добиваться адаптивности без использования медиавыражений.

https://css-tricks.com/responsive-layouts-fewer-media-queries/

Расширяемые секции в гридах. Кев Бонетт комбинирует три CSS-однострочника, чтобы получить ячейку на всю ширину грида в любом месте.

https://css-tricks.com/expandable-sections-within-a-css-grid/

Он­лайн-обу­че­ние: советы студентам. Продолжение серии Алёны Батицкой про образование: мотивация, вопросы, форматы, практика, критическое мышление и другие важные особенности успешного обучения.

https://web-standards.ru/articles/online-education-2/

Веб-альманах 2021: PWA. Результаты большого исследования веба: применение сервис-воркеров, использование свойств манифеста, библиотеки для работы с PWA, пуш-уведомления и дистрибуция.

https://almanac.httparchive.org/ru/2021/pwa

Новинки Chrome DevTools 96. Еселин Йен в переводе Алёны Батицкой про обновления: вкладка CSS Overview, эмуляция медиафичи prefers-contrast, эмуляция автоматической тёмной темы, новая панель Reporting API и другие.

https://developer.chrome.com/ru/blog/new-in-devtools-96/

Полифил для Container Queries. Теперь простые выражения, зависящие от размеров контейнера, можно использовать и в браузерах, которые пока не поддерживают CQ. Полифил работает с помощью ResizeObserver и MutationObserver и требует их поддержки.

https://github.com/GoogleChromeLabs/container-query-polyfill

Как я собрал «Пипетку». Патрик Броссет рассказывает, как он разрабатывал браузерное расширение для захвата цветов пикселей на экране, даже за пределами браузера.

https://patrickbrosset.com/articles/2021-11-24-how-i-built-an-eye-dropper-browser-extension/

Создание генеративных паттернов. Джордж Фрэнсис показывает, как использовать CSS Paint API для создания генеративных изображений и вставки их фоном.

https://css-tricks.com/creating-generative-patterns-with-the-css-paint-api/

Адвент-календари для фронтендеров. Эми Даттон и Джеймс Квик 1 декабря запускают соревнования с заданиями по CSS и JavaScript, 24 по каждому языку.

CSS https://www.adventofcss.com/
JavaScript: https://www.adventofjs.com/

Fleet, новый лёгкий редактор JetBrains, вышел в бета-тестирование по приглашениям. Редактор написан с нуля, имеет новый интерфейс, возможности, сравнимые с IDE, запускается в облаке, имеет коллаборативный режим, также планируется поддержка плагинов.

https://blog.jetbrains.com/ru/blog/2021/11/29/welcome-to-fleet/

Бесплатный курс «Основы вёрстки сайта» Нетологии пройдёт с 6 по 27 декабря. В программе лекции и практические задания по HTML-разметке и атрибутам, CSS-селекторам и свойствам, вёрстке текстовых блоков, списков и таблиц, основам работы клиента и сервера.

https://netolo.gy/hl6

Скорость вычислений WebGPU в сравнении с WebGL. Денис Радин делится результатами эксперимента с замерами вычислений и объясняет различия между технологиями.

https://pixelscommander.com/ru/javascript/webgpu-computations-performance-in-comparison-to-webgl/