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

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

Медиа

•

Подкаст «Веб-стандарты» #282: Rome, CloudFront Functions, кроссбраузерность, has() и другой современный CSS, мониторинг, GDE
• podcast

Подкаст «Фронтенд Юность» #187: Bootstrap круче чем все сраные фреймворки
• podcast

Подкаст «Callback Hell»: Производительность CSS-in-JS, языки логического программирования, ООП в современном фронтенде
• podcast

«Новости 512» от CSSSR: Angular 12, Deno 1.10, мониторинг, тестирование UI, :has(), курс по git, Rome + $, TypeScript 4.3 RC
• podcast

Подкаст «Callback Hell» — Поддержка нескольких мажорных версий, венчурный капитал в Open Source и возвращение тонкого клиента
• podcast

Goose&Duck Podcast п(и)лотный – Babel, деньги, два гуся
• podcast

Подкаст «proConf» #96: DeveloperWeek 2020
• podcast

Подкаст «Цинковый Прод» #113: Сайт сына маминой подруги

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

• W3C представил черновой вариант стандарта WebGPU
•

Google AMP мертв! AMP-страницы больше не пользуются приоритетом в поиске Google
•

Incremental Static Regeneration: создавайте статические сайты понемногу
•

Тестирование фронтенд-приложений — что, где, как?

Инструменты
• Harold — генератор статических сайтов и блогов, основанный на Handlebars и Markdown.
• Релиз Sublime Text 4
• 5 стратегий по сокращению времени сборки фронтенда с помощью CI/CD
• svg-loader: другой способ работы с внешними SVG

Производительность
• Как мы улучшили наш Core Web Vitals (пример из практики)
• 5 шагов к быстрым веб-шрифтам

Доступность
• «Giving a damn about accessibility». Откровенное и практичное руководство для дизайнеров.
• Автоматическое тестирование доступности поможет вам в этом, но не обнаружит всех проблем

Эффекты
• Подборка креативных интерфейсов «UI Interactions & Animations Roundup #16»
• Как легко добавлять CSS-анимацию в свои проекты

CSS

•

Трюки CSS, которые сделают из вас ниндзя верстки
• habr

Взгляд на Tailwind CSS
•

Новая отзывчивость: веб-дизайн в мире компонентов
•

Нет, утилитарные классы — это не то же самое, что инлайн стили
•

Как создать неоновый текст с помощью CSS
•

Как стилизовать любое поле ввода — советы и методы
•

82% разработчиков неправильно проходят этот трехстрочный тест по CSS
•

Learn CSS — Постоянно обновляемый курс CSS и справочник для повышения вашего уровня знаний в области стилизации веба
•

aspect-ratio

JavaScript

•

Швейцарский нож отладки JavaScript
• habr

Трасси… что? Доклад Яндекса
•

DOM Events — изучение системы событий DOM с помощью визуального исследования
•

ES12 сделает вашу жизнь проще
•

Справочник по массивам JavaScript — методы работы с JS-массивами с примерами
•

Понимание Async Resources с помощью асинхронных хуков
•

Двухмерные оптические демки в Javascript
•

JavaScript API для распознавания людей и ботов в Chrome

React
• Полное руководство по инкрементной регенерации статических сайтов с помощью Next.js
• Немного о том, как работает виртуальный DOM в React
• Как реализовать аутентификацию в Next.js с Auth0
• Самая большая сила React может заключаться в его экосистеме с открытым исходным кодом.
• Создание редактора форматированного текста (WYSIWYG) с нуля
• 5 методов bundle splitting и отложенной загрузки в React
• use-change — React-хук для состояния приложения, соблюдающий принцип «keep it stupid simple»

Vue
• Руководство по модульному тестированию компонентов Vue
• Как создавать повторно используемые веб-компоненты с помощью Lit и Vue
• Управление состоянием во Vue
• Легко сохраняйте состояние с помощью composable в Vue 3
• Полное руководство по Vue Router 4: основы, программная маршрутизация, Navigation Guards, эффекты перехода и Composition API

Angular
• Angular миграция с tslint на eslint. Перевод монорепозитория Nx на eslint.
• Представляем Angular DevTools
• У Angular наконец-то появилось собственное расширение devTools!
• Основы Angular: 10 полезных нативных веб-API, которые должен знать каждый новый разработчик JavaScript
• Добавление уровня более явной типизации поверх интерфейсов сторонних библиотек
• Bindon: менее известные особенности шаблонов Angular
• Хочешь, чтобы твое приложение на Angular грузилось быстрее? Испольуй Brotli

Ember
• The Ember Times — Issue No. 180
• с нуля до route splitting за 3,5 недели
• EmberJS: Использование встроенного помощника

Svelte
• Svelte для опытных разработчиков React
• Data binding в Svelte

Libs & Plugins
• lightGallery — Легкий, модульный плагин для создания галереи изображений и видео на JavaScript. Доступно для React.js, Vue.js, Angular и TypeScript.

Браузеры

•

Microsoft прекратит поддержку приложения Internet Explorer 11 в Windows 10 с июня 2022 года
• habr

Кросс-браузерный трекинг на основе перебора обработчика внешних протоколов
• В Chrome экспериментируют с поддержкой RSS, чисткой User-Agent и автосменой паролей
• Компания Mozilla представила режим строгой изоляции сайтов для Firefox
• Выпуск перенастраиваемого web-браузера Nyxt 2.0.0

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

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