Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.

Медиа    |    Веб-разработка    |    CSS    |    JavaScript    |    Браузеры

Медиа

• Подкаст «Веб-стандарты» №302. Safari, сертификаты, Hacktoberfest, jQuery всё, Cascade Layers, пререндеринг, финтех в Яндексе
• Подкаст «Фронтенд Юность» #205: Вся Правда о гитхабе И Майкрософте
• «Новости 512» от CSSSR: Chrome 94, Safari 15, тестирование Effector, Container Units, any, @layout, open-source плагиат?
• Подкаст «proConf» #109 Node Congress 2021
• Подкаст «Ленивый фронтендер» #14 | Bundle inside: Сергей Мелюков, автор Statoscope, делится деталями разработки, историей возникновения проекта, дальнейшем развитии и многом другом

Веб-разработка

• DOM, который построил Chrome. Или не построил? Или не Chrome? Или не DOM?
• Микро-фронтенд. Обзор архитектуры и рекомендуемые практики
• 7 полезных атрибутов HTML, о которых вы можете не знать
• Сравнение возможностей HTML препроцессоров
• Микросервисы мертвы — да здравствуют минисервисы
• Создание полноэкранных веб-приложений

• Инструменты
  • 5 вещей, которые я узнал, доведя Snowpack до 20000 GitHub-звёзд
  • Возможности для фронтендеров в iOS 15
  • Углубленный взгляд на процесс бандлинга в webpack
  

• Производительность
  • Приемы оптимизации веб-графики в 2021 году
  • Обеспечение мгновенной загрузки страниц в браузере с помощью спекулятивного пре-рендеринга
  • Не тратьте время пользователей на рендеринг контента вне экрана
  • Использование современных форматов изображений: AVIF и WebP
  

• Доступность
  • Создание компонента Toggle
  • Подборка ссылок для знакомства с доступной разработкой
  • «WCAG 2.2 Что нового и что с ним делать» / Аластер Кэмпбелл на #id24 2021
  

• Эффекты
  • Список игр для скучающих (и любопытных) дизайнеров и веб-разработчиков
  • Создание солнечной системы на SVG , часть 1: установка сцены, часть 2: фильтры, градиенты и Clip Paths
  • Эффектный переход между страницами с помощью кинетической типографики
  • Подборка креативных концептов «UI Interactions & Animations Roundup» #19
  

CSS

• Easing Functions – функции плавности для CSS-анимации и переходов
• История о CSS-сбросах и все, что о них нужно знать. Еще раз об этом
• 6+5 способов сделать две колонки ✌️ От таблиц и флоатов до гридов и полной дичи ????
• Tailwind CSS v3.0.0-alpha.1 — детали релиза первой альфы v3
• В последний раз: кастомные стили для чекбоксов и радиобатонов
• Пользовательский запрос CSS prefers-color-scheme и порядок выбора
• Как я перестал беспокоиться и полюбил анимационную блочную модель

JavaScript

• JavaScript: разрабатываем приложение для записи звука
• Самопаркующаяся тачка в 500 строк кода
• Термо принтер и JavaScript
• Пишем JavaScript по codestyle Google. На 3 практических задачах
• Худшая практики Javascript. Вредные привычки, от которых нужно отказаться прямо сейчас
• Краткий обзор новостей Backend JavaScript (3 квартал 2021 г.)
• Худшие приемы JavaScript, ухудшающие качество кода
• 3 совета по JavaScript для ускорения процесса разработки

• React
  • Как создать MVP с помощью React и Firebase
  • Redux мертв: Да здравствует Redux Toolkit
  • Инструменты доступности React — как создавать более доступные приложения на React
  • Более быстрые приложения на React с мемоизацией
  • Как использовать TypeScript с React Components
  • Оптимизация производительности React приложения
  • React philosophies: Вещи, о которых я думаю, когда пишу код React
  • ReScript для React разработки
  • Рекомендации по обработке ошибок и логированию в React
  

• Vue
  • Vite.js и Vue.js
  • Близится Nuxt 3! Вот что вам нужно знать
  • Переход с Vue 2 на Vue 3.1
  • Переход от Option API Vue 2 к Composition API Vue 3
  • Близится релиз Nuxt 3 с клевыми новыми возможностями
  • Как реализовать функцию поиска в вашем Nuxt приложении с помощью Algolia InstantSearch
  

• Angular
  • Как писать на HTML Canvas удобно, или как изобрести очередной renderer на Angular
  • Вопросы на собеседовании по Angular, часть 3
  • Передача и управление шаблонами в Angular
  • Angular — Пользовательский менеджер состояний в RxJS
  

• Svelte
  • TDD со Svelte — мокать или не мокать
  • Создание PWA с помощью Svelte
  

• Libs & Plugins
  • Релиз GSAP 3.8, с множеством новых функций и улучшений для ScrollTrigger
  • ngx-react — позволяет без проблем использовать компоненты ⚛️ React и ????️ Angular вместе.
  • 11 лучших библиотек для подсветки синтаксиса в Javascript
  

Браузеры

• Google Search больше не поддерживает Internet Explorer 11, потому что «пришло время»
• План улучшения поддержки Wayland в Firefox
• Обновлённый формат расширений Chrome может ухудшить работу блокировщиков рекламы

Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.