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

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

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

Медиа

• Подкаст «UnderJS Podcast» #6 — Деоптимизация React внутри V8, preventExtension курильщика
• Подкаст «CSSSR»: Argumentarium —Хуки, декларативность и классы
• Подкаст «Пятиминутка React» — Reatom vs Redux
• АйТиБорода: Всё про Node.js / От 0 до 2,5к долларов за год / Интервью с Backend JS Developer
• FrontSpot Show #13: Виталий Бобров про переезд в Польшу и мировом турне с JS докладами.
• Repozitorro #30 — Выглядит — просто, поэтому заглянем «под капот»
• Подкаст «Веб-стандарты» №196. Eva Ferreira и Ian Pouncey on chromakey, Argentina, a11y, SEO, HTML, ARIA
• Подкаст «Веб-стандарты» №197. FrontendConf, Web Components, AOM, ARIA challenges, browser support, dialogs и date pickers

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

• Интервью с веб-разработчиком Pornhub
• Как простой <img> тэг может стать высоким риском для бизнеса?
• Избыточная вариативность во Front-end Stack: суть и причины
• Ссылочные атрибуты nofollow, sponsored и ugc и их влияние на SEO
• W3C отмечает двадцатипятилетний юбилей
• Анализ использования HTML на ~8 миллионов страницах (и что это значит для современного SEO)
• Каскадирование инвалидации кеша
• Немного практики с элементом HTML Dialog
• Разница между форматами шрифтов
• Превратите ваш сайт в PWA

• Производительность
  • Оптимизация загрузки JavaScript-кода в Wikipedia
  • Время до первого байта: что это такое и почему это важно
  • [Не] используйте CDN
  • Изображения, сделанные правильно: веб-графика, которая хороша до последнего байта
  • Рецепты для тестирования производительности SPA в WebPageTest
  

• Доступность
  • Верховный суд присудил победу слепому человеку, который подал в суд на Domino за-за доступности
  • Доступность: веб-ссылки должны быть ссылками, а веб-кнопки должны быть кнопками
  • Что такое ARIA? Руководство для начинающих по ARIA
  

• Эффекты
  • Подборка креативных сайтов Inspirational Websites Roundup #9
  • legendary-cursor — креативный курсор на WebGL
  • Создание эффекта водо-искажения с помощью Three.js
  

CSS

• Sass MediaScreen — Определяем девайсы на CSS
• Современный сброс стилей CSS
• Извлекаем критический CSS
• Презентация модулей в Sass
• Sass: модульная система запущена
• Clipping, Clipping, and More Clipping! Примеры креативного использования свойства clip-path
• Шаблоны для практического использования пользовательских свойств CSS
• CSS и окружности
• Руководство по новым и экспериментальным инструментам для работы с CSS в Firefox DevTools
• Можно ли нам стилизовать элемент select, пожалуйста ?!
• Toucaan — переосмысление CSS фреймворков
• Новый мощный CSS для стилизации маркеров, чисел и маркеров в списках

JavaScript

• TypeScript. Мощь never
• 12 возможностей ES10 в 12 простых примерах
• Что лучше выбрать в 2020 году — React или Vue?
• Как работать с localStorage в JavaScript
• Как определить Ad Blocker
• Создание приложения распознавания лиц на JavaScript, которое работает как в фильмах
• Руководство по JavaScript в стиле игры-«рогалика»
• Соглашения об именовании в JavaScript

• Теория
  • Наследование в JavaScript с точки зрения занудного ботаника: Фабрика Конструкторов
  • Высокоуровневый await
  • Понимание This, Bind, Call и Apply в JavaScript
  • Когда использовать Map вместо простого JavaScript-объекта
  • JavaScript Promises: От нуля до героя, плюс шпаргалка
  • Полное руководство по использованию массивов в JavaScript
  • История троеточия в Javascript
  

• React
  • Встречайте Create Next App
  • Часть 1: вопросы для интервью по React
  • Полное руководство по аутентификации в Next.js с Auth0
  • Как реализовать Idle Timeout в React
  • Использование JSX для вашей собственной легкой декларативной UI библиотеки
  

• Vue
  • 10 советов и приемов, которые помогут вам стать лучшим разработчиком на VueJS
  • MSK VUE.JS meetup #3 в Mail.ru Group: материалы с митапа
  • Создание библиотеки компонентов Vue.js в качестве модуля (часть 1)
  • Мгновенный поиск с Vue.js и Axios
  • Vue-Next и почему Map решают большую проблему
  • Как шарить компоненты Vue между приложениями
  • Разделение Vue.js компонентов из Vuex Store
  • Управление SVG изображениями в приложениях на Vue.js
  • Vue3: Первый взгляд
  • Создайте приложение для опросов в реальном времени, используя Vue и Socket.io
  

• Angular
  • Взаимодействие между компонентами Angular с использованием RxJS
  • Что под капотом Angular 8?
  • Миграция в Angular 8 от TSLint до ESLint
  • Отслеживание запросов в Angular приложении с инжекторами дочерних модулей без отложенной загрузки
  

• Ember
  • Ember-engines: что, что нет и почему? — часть 1
  • О {{mut}} и двусторонний биндинг
  • Промисы и UI состояния в Ember.js
  • Ember и GraphQL: быстрый пример
  

• Libs & Plugins
  • roughViz — JS библиотека для создания стилизованной под скетч / нарисованных от руки диаграмм в браузере
  • is-website-vulnerableм — находит общеизвестные уязвимости в библиотеках JavaScript на сайте
  • Как сделать JavaScript локализацию с помощью jQuery.i18n
  

Браузеры

• Chrome полностью заблокирует смешанный контент
• 10 малоизвестных возможностей инструментов разработчика Chrome
• В Firefox добавлена поддержка работы в режиме киоска
• Код Firefox полностью избавлен от XBL
• Google добавила вспомогательные функции для слепых и слабовидящих пользователей в Chrome и Maps
• Chrome Web Store блокировал публикацию обновления uBlock Origin

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

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