https://habr.com/ru/post/485584/

• Разработка веб-сайтов
• CSS
• JavaScript
• HTML

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

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

Медиа

• Подкаст «CSSSR»: Новости 512 — Styled Components 5.0, lazy-loading, multi-directional layout, ru Github
• Подкаст «Фронтенд Юность (18+)» #123 Git с балалайкой и медведями
• Подкаст «Девшахта/Ночной фронтенд» №109: Грамотная работа с ошибками. Монада Either.
• Подкаст «Веб-стандарты» №211. Софт-скилы, футбол и жизнь без фронтенда, веб-компоненты, React, гриды, перфоманс, дайвёрсити
• Подкаст «Сделайте мне красиво», Выпуск №33 — Тренды дизайна, микробраузеры и развивающие этюды
• Подкаст Фронтенд Юность (18+) #122 Справедливая зарплата для планктона

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

• Рендеринг веб сайтов 101
• Прощай, чистый код
• Новичок в JAMstack? Вот все, что нужно знать, чтобы начать
• Веб в 2020 году: расширяемость и функциональная совместимость
• Шесть советов при работе над интернационализацией веб-приложений
• Полное руководство по iframes
• Нет необходимости ненавидеть веб-компоненты
• Воссоздание кнопки Arduino с использованием SVG и lit-element

• Инструменты
  • Prettier в крупных проектах: тратим 20 минут на настройку, забываем о форматировании навсегда
  • Оптимизация времени сборки проекта
  • Встречайте Yarn 2!
  • Playwright — новая Node библиотека от Microsoft для автоматизации браузеров на Chromium, WebKit и Firefox. Созданная разработчиками Puppeteer, Playwright нацелена на создание кросс-браузерной, быстрой и вечнозеленой веб-платформы для автоматизации
  • Конфигурация ESLint и лучшие практики
  • Моя история об устаревших инструментах, технологиях и решениях в веб-разработке
  

• Производительность
  • Микрооптимизации производительности и JavaScript
  • Google PageSpeed ​​Insights: правда о значении 100/100
  • Скорость от тысячи порезов
  

• Доступность
  • Доступность в новом Microsoft Edge
  • Плохая доступность означает плохое качество
  

• Эффекты
  • Реализуем визуальный эффект из фильма «Матрица»
  • Эффект разворачивания изображения из рулона с помощью Three.js
  • Подборка креативных интерфейсов «UI Interactions & Animations Roundup #2»
  • Night at the Museum of Very Good Boys
  

CSS

• RTL Styling 101 — подробное руководство по RTL-стилизации в CSS
• The CSS Cascade. Или, как браузеры разрешают вопрос с конкурирующими CSS стилями
• CSS Houdini: все, что вам нужно знать о самых популярных API
• Понимание ключевых слов CSS «Initial», «Inherit» и «Unset»
• Использование адаптивных модификаторов для управления изменениями компоновки в ваших компонентах
• Создание разнонаправленных макетов
• Немного воображаемого CSS
• 4 макета CSS без использования медиа-запросов
• Многострочные градиентные ссылки
• Волшебные радужные градиенты с CSS Houdini и React Hooks
• Внутренние размеры в CSS

JavaScript

• Нововведения JavaScript ES2020 с простыми примерами
• Распространенные ошибки при использование Promise в Javascript
• Чтение и обработка файлов с помощью JavaScript FileReader API
• 10 самых важных фреймворков JavaScript за последнее десятилетие
• Svelte — рецепт для успешного фреймворка?
• Почему я наслаждаюсь Svelte
• Уважаемые поклонники for Loop: давайте будем использовать методы Array
• Визуализация JavaScript: генераторы и итераторы

• React
  • Как использовать Инверсию Управления в JavaScript и в Reactjs для упрощения работы с кодом
  • Обзор JSX с тремя примерами не из React
  • 10 концепций JavaScript, которые вам нужны, чтобы освоить React (+ шпаргалка)
  • Руководство для начинающих по циклам в React JSX
  • Создавайте более доступные формы с помощью React Icons
  • Динамическая загрузка компонентов React с помощью хуков
  

• Vue
  • Чего ждать во Vue 3.0?
  • Как написать приложение Vue.js полностью на TypeScript
  • Как создать прогрессивное веб-приложение на Vue.js
  • Любите Vuetify? Встречайте PrimeVue, новую мощную библиотеку Vue UI.
  • Карусели на Vue.js: SSR поддержка и производительность
  

• Angular
  • Angular 9 и Ivy: ленивая загрузка компонентов
  • Практическое руководство по Angular: сервисы и внедрение зависимостей
  • Как реализовать микро-фронтенд архитектуру с Angular
  

• Ember
  • The Ember Times — Выпуск 131
  • The Ember Times — Issue No. 132
  • Как мы добились «вечнозеленых» сборок в корпоративном приложении на Ember.js
  • RouteInfo Metadata (3.10)
  

• Libs & Plugins
  • JS библиотека для проверки свойств JS, представляющего из себя данные формы.
  • React Nice Dates: адаптивная, с поддержкой тач событий, модульная библиотека для выбора дат
  

Браузеры

• Микробраузеры повсюду. Но что мы о них знаем?
• Исследователи обвинили Opera в выдаче микрозаймов под 438% годовых в обход правил Google
• Google тестирует новый интерфейс меню «Поделиться» в Chrome – с инструментами для создания QR-кодов и скриншотов
• Обзор финальной версии Microsoft Edge на базе Chromium: новый старый знакомый
• Следующая версия браузера Apple Safari выйдет уже без поддержки Adobe Flash
• За последние две недели компания Mozilla заблокировала 197 дополнений к Firefox
• Edgium

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

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