Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
• «Новости 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
• Официальная вложенность в 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 году
• Удобный доступ к буферу обмена с Clipboard API
• JavaScript prototype pollution: практика поиска и эксплуатации
• Обработка пользовательских разрешений в JavaScript
• Совет №1 по ознакомлению с новыми кодовыми базами JavaScript
• Что такое JavaScript Internationalization API (I18n)?
• Из Firefox намерены убрать компактный режим отображения панелей
• В ночных и бета сборках Firefox включена по умолчанию поддержка HTTP/3
• Chrome получил функцию Live Captions и теперь может автоматически создавать субтитры для видео и аудио с речью
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Медиа | Веб-разработка | 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
- Производительность
• Почему вам следует тестировать мобильную производительность
• 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
- Libs & Plugins
• Hanákana — универсальная система письма (UWS), способная представлять все звуки человеческого голоса в сжатой и удобочитаемой форме.
• Copenhagen — бесплатный, легкий и легко настраиваемый редактор кода
Браузеры
• Из Firefox намерены убрать компактный режим отображения панелей
• В ночных и бета сборках Firefox включена по умолчанию поддержка HTTP/3
• Chrome получил функцию Live Captions и теперь может автоматически создавать субтитры для видео и аудио с речью
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.