Дайджест свежих материалов из мира фронтенда за последнюю неделю №325 (30 июля — 5 августа 2018)

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

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

---

Медиа

• Подкаст «Frontend Weekend» #64 – Олег Мохов о том, как комфортно и правильно руководить разработчиками
• Подкаст «Веб-стандарты», Выпуск №132: Подкастинг, новинки браузеров, уязвимость в React и не только, неправильный пайплайн, подгриды готовы, сложная сетка вручную, веб-компоненты
• Подкаст «CSSSR» Новости 512 — Выпуск №17 (30.07 — 05.08)
• Подкаст «Девшахта»: Ночной фронтенд #44 —Как пересадить всех разработчиков в компании на свой велосипед

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

• Тенденция «Bullshit Web»
• Веб — это все еще оружие DARPA
• Frontend News #2: ускоренный курс по clipboard api
• По поводу статуса deprecated для xlink:href в SVG
• Нас атакуют! 23+ лучших практик по безопасности Node.js

• Производительность:
  • Стоимость JavaScript в 2018
  • Динамическая загрузка ресурсов с помощью Network Information API и service workers
  • Как ускорить загрузку вашего сайта с помощью WebP изображений
  • Пять шагов по ускорению нагруженных изображениями сайтов

• PWA:
  • PWA — это просто
  • Создание прогрессивного веб-приложения (PWA): без React, Angular и Vue
  • Что такое PWA и почему это должно вас волновать?

• Accessibility:
  • Вспомогательные карточки с описанием принципов доступности компонентов, часто встречающихся в вебе
  • Sara Soueidan о дизайне и создании доступных переключателей

• Анимация:
  • Pure CSS Moustached Nanny
  • little-big-city — трехмерная сферическая визуализация улиц с помощью ClayGL
  • Вписывание HTML5 видео в фоновый цвет с использованием canvas

CSS

• Методики и инструменты для разработки стилей веб-страниц
• Как мы делали веб-интерфейс для Google Photos: заглядываем под капот
• Двойной щелчок на чистом CSS
• CSS Grid — руководство для начинающих
• Flexbox — анимированное руководство
• StyleURL — онлайн-инструмент, позволяющий экспортировать и делиться изменениями CSS прямо из Chrome DevTools
• Фокус с единицами вьюпорта на мобильных
• Chen Hui Jing о CSS exclusions в ответ на недавнюю статью Ben Frain на ту же тему
• Контролированный скроллинг с помощью CSS Scroll Snap
• Практическое руководство по CSS переменным (кастомным свойствам)

JavaScript

• Пятничный JS: игра в 0 строк JS и CSS
• JS-код, римские цифры, геометрические загадки: как мы шифруем свой возраст
• Реактивность в JavaScript: простой и понятный пример
• Введение в API MutationObserver из JavaScript
• JavaScript ES6: 5 новых абстракций для улучшения вашего кода
• Я создал одно и то же приложение на React и на Vue. И вот какие отличия
• Самые популярные JavaScript репозитории на GitHub за июль 2018
• Закрываем пробел между низкоуровневыми и высокоуровневыми JavaScript библиотеками для построения графиков
• Представление Fusion.js: Универсального веб-фреймворка на базе плагинов (от Uber)
• Строка кода в Javascript, замедлявшая FT.com в десять раз

• VueJS:
  • Освоение Vuex — от нуля до героя
  • Создание интерактивного валидатора паролей
  • Юнит-тестирование Vue-Router
  • Углубленное руководство на VuePress: документация и блог на Vue
  • 5 инструментов для ускорения разработки на Vue.js

• React:
  • [Перевод] 4 способа стилизировать React-компоненты
  • План становления React-разработчиком
  • Имплементация поиска на GraphQL
  • Возможно, вам не нужен MobX или Redux
  • Популярные ошибки линтера для ES6/React
  • React + TypeScript = любовь
  • Интернационализированные приложения на React с помощью библиотеки React-intl

• Angular:
  • Новые возможности Angular 6.1
  • Что нового в WebStorm для Angular
  • Директивы атрибутов и формы в Angular
  • Псевдо-события Angular

• Libs & Plugins:
  • await-of — обертка await для упрощения обработки ошибок без try-catch
  • between.js — легкий движок на JavaScript (ES6) для раскадровки анимации
  • Circular Audio Wave — JS библиотека для визуализации аудио в круговой форме
  • apexcharts.js — библиотека для создания интерактивных JS диаграмм и визуализаций с простым API
  • 7 JS библиотек для чтения мыслей с электроэнцефалографией в 2018

Браузеры

• Амиго всё. Now it’s official
• Firefox легко обходит защиту в новом интерфейсе Gmail
• Против пораженческих настроений в приватности. Почему браузеры всё-таки могут остановить фингерпринтинг
• Технические подробности релиза Firefox 61 в блоге Марата Таналина
• Mozilla решила изменить логотип Firefox и просит пользователей оставить свои отзывы
• Google выпустила официальную версию VR Chrome для платформы Daydream
• Microsoft Edge обзавёлся продвинутой поддержкой технологии Web Authentication
• Баг в браузере Microsoft Edge позволяет похищать локальные файлы

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

• Карьерные решения на примере компьютерных игр начала 2000-х
• ИИ, представься! Зачем и как отличать машину от человека
• Junior, middle и senior разработчики: в чём отличие — отвечают эксперты
• GitHub интегрирует инструмент для запуска Cloud Build от Google
• Обратная совместимость UI
• Рейтинг языков программирования 2018 года от издания IEEE Spectrum
• «Яндекс» запустил бесплатный сервис для создания опросов и сбора анкет
• От чат-ботов к разговорному ИИ: разработка умных ассистентов для бизнеса
• Мобильный интернет вещей ожидает взрывной рост

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

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