Дайджест свежих материалов из мира фронтенда за последнюю неделю №407 (16 — 22 марта 2020)

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

Медиа    |    Веб-разработка    |    CSS    |    JavaScript    |    Браузеры    |    Занимательное

Медиа

• Подкаст «CSSSR»: Github купил npm, remote-конференции, CSS и Houdini, магия calc(), Java SE 14, токсичный Angular
• UnderJS Podcast #17 — Беседы с Михаилом Башуровым про типы и HolyJS
• Подкаст «Веб-стандарты» №221: Отмена событий, Firefox и KaiOS, ненужный CSS, вьюпорт, размеры картинок, цвета, Vue.js
• Подкаст «Frontend Weekend» #103 – Алексей Золотых о переезде из Челябинска, ценности работы в ПК HolyJS и множества выступлений
• Подкаст «Сделайте мне красиво», Выпуск №36 — Коронавирус, джуниоры лучше сеньоров и недоступная доступность
• Подкаст «pro​Conf» #54 AngularConnect — ProConf на карантине | Angular 9 | Ivy | Нейронки наступают | Как делать ревью

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

• «Не закрывайте теги!»
• Неразбериха с заголовками: когда они терпят неудачу во WCAG?
• Что означает «playsinline» в веб-видео?
• Быстрая интеграция фронтенда через компоненты
• Оптимизация совместной работы между фронтенд разработчиками
• Просто о Чистом коде и качестве кода (Code Quality & Clean Code)

• Инструменты
  • Micrоsoft покупает NPM и будет развивать его вместе с GitHub
  • Инструменты для оптимизации SVG
  • Prettier 2.0 “2020”
  

• Производительность
  • Поддержка производительности. Или… Как я сократил загрузку страницы на ~33с, исправив шрифты
  • DevTools Performance Tab – использование Chrome Profiler для оптимизации скорости вашей страницы
  

• Эффекты
  • Играем с частицами с помощью Web Animations API
  • Создайте эффект движения волны на изображении с Three.js
  • Идеи для эффектов искаженная ссылок в меню
  • Как создать аккордионовый эффект наведения с помощью box-shadows
  

CSS

• CSS: приключения в стране полупрозрачности
• CSS разработчики — почему они нужны миру?
• CSS Grid: Верстаем адаптивный журнальный макет в 20 строк
• Туториал. Простая анимация на чистом CSS
• Когда 255 × 0 не равно нулю
• Комбинации в CSS: background-color и linear-gradient
• ‘CSS X’
• Полное руководство по calc() в CSS
• Неоморфизм и CSS
• Размещение текста по траектории с помощью CSS
• Практический обзор CSS Houdini
• Все о Auto в CSS
• CSS: гибкие повторяющиеся SVG маски

JavaScript

• Почему JavaScript пожирает HTML: примеры кода
• Знакомимся с NestJS
• Внедри это полностью. DI-in-JS
• В Google ответили на вопросы о SEO для JavaScript
• Монорепозитории в JavaScript, анти-паттерн
• For...of циклы в Javascript: один цикл, чтобы управлять ими всеми
• Полезные советы по использованию console.log()
• Angular vs React vs Vue [2020 Update]

• React
  • Понимаем компоненты высшего порядка в React на реальном примере
  • React Suspense на практике
  • Создание таблиц c сортировкой с помощью React
  • Реализация бесконечной прокрутки и отложенной загрузки изображений в React
  

• Vue
  • Создатель Vue.js об истории создания фреймворка
  • Правильный способ заставить Vue перендерить компонент
  • Глубокое погружение в управление состоянием Vue
  • Как протестировать свои Vue компоненты с помощью Jest
  • В качестве фреймворка для WikiMedia выбран Vue.js
  • Vue.js Amsterdam 2020
  

• Angular
  • Как ускорить время сборки Angular с помощью кэширования
  • Angular: храним его жирным, тупым и счастливым
  • Ленивая загрузка Angular компонентов в не-Angular приложениях
  

• Ember
  • The Ember Times — Issue No. 140
  • EmberConf 2020 Notes: краткий обзор основных моментов выступлений на EmberConf 2020
  • Руководство по тестированию Ember
  • Рефакторинг шаблонов Ember — быстрый совет
  • EmberConf 2020
  

• Svelte
  • Композиция в Svelte 3: слоты
  • Использование use в Svelte
  

• Libs & Plugins
  • Движок/алгоритм для шахмат, созданный только с использованием vanilla JS, CSS, HTML.
  • heapify — Очень быстрая очередь приоритетов JavaScript, реализованная с использованием двоичной кучи
  • Введение в AntV, технологию в визуализации данных
  • mutik: крошечная (495B) библиотка для управления иммутабельностью на базе Immer
  

Браузеры

• SameSite=Lax по умолчанию — уже в Chrome 80 stable (правда, пока не у всех)
• Разработчик оценил сложность современных браузеров
• Firefox отказывается от поддержки протокола FTP
• Выпуск Chrome 81 отложен из-за перехода сотрудников Google к работе на дому
• Новые релизы Chrome задерживаются из-за коронавируса

Занимательное

• WordPress и Apache Struts среди web-платформ лидируют по числу уязвимостей с эксплоитами
• Проект OpenSilver развивает открытую реализацию Silverlight
• Корпоративный мессенджер Slack получил самый большой редизайн с момента своего запуска
• Что не так в инструкциях по удаленной работе: вы забыли, что дома есть дети
• Робохроники ИИ: алгоритмы как спасение от коронавируса, обучающие искусственный интеллект заключенные и чип-«нюхач»

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

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