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

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

Медиа

• «Новости 512» от CSSSR: История React API, доклады и воркшопы с «Я <3 фронтенд», нюансы this, релизы браузеров и V8, semver
• Подкаст «Сделайте мне красиво» №57 — Если всё работает, то и тесты не нужны
• Подкаст «Веб-стандарты» №273. Старый Edge, Safari, React Native и Preact, MDN по-русски, печать, EditorConfig, ховеры, шрифты

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

• Очередной гайд по HTML-элементам, которые можно использовать в каждом проекте
• Объяснение принципа работы Webpack’s Hot Module Replacement Feature
• Как имитировать мобильные устройства в режиме Device Mode в Chrome
• Русская локаль на MDN разморожена и можно снова участвовать в переводе лучших материалов для веб-разработчиков. Желающие присоединиться к проекту могут отписаться в соответствующем issue

• PWA
  • Минимальное PWA
  • Ваши PWA сломаются в августе 2021 года
  • Это начало конца для PWA?
  

• Производительность
  • Почему вам следует тестировать мобильную производительность
  • Vodafone: улучшение LCP на 31% увеличило продажи на 8%
  • В Google подтвердили, что расширения пользователя могут влиять на оценку Core Web Vitals
  

• Доступность
  • Практическая доступность, часть 1: семантика разметки и ARIA
  • Good, Better, Best: распутывая сложный мир шаблонов доступности
  • Доступные текстовые метки для всех
  

CSS

• Официальная вложенность в CSS — последний кусочек головоломки
• Знаете ли вы о CSS селекторе :has?
• Три важных вещи, которые вы должны знать о :is() в CSS
• 100 анимаций подчеркивания/наложения | The ultimate CSS collection
• CSS генераторы
• Fluid Space Calculator
• Лучшие техники переноса строки для длинных URL-адресов
• Новости платформы: Prefers Contrast, MathML, :is(), и CSS Background Initial Values
• Что я делаю с размерами шрифтов
• Да, вот лучший фреймворк CSS в 2021 году

JavaScript

• Удобный доступ к буферу обмена с Clipboard API
• JavaScript prototype pollution: практика поиска и эксплуатации
• Обработка пользовательских разрешений в JavaScript
• Совет №1 по ознакомлению с новыми кодовыми базами JavaScript
• Что такое JavaScript Internationalization API (I18n)?

• Теория
  • Основы JavaScript: почему вы должны знать, как работает JS-движок
  • 7 вопросов про замыкания в JavaScript
  • Переосмысление тернарного оператора в JavaScript
  

• React
  • Создайте приложение для отслеживания бюджета на React — изучение React & Context API с помощью интересного проекта
  • 10 вопросов начального уровня по React на собеседовании
  • Что нового в Gatsby 3.0
  • Интеграция Google Maps в React
  

• Vue
  • Сделаем худший Vue.js в мире
  • 5 советов по повышению производительности Vue
  • Миграция приложения на Vue 3: история из реальной жизни
  

• Angular
  • Angular Universal: проблемы реального приложения
  • RBAC в Angular-приложениях
  • 2 способа динамической загрузки Angular Components
  • Изучите расширенные функции Angular: создайте Material tree
  • Плохие методы NGRX
  • Добавление поддержки Reduced Motion в анимациях Angular
  • Запуск event listeners за пределами NgZone
  

• Svelte
  • Сравнение Svelte и React
  • 10 лучших видео о Svelte в 2020 году
  • Storybook для Svelte
  

• Libs & Plugins
  • Hanakana — универсальная система письма (UWS), способная представлять все звуки человеческого голоса в сжатой и удобочитаемой форме.
  • Copenhagen — бесплатный, легкий и легко настраиваемый редактор кода
  

Браузеры

• Из Firefox намерены убрать компактный режим отображения панелей
• В ночных и бета сборках Firefox включена по умолчанию поддержка HTTP/3
• Chrome получил функцию Live Captions и теперь может автоматически создавать субтитры для видео и аудио с речью


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