Дайджест свежих материалов из мира фронтенда за последнюю неделю №413 (27 апреля — 3 мая 2020)

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

Медиа    |    Веб-разработка    |    CSS    |    JavaScript    |    Браузеры    |    Занимательное

Медиа

• Подкаст CSSSR: Автоматизация рефакторинга, миграция на TS, TypeScript 3.9 RC, Redis 6, релизы NodeJS и RoR
• Подкаст «Веб-стандарты» №227: Сайт Веб-стандартов, cssunderhood, Chrome, цвета, кастомные свойства, Brotli, цена фреймворков
• RWPod Кафе 15: Andrey Sitnik
• Подкаст CSSSR. Argumentarium – Место верстки во Вселенной
• Я.Субботник по разработке интерфейсов 2020

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

• Opium.Fill — стандартизация цветовой схемы глазами программиста
• Современные архитектуры фронт-энда
• Современное SEO: AMP-истории
• Что каждый разработчик должен знать о https
• Немного невинных забав с HTML-видео и Progress
• Хранилище для веба. Существует много разных вариантов хранения данных в браузере. Какой из них лучше всего подходит для ваших нужд?
• Как не попасть в ловушку браузерного кэша

• Производительность
  • Как уменьшить размер бандла — стратегия однобуквенных классов в css-modules
  • Мониторинг производительности CSS-анимации
  • Автоматизация тестирования веб-производительности с помощью Puppeteer
  

• Доступность
  • Комбинации в ARIA: role=checkbox и aria-checked=mixed
  • Избегайте aria-roledescription
  

• Эффекты
  • Эффект морфинга при наведении на текст
  • Руководство по воссозданию эффекта погружения при скроллинге
  

CSS

• Полностью отзывчивый дизайн — это больше, чем просто медиа-запросы
• Гибкая разметка без медиа-запросов: функции min(), max(), clamp()
• Мои любимые вопросы о CSS с детальными ответами
• Atomic CSS-in-JS
• Selection в CSS
• Фейковые трехмерные элементы с помощью CSS
• Мысли по поводу реализации Container Queries в браузерах
• Свойство CSS «content» принимает альтернативный текст
• Как решить проблему Z-index в течение 1 минуты
• 3 безумно простых способа переключить ваш сайт в темный режим
• Создайте красивый input range только с CSS
• Что мы упускаем при обучении CSS?

JavaScript

• Дорога в ад JavaScript-зависимостей
• Я перехожу на JavaScript
• Продвинутый TypeScript
• Цена JavaScript-фреймворков
• Неироничная ненависть к JavaScript
• Alpine.js: JavaScript Framework, который используется как jQuery, написан как Vue и вдохновлен TailwindCSS
• Продолжительный рефакторинг 100000 строк кода — TinyMCE на TypeScript
• Шпаргалка по window.location

• React
  • Создаём веб-приложение с бэкендом на Django и фронтендом на React
  • Разработка реактивного гамбургер-меню с помощью React-хуков, TypeScript, и styled-components.
  • Улучшение производительности загрузки страниц Next.js и Gatsby с помощью чанков
  • Демистификация React Redux
  • Что бы я хотела знать о React
  • Должен ли я использовать делегирование событий в React?
  • Интеграционное тестирование в React: больший охват, меньше тестов
  • Реализация темного режима в приложениях React с использованием styled-components
  • Визуальное руководство по ментальным моделям React
  • Сравнение Next.js и After.js для приложений c SSR React
  

• Vue
  • Spring-анимации во Vue
  • Новые функции в Vue 3 и как их использовать
  • Защита Vue Router
  

• Angular
  • Русскоязычная документация по Angular
  • Angular CLI flows. Big picture.
  • Плохие практики Angular: свежий взгляд
  • Лучший способ передать данные в ваши Angular компоненты
  

• Ember
  • Рекурсия в шаблонах Ember.js, case factorial(n)
  • Превью деплойментов с с ember-cli-deploy и Github actions
  

• Svelte
  • Почему стоит попробовать Svelte
  • Хотите изучить Svelte? Вот наш бесплатный курс из 16 частей от Svelte Master
  • Обработка инпутов в Svelte
  

• Libs & Plugins
  • Cupertino Pane — современная слайд-панель с использованием тач-технологий
  • 10 JavaScript библиотек для манипуляций с изображениями на 2020 год
  • quotable-toolbar — TypeScript плагин, который реализует цитирование текста на веб-страницах
  • Определение токсичности текста с помощью React и Tensorflow
  • Hero Generator: Создайте красивый hero image для своего сайта или приложения
  • jExcel это плагин для создания электронных таблиц в вебе, совместимых с Excel и другими таблицами
  • utfu: заменяет непонятные символы из старых кодировок на правильные символы UTF-8.
  

Браузеры

• Браузеры. Вольный перевод статьи Джереми Кейта “User agents”
• Доступен Firefox Preview 5.0 для Android

Занимательное

• Mozilla тестирует сервис анонимных email-адресов Firefox Private Relay
• Microsoft открыл свою реализацию протокола QUIC, применяемого в HTTP/3
• С 2006 года Google закрыла 200 проектов: 23 приложения, 16 устройств и 161 сервис
• Новое платье капитализма. Как IT-компании превратились в надзирателей
• LinkedIn добавила инструмент для репетиций собеседований: программа находит слабые места в речи и даёт рекомендации
• Google сделали доступными старые мини-игры, посвященные разным событиям

Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.

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