Дайджест новостей из мира фронтенд-разработки за последнюю неделю 9–15 мая.
Спецификации
Этические принципы и принципы конфиденциальности при разработке веб-платформы.
HTML
Узнайте очередное доказательство того, что интернет сломан.
«Волшебные техники SVG».
Узнайте, как использовать видео с прозрачностью.
CSS
STATE OF CSS 2022.
Узнайте важен ли порядок CSS-свойств в блоке правил.
Взгляд в прошлое, чтобы оценить то, что изначально в CSS сделано правильно.
PurgeCSS и styled-components. PurgeCSS не работает?
JavaScript
Создайте музыкальный инструмент с помощью Web Audio API.
Давайте разберемся почему вендорные префиксы в JavaScript нужно указывать с заглавной буквы, например,
button.style.WebkitFilterилиbutton.style.MozFilter.Jest переехал в OpenJS Foundation.
У TS вышел новый релиз кандидат 4.7.
В защиту SPA. (это шутка)
React
Узнайте про хук useEvent для того, чтобы более точно работать с событиями. Сейчас фича на стадии сбора обратной связи.
Чем является и чем не является хук useEvent.
Узнайте почему атрибут key не так уж и не важен.
Подробно про свойство "as".
Сравнение webpack и vite для storybook.
Angular
Продолжаем обновляться до v13.3.7 или даже v13.3.8.
и пробовать бету 14.0.0-rc.0, кстати уже релиз кандидат.
Node.js
Используйте 2FA для npm.
JavaScript вне браузеров. Новая инициатива Cloudflare, Vercel, Shopify по вопросам совместимости и разработки веб API для небраузерных сред.
Узнайте про программы-вымогателей в модулях node.js.
Nodenext и TS. Узнайте про поддержку модулей ES в TS.
Про Github Pulls AP для управления пулреквестами.
Управление OAuth учётными данными в node.js приложении.
Vue
Я видел ваши просьбы добавлять информацию про Vue. Спасибо вам за обратную связь. В следующем выпуске добавлю.
Производительность
Повлияйте на то, как браузеры извлекают ресурсы.
Сравните производительность JavaScript-фреймворках с помощью Google CrUX.
Узнайте как работать с профилировщиком производительности в DevTools.
Инструменты
reagraph — визуализация сетевых графов, в которой используется WebGL для 2D и 3D-рендеринга.
Babylon.js 5.0 — движок для рендеринга 3D.
Ещё не используете AVIF? Тогда узнайте список инструментов, которые помогут вам создать AVIF.
crypto-random-string — для генерации криптографически стойкой случайной строки. Работает в браузере и node.js.
Motion DevTools для отладки анимаций в DevTools.
Браузеры
В Edge появится бесплатный встроенный VPN.
Общее
Улучшайте UX с помощью дизайн KPI.
Исправьте UX вашего окна согласия на использование cookie.
Решите проблему жёлтого цвета для цветовых палитр.
Зацените новый Roboto Flex с огромным диапазоном веса и ширины.
Не выгорайте. Узнайте как компании помогают своим сотрудникам.
Apple, Google и Microsoft объединились, чтобы создать вход в систему без пароля.
Узнайте 101 принцип дизайна.
Узнайте как создать лучший компонент по переключению языка.
Как читать статьи на английском языке
В дайджесте много статей и видео на английском языке, чтобы это не стало препятствием: в Google Chrome есть функция перевода страницы с любого популярного языка, а видео можно перевести в Яндекс Браузере.
