Дайджест свежих материалов из мира фронтенда за последнюю неделю №386 (21 — 27 октября 2019)

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

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

Медиа

• Подкаст «CSSSR»: Новости 512 — NodeJS 12 LTS, React Concurrent Mode, PWA, Figma, Chrome 78, Electron 7
• Подкаст «Девшахта/Ночной фронтенд» 100: Асинхронный контекст
• Подкаст «Фронтенд Юность (18+)» — #112 Думай быстрее, а то прямо здесь получишь
• Winterview — #102 — Илья Немиро о собеседованиях фронтендеров
• Подкаст «Веб-стандарты» №200: CSS passion, Every Layout, why Sass, owls or gaps, Container Queries, BEM
• Repozitorro #32 — Лендинг на React! Миф, или реальность?)
• Nordic.js 2019, 27 видео

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

• Не потерял ли GraphQL актуальности в эпоху HTTP/2?
• Интерактивное веб-приложение без программирования? Легко! Mavo вам в руки
• Фриланс-вебдев — как и с кем НЕ стоит работать
• Движение IndieWeb: владение своими данными и изменение того, что вы хотите видеть в интернете
• Создние приложения для закладок с помощью FaunaDB, Netlify и 11ty
• Руководство по оптимизации изображений для мобильных устройств
• Почему Parcel стал моим основным бандлером для разработки
• Ориентация изображения в вебе
• HTMHell — Коллекция плохих практик в HTML, скопированная с реальных сайтов.

• Доступность
  • Почему доступные веб-сайты так сложно создать?
  • Доступность, будущее и почему кейс Domino’s имеет значение
  • Fata Morgana в Accessibility
  • Доступные буквицы
  • Как компании могут предотвратить судебные иски по ADA Website Accessibility
  

• Эффекты
  • Создание креативных hover-эффектов в форме пятен с помощью Three.js
  • Играем в Beat Saber в браузере с помощью движений тела, используя PoseNet & Tensorflow.js
  • Интерактивная форма для кредитной карты на VueJs
  • Визуализация звука с помощь D3 и API Web Audio
  

CSS

• Маленькие хитрости кастомных свойств (CSS-переменных)
• Создание Scrapbook-макета на CSS Grid
• Нетривиальная расстановка элементов на flexbox без media-запросов
• Синтаксис с двумя значениями для свойства CSS Display
• Новые правила игры для CSS: min() и max() теперь в @webkit
• Используйте CSS Grid на продакшене уже сегодня
• 8 современных CSS-функций (и как их использовать)
• Frontend Focus: Dark Mode. Об особенностях и текущем состоянии темного режима в вебе
• CSS тренды 2019: полное руководство для отслеживания последних тенденций CSS
• История гридов: от печатного станка до современного веб-дизайна
• Небольшое руководство по вариативным цветным шрифтам
• 25 дней CSS-анимации: самообучение CSS с помощью Motion Design.

JavaScript

• Кто он — убийца JavaScript?
• Каскадная инвалидация кэша. Часть 1
• 7 простых, но хитрых вопросов на интервью по JavaScript
• Мой подход к документированию проектов на Javascript
• Почему я перестал использовать экспорт по умолчанию в моих JavaScript-модулях
• Как работает reduce() в JavaScript, когда его нужно применять и какие крутые вещи можно с ним делать
• 7 самых популярных фреймворков Node.js в 2019 году
• Написание асинхронных задач в современном JavaScript
• Проблемы shared mutable state и как их избежать
• Раскрытие тайн sort() в JavaScript

• Релизы
  • Выпуск серверной JavaScript-платформы Node.js 13.0
  • Electron 7.0.0
  • Puppeteer v2.0.0 Release Notes
  

• Svelte
  • Ускоренный курс Svelte (в 10 фото)
  • Что мне нравится в написании стилей со Svelte
  • Как создать игру Tic Tac Toe с помощью Svelte
  • Как создать приложение новостей со Svelte
  • Справочник по Svelte
  • Svelte vs React: первые впечатления
  

• React
  • Redux — Не нужен! Заменяем с помощью useContext и useReducer в React?
  • Подготовка к будущему с React Prereleases
  • Я протестировал React приложение с помощью Jest, Enzyme, Testing Library и Cypress. Вот различия.
  • Как эффективно использовать Context API с хуками, избегая узких мест в производительности
  • 7 способов реализовать условный рендеринг в React-приложениях
  • 55 уроков после 5-тилетнего использования React
  

• Angular
  • Компоненты-агностики в Angular
  • Angular Architecture — неофициальные документы
  • Angular & CSS Grid: динамические свойства сетки
  • Как правильно реализовать ленивую загрузку в Angular 7/8
  

• Vue
  • 10 лучших практик для создания и поддержки крупных проектов на Vue.js
  • Год с Nuxt.js — обзор фреймворка
  • Использование Vue Composition API с Firebase
  • Мысли о Vue 3 Composition API — `reactive()` считается вредным
  

• Libs & Plugins
  • plexis — мощная и управляемая сообществом библиотека для работы со строками.
  • Jsfuzz: фаззинг (CGF) — тестирование для Javascript
  • Peaks.js — взаимодействие с аудио-волновыми графиками
  

Браузеры

• Улучшение элементов управления в Microsoft Edge на Chromium
• Релиз Firefox 70
• Firefox 70: детали для веб-разработчиков от Марата Таналина
• Релиз Chrome 78
• Firefox внедрил защиту от отслеживания в социальных сетях
• В мобильном браузере Firefox Preview появится поддержка дополнений
• Немецкое управление по информационной безопасности назвало Firefox самым защищенным браузером
• В Samsung Galaxy Store появляется поддержка PWA

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

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