Дайджест свежих материалов из мира фронтенда за последнюю неделю №338 (5 — 11 ноября 2018)

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

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

---

Медиа

• Подкаст «Веб-стандарты», Выпуск №146: Веб-приложения на десктопе, безопасность и фронтопсы, Test262, Babel и Webpack, вопросы к HolyJS.
• Подкаст «Frontend Weekend» #78 – Антон Черноусов aka golodnyj о становлении менеджера продукта из программиста и подкастинге
• Подкаст «CSSSR» Новости 512 — Выпуск №28 (05.11 — 11.11)
• Подкаст «Пятиминутка React» #49 — bem-react-core
• «Девшахта — подкаст»: #56: NodeConf EU 2018
• Подкаст «Drinkcast», #29 — «Фронтенд по-американски со Степаном Коршаковым»
• «ReactiveConf 2018», 47 видео

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

• Elm изменил мое представление о непопулярных языках
• Руководство по HTML Canvas

• Производительность:
  • A Netflix Web Performance Case Study. Детальная статья от Addy Osmani о том, как удалось улучшить показатель Time-To-Interactive для десктопной версии Netflix.com
  • Повышение производительности анимированных GIF с помощью HTML5 Video
  • Web Performance 101. Детализированное введение в производительность загрузки современного веба от Ивана Акулова
  

• Инструменты:
  • Прокачиваем навыки отладки с помощью инструментов разработчика Chrome (часть 2)
  • npm: полезные сокращения и трюки
  • Зачем я написал 33 расширения для VSCode и как я ими управляю
  • Непрерывная интеграция с помощью Prettier + ESLint
  • FX — CLI-инструмент для обработки JSON
  • Git алиасы, без которых я не могу жить
  

• Accessibility:
  • Актуальность метаданных в доступных PDF
  • Бизнес-кейс для цифровой доступности
  

CSS

• Как я создал меняющую настроения анимацию с помощью масок CSS
• Создание адаптивных изображений
• Советы по CSS, которые вы вряд ли найдете в самоучителях
• Как быстро спроектировать сайт с помощью CSS Grid
• Полезный совет: использование calc() для изменения высоты Hero-компонентов страницы
• Пять лет PostCSS: State of the Union. Андрей Ситник о состоянии дел в его проекте
• CSS фреймворки или CSS Grid: Что я должен использовать для своего проекта?
• Почему браузеры скачивают стили с неподходящими Media Queries
• Оптимизация CSS путем удаления неиспользуемых Media Queries
• CSS и сетевая производительность. Подробная статья Гарри Робертcа
• Лейауты с плитками на гридах с помощью auto-fit и minmax
• Краткий результат анализа и сравнения CSS в Twitter PWA и старого десктопного сайта
• Editorial Layouts, Floats и CSS Grid. Статья о проблемах оформления в стандартных редакторских текстах при невозможности использования float. А также, быстрый ответ Rachel Andrew с решением в виде Exclusions

JavaScript

• Оффлайн брокер на JavaScript
• Работа с абстрактными синтаксическими деревьями JavaScript
• [в закладки] PDF-версия руководства по Node.js и новое руководство по JavaScript
• GraphQL получил собственную независимую площадку
• 10 вещей, которые нужно выучить по пути к становлению мастером JavaScript
• За пределами console.log(). Занимательно, что это не очередная статья, пропагандирующая использование debugger

• ES2015+:
  • Стрелочные функции в JavaScript: зачем они нужны, как с ними обращаться, когда ими стоит пользоваться, а когда — нет
  • Имплементация промисов в JavaScript
  • JSBI — имплементация официального предложения BigInt для ECMAScript на чистом JavaScript, которое в ближайшем будущем станет частью языка
  

• React:
  • Компоненты высшего порядка в React
  • Имплементация плавного скроллинга в React
  • React Suspense c Fetch API
  • Введение в хуки React
  • 5 вещей, которых я не знал о Create React App
  • 3 преимущества функциональных компонентов в React на eCommerce сайтах
  • re: Почему комьюнити React обходит стороной веб-компоненты? Отвечает Ден Абрамов
  

• Angular:
  • Темизация Angular приложений
  • Чеклист чистого кода в Angular ️
  • Почему Angular заставил меня бросить веб-разработку
  • Полное руководство по Angular 6+ Dependency Injection — providedIn vs providers:[ ]
  • Урок по Angular Material Table с примером
  

• VueJS:
  • Создание радиальной диаграммы на Vue и SVG
  • Поправляем виртуальный DOM Vue.js: необходимость, объяснение и решение
  

• Libs & Plugins:
  • Встречайте Loona: библиотеку для управления состоянием приложений в React и Angular
  • Glider.js: очень быстрая, небольшая, полностью адаптивная, с поддержкой мобильных устройств, без зависимостей, библиотека для прокрутки и навигации списков
  

Браузеры

• Вышла новая Opera для Android с функцией блокировки cookie-диалогов
• Chrome 71 будет блокировать всю рекламу на сайтах с обманными элементами
• В Firefox тестируют поддержку сохранения в облачные хранилища
• Обнаружена новая RCE-уязвимость в браузере Edge

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

• Теперь официально. Google подтвердила, что темный режим существенно экономит заряд
• Формат, изменивший мир: история VHS
• GitHub преодолел рубеж в 100 млн репозиториев
• Microsoft добавит в Word функцию, которая будет автоматически создавать списки задач
• Бесконтакт: что такое NFC и как программисту с ним работать
• Самые дорогие стартапы, которые закрылись в 2018 году


Судя по всему, это последний пост в корпоративном блоге Zfort Group. Спасибо что заходили сюда, подписывались и читали наши посты в течении семи лет функционирования блога. Мы продолжим публикации наших дайджестов в том или ином виде. В первую очередь, подборки будут выходить в блоге корпоративного сайта. Также, мы попробуем продолжить наши публикации на хабре с аккаунта alexzfort. Контент дайджестов будет различаться, чтобы избежать его дублирования, новый формат будем пробовать уже на следующей неделе. Всем плодотворной недели!

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