Дайджест свежих материалов из мира фронтенда за последнюю неделю №289 (13 — 19 ноября 2017)
Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Медиа | Веб-разработка | CSS | Javascript | Браузеры | Занимательное
Медиа
• 
Подкаст «devschacht»: Ночной фронтенд #11 — Как не утонуть в пул-реквестах
• Подкаст «Фронтенд Юность (18+)» #27 Почему Дэн Абрамов не пользуется Firefox
• Подкаст «Drinkcast», Выпуск #17 — «Как выйти из вима?»
• 
«ALL YOUR HTML» #23: «Лендинг с полноэкранным скроллом и анимациями на PubSub»
• CSSSR Conf 2017
• NodeConfEU 2017, 29 видео
Веб-разработка
• Все основные браузеры теперь поддерживают WebAssembly
• Синхронное обновление: Редактор кода Atom получил функцию для параллельного программирования Teletype, а Microsoft представила технологию для парного программирования Live Share
• 
В W3C опубликовали стратегические планы развития: Web Assembly, WebRTC, Web Payments, WebVR и многое другое
• Первый взгляд на Polymer 3.0
• Как использовать SVG в качестве плейсхолдера, а также о других техниках загрузки изображений
• Полное руководство по пуленепробиваемым кнопкам в рассылочных письмах
- Производительность:
•Метрики загрузки страницы. Что все они означают?
•О минификации SVG и Gzip. Как использовать компрессоры наиболее оптимальным способом
•120fps — новая планка производительности на 2018
•Почему вам следует отдать приоритет PageSpeed при обсуждении нового сайта с клиентом
•Как оптимизировать критический путь рендеринга в WordPress
•8 менее известных (но полезных) плагинов для повышения производительности в WordPress
- Accessibility:
•Масштабирование текста больше не актуально? О требованиях к размеру текста и доступности, основанных на старых мифах и новых критериях WCAG 2.1
•Инклюзивный чеклист по веб-дизайну
•Как правильно отключать ссылки?
•ADA Website Compliance: Руководство для новичков
•Доступные веб-приложения с помощью React, TypeScript и AllyJS
•Насколько ваш сайт доступен для людей с ограниченными возможностями? Рассмотрите возможность проведения аудита, чтобы узнать
- Анимация:
• Еженедельная подборка красивых эффектов на CSS/SVG/JS #62
•Анимированный слайдер с креативными рамками на SVG
•Стильная велосипедная анимация с помощью gsap svg stroke
•Секвенсор сканирования Javascript. Используя камеру, создавайте музыку в реальном времени своими движениями. Написано с использованием p5js и tonejs
CSS
• Применение медиавыражений для пропорций окна браузера
• «Запашки» CSS-кода
• Эрик Мейер о снижении сложности CSS
• После многих лет неактивности, Эрик Мейер обновил свой таймлайн CSS модулей
• Как использовать CSS градиенты в вебе
• Переменные окружения в CSS; как бороться с программной рамкой в iPhone X
• Берем скролл под свой контроль: кастомизация pull-to-refresh и overflow эффекты
• CSS трюки, которые могут принести революцию в ваши лейауты
• Мониторинг неиспользуемого CSS с помощью мощностей протокола DevTools
• Начинаем разбираться с математическими функциями в CSS Level 4
• Соотношение сторон для элементов гридов
• Использование CSS Grid: поддержка браузеров без гридов
JavaScript
• 
JavaScript: путь к ясности кода
• Draft.js — фреймворк для создания текстовых редакторов от Facebook. Русскоязычное руководство
• Генерация HTTP-запросов. Fetch или Axios.js
• Паттерны проектирования JavaScript на 2017 год. Перевод доклада Скотта Аллена
• GraphQL — API по-новому. Доклад Владимира Цукура на JavaDay UA 2017
• Бюджет JavaScript (стоимость доставки и производительности). Эдди Османи делится рецептами быстрой загрузки JS: меньше кода = меньше парсить/компилить + меньше передавать + меньше данных для декомпрессии
• Неплохая подборка шпаргалок и справочных руководств для JavaScript
• Символы, Генераторы и потоки в JavaScript
• Обзорная лекция по основным возможностям ES2017+, от Дмитрия Сошникова
• Начни использование Babel 7 Beta уже сегодня!
• Vue Konva: JavaScript библиотека для рисования сложной канвас графики с помощью Vue
• Разработка расширения для Google Chrome с использованием Angular 4
React:
•Как работает Redux на примере создания счетчика
•Стартовый набор разработки WordPress + React Starter Kit от Postlight
•Хотите узнать больше о React? Давайте создадим игру и сыграем в нее
•Чистый код vs. грязный код: лучшие практики React
•Все, что вы должны знать о React: основы, которые вам нужны для начала разработки
•Быстрое руководство по Webpack бандлу и разделении кода в React
•Миграция приложений с Angular 1.x на React — гибридный путь
- Libs & Plugins:
•
Luxon — современная и мощная обёртка для работы с временем и датами
•ECharts — мощная библиотека визуализации от baidu для рисования диаграмм в Canvas.
•react-scroll-to — помогает скроллить к указанным частям страницы в React
•Релиз remoteStorage.js 1.0.0 (для синхронизации локальных данных)
Браузеры
• 
Выпуск Firefox 57 с многопоточным CSS-движком и новым оформлением. Детали для разработчиков от Марата Таналина
• Вход в эру Quantum — как Firefox стал опять быстрым и когда он будет еще быстрее
• Супер-стабильный опыт WebVR благодаря Firefox Quantum
• Действительно ли Firefox Quantum хорош? (Спойлер: да)
• Firefox будет блокировать все ссылки вида data: URI
• Google готов раскошелиться, чтобы вернуть свой поисковик в Firefox
• Google удалила китайский UC Browser из магазина приложений для Android
• Детали релиза Safari Technology Preview 44
Занимательное
• Вышел WordPress 4.9 с крупными улучшениями кастомайзера, обновленным редактором кода, а также новым виджетом для галерей
• Google начнёт требовать соответствия контента AMP и канонических страниц
• Видео дня: робот Boston Dynamics Atlas делает обратное сальто
• Специалисты Google назвали фишинг самым опасным видом атак
• Тим Бернерс-Ли о будущем интернета: «Система проваливается»
• ПО Google TensorFlow Lite позволит запускать алгоритмы ИИ на обычных смартфонах
• GitHub внедрит инструмент GVFS от Microsoft для поддержки объёмных проектов
• IEEE объявил о введении 3 стандартов ИИ, обеспечивающих благополучие человечества в эпоху роботов
• Не такой, как все: чем Snapchat отличается от других стартапов Кремниевой долины, и поможет ли это ему выжить
• Оптические эффекты в пользовательских интерфейсов (для настоящих ботанов)
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
