Дайджест свежих материалов из мира фронтенда за последнюю неделю №439 (26 — 31 октября 2020)

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

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

Подкасты

• Подкаст «Веб-стандарты» №253. Edge на Linux, Safari, Chrome 87, Firefox 82, MDN, состояние и структура CSS, история браузеров
• Подкаст «CSSSR: CSS 3D, гайд по Webpack 5, NodeJS 15, React 17 и CRA 4, Playwright Python, Composer 2, Observer APIs

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

• Создание микросервисной архитектуры с использованием single-spa (миграция существующего проекта)
• Как браузер рендерит веб-страницу
• Сравнение времени сборки генераторами статических сайтов
• 10 полезных советов по HTML File Upload для веб-разработчиков
• HTTP 2 Push: Факты? Фикция? Плацебо?
• Сравнения паттернов в микрофронтендах
• Клиенты NPM, лучшие, чем оригинал

• Доступность
  • Решение проблемы обеспечения доступности модального окна для людей с ограниченными возможностями
  • Почему российские сайты не будут соответствовать ГОСТу по доступности
  • Web Accessibility in action. Знакомимся с WCAG-стандартом и тестированием доступности
  • Прекратите создавать неполноценные недоступные формы!
  • Чеклист доступности для вашего веб-сайта: часть 2

• Эффекты
  • Креативная реализация кнопки пожертвования
  • Подборка креативных веб-экспериментов „Awesome Demos Roundup #18“
  • Создание аудиовизуализаций, работающих с Web Audio API

CSS

• Задавать Height и Width для изображений снова важно
• Адаптивный дизайн высоты
• Безумие на чистом HTML + CSS
• Сравнение различных способов скрытия вещей в CSS
• CSS Layouts — Использование Flex-Wrap для выхода за рамки сетки
• LibSass прекратил поддержку
• Подробнее о content-visibility
• Трюк с переключением кастомных свойств CSS
• Предотвращение сдвигов макета с помощью CSS grid
• В защиту таблиц и флоатов в современной разработке
• Взгляд на единицы CSS: пиксели, EM и проценты
• Привлекайте внимание пользователя с помощью селектора CSS :focus-within
• Сравнение всех единиц измерения в CSS с объяснением

JavaScript

• Шпаргалка по JavaScript, которая вам понадобится в 2020 году
• Переопределение невозможно: XSS без произвольного JavaScript
• История участника проекта jQuery

• Теория
  • Примеры использования наблюдателей в JavaScript
  • Браузер и числа с плавающей запятой
  • Все, что вам нужно знать о proxy в JavaScript
  • Начало работы с современным JavaScript — деструктуризация
  • Объяснение управления памятью в JavaScript

• React
  • Релиз Next.js 10
  • Как создавать React формы с отличным UX
  • Что нового в NextJS 10
  • Лучшие практики с React Hooks
  • Когда (и когда не) использовать Redux
  • Компоненты высшего порядка: шаблон проектирования приложения React
  • React Router v5: полное руководство

• Vue
  • Как локализовать приложение на Vue.js с помощью vue-i18n и Localazy
  • Уклонение от защиты с помощью VueJS script gadgets
  • Quasar vs. Vutify vs. Bootstrap Vue: выбор правильной UI библиотеки для Vue.js
  • План перехода на новую версию Vue JS 3

• Angular
  • Давайте сделаем переиспользуемый компонент tree view в Angular
  • #53 Angular UIKit. Когда вам потребуется angular schematics. Использование в UiKit и в бизнес приложениях. Рецепт schematics в angular library.
  • Как перестать бояться и создать собственный Angular CLI Builder
  • Важность иммутабельности в приложениях Angular
  • Angular Router: раскрываем некоторые интересные факты и особенности

• Ember
  • The Ember Times — Issue No. 166
  • Представляем @use
  • Ember Micro-Frontends с single-spa

• Svelte
  • React vs Svelte — всестороннее сравнение JS библиотек
  • Sapper мертв! Что будет дальше в Svelte?
  • Рендеринг Svelte и SEO

Браузеры

• Opera станет китайской: компания из Поднебесной получит основной пакет акций
• Некоторые сайты не будут открываться в браузере Internet Explorer, принудительно используя Edge
• В браузере Microsoft Edge появились вертикальные вкладки

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