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

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

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

Медиа

• Подкаст CSSSR: Github Codespaces, Playwright и Puppeteer, Masonry layout, Firefox 76, NodeJS 14.2.0 и другие релизы
• Подкаст «Веб-стандарты» №230: Aspect ratio, реклама, appearance: none, top-level await, Deno, хранилище, цена стилей
• UnderJS Podcast #21 — Node.js 14, TypeScript 3.9 [Классический]
• Подкаст «Фронтенд Юность» #138 Синьорские таски
• Видеоблог Вадима Макеева №21. Направляющие для адаптивной сетки на градиентах и кастомных свойствах

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

• Современные архитектуры фронт-энда (часть 2)
• Мартин Сплитт: не пытайтесь заново изобрести колесо в SEO
• Покорение UTM меток
• Доступные изображения, когда они наиболее важны
• Постоянное хранилище (Persistent storage)
• Онлайн-визуализатор SVG Path
• Подборка креативных концептов «UI Interactions & Animations Roundup #6»

• Производительность
  
  • Дорогая цена стилей. Доклад Яндекса
  • Оптимизируем загрузку рукописного шрифта
  • Стоит ли хостить у себя Google Fonts

CSS

• Отзывчивый шрифт. Адаптация текста между макетным и минимальным значениями
• CSS-функции min(), max() и clamp()
• Анимация таймлайна в CSS: создание машины Голдберга
• Современные CSS решения для старых CSS проблем
• CSS фикс для 100vh в мобильном WebKit
• Как укротить Line Height в CSS
• Адаптивная раскладка masonry на CSS grid + vanilla JavaScript
• Использование CSS-масок для создания зубчатых краев
• Превращение объекта фиксированного размера в адаптивный элемент

JavaScript

• Стыкуемся с МКС с помощью JavaScript и циркуля
• Автор Node.js представил защищённую JavaScript-платформу Deno 1.0
• Самые сложные вопросы на JavaScript-собеседовании. Часть 2
• The Deno Handbook: краткое введение в Deno
• Сертификация по Node.js: мой опыт и советы
• Особенности JavaScript, о которых можно забыть
• Релиз TypeScript 3.9
• Сравнение Elm с Ember Octane и React

• Теория
  
  • Визуализация промисов и Async/Await
  • Понимание деструктуризации, рест параметров и синтаксиса оператора spread в JavaScript
  • Взгляд в будущее JavaScript
  • Разбор Javascript-стайлгайда от Google
  

• React
  
  • Подкаст «Пятиминутка React»: Recoil — A state management library for React Pro Unlimited
  • Андрей Мелихов: Пробуем Deno на примере простейшего сервера и React SSR
  • Recoil — Библиотека управления состоянием для React
  • Начинаем работать с React — современное руководство для начинающих (включая хуки!)
  • Ответы блогеров: (Практически) полное руководство по поведению рендеринга в React
  • Доступные анимации в React. Хук “prefers-reduced-motion”
  • Стилизация компонентов в React
  • Настройка TypeScript для современных проектов на React с использованием Webpack и Babel
  • Работа со stale props и состояниями в функциональных компонентах React
  • React Cool Inview — React хук для мониторинга элементов, которые появляются или пропадают во вьюпорте (или другом элементе)

• Vue
  
  • Vue плагины, о которых вы не знаете, что они вам могут понадобиться
  • 5 советов по JavaScript, которые я извлек из исходного кода Vue
  • Модульная модальная система с TypeScript и Vue.js.
  

• Angular
  
  • Отложенное применение функционала директив в Angular
  • Кастомный скроллбар в Angular
  • Обновление устаревшего веб-приложения на Angular
  • Избавьтесь от if-операторов в вашем Angular приложении с помощью ООП
  • Angular Starter: Angular 9 + Material + Transloco + Jest + Compodoc
  

• Ember
  
  • Релиз Ember 3.18
  • MDN web docs: Ember tutorials
  • The Ember Times — Issue No. 148
  • Настройка Coveralls для ваших аддонов в Ember
  • Настройки производительности Ember: оптимизация ресурсов
  

• Svelte
  
  • 3 разных способа межкомпонентного общения в Svelte
  • Как использовать Typescript со Svelte
  

• Libs & Plugins
  
  • 5 JavaScript-библиотек для работы со строками
  • Perfume v5 — небольшая библиотека для мониторинга веб-производительности
  

Браузеры

• Chrome расширение для скрытия отвлекающих рекомендации на YouTube
• С августа Google Chrome начнет блокировать и «тяжелую» рекламу, оказывающую большую нагрузку на CPU и батарею
• Google добавит в Chrome группировку вкладок и выделение их цветом для повышения продуктивности
• В Firefox 78 появится менеджер процессов
• Google Chrome начнёт блокировать загрузку ресурсоёмкой рекламы
• В ночные сборки Firefox внесены спорные изменения в интерфейс режима читателя
• Mozilla отключила дополнительную аутентификацию для систем без мастер-пароля
• Что нового в DevTools (Chrome 84)

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

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