Дайджест свежих материалов из мира фронтенда за последнюю неделю №251 (20 — 26 февраля 2017)

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

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

• Подкаст Веб-стандарты, Выпуск №56: Новинки Chrome, плохой Base64, отладчик WebKit, ES-модули в браузере, Node.js и Webpack, спокойный UI, книга с рыбами, CSS-переменные.
• 2017 — год, который фронтенд разработчики должны посвятить основам
• Записи видео конференции The Rolling Scopes 2017, прошедшей 18 – 19 февраля в Минске
• Тестирование скорости HTTP/2 в реальном мире (WordPress, много картинок и плагинов, тесты с/без H2 с/без CDN)
• Трюк с добавлением заддержки в отладчике для дебага интерактивных элементов, которые сложно отловить
• Подробное введение в Webpack
• Аудит производительности и nytimes.com Идентификация узких мест и всего такого
• Начало работы с VoiceOver & Accessibility
• Панели инструментов, клавиатуры и вьюпорты
• Отрибуты форм в HTML5 (часть 1)
• Чеклист код-ревью
• The HTML5 Robot. Забавный робот подскажет вам правильный тег
• Нужен ли нам новый элемент для заголовков? Мы не знаем (Do we need a new heading element? We don't know)
• Достижение 60 FPS анимации с помощью принципов FLIP (First, Last, Invert, Play)
• flatris — тетрис, написанный на веб-технологиях — архитектура на React/Redux, React Cosmos и PWA с поддержкой оффлайна
• Рисуем и анимируем желейные фигуры с помощью Canvas
• Победитель конкурса по созданию логотипа WebAssembly

CSS

• Ещё больше о том как работает Flexbox — объясняем на больших, красочных GIF’ках
• Трюк: раздельные функции CSS-трансформации
• Два новых первых публичных черновика CSS
• Неожиданная мощь единиц вьюпорта в CSS
• Отзывчивый дизайн за пределами Media Query
• Адаптивные CSS паттерны без медиа-выражений
• Почему я люблю Element Queries и вы тоже должны
• Масштабирование SVG Clipping Paths для использования в CSS
• Вариабельные шрифты
• Начинаем работать с вариабельными шрифтами
• CSS Grid: изучаем новую разметку
• Шпаргалка по выравниванию блоков
• Нюансы CSS Transitionend Events
• Пониимание и применение рекурсии в CSS
• Как использовать CSS анимацию профессионально
• Propeller — очередной фронтенд-фреймворк, основанный на Google's Material Design Standards & Bootstrap
• spacegrid — простая, отзывчивая сетка

JavaScript

• Emoji.prototype.length — рассказ об эмоциональных символах в Юникоде
• Современные приложения на JavaScript с помощью Neutrino
• Зачем изучать функциональное программирование в JavaScript?
• Функциональный JavaScript для ленивых разработчиков (таких, как я)
• Десятиминутное руководство по JS модулям, форматам, загрузчикам и сборщикам.
• Играем массивными мускулами. Возвращение к основам JS
• Анимированное введение в RxJS
• Быстрый совет: сортировка списков пользователей с Flexbox и jQuery
• babel-preset-env: пресет для конфигурации Babel под тебя
• Создание клевых форм с Ember.js
• Какой стек я должен использовать для моего SPA?
• Front-end: Angular против React против Vue
• ES2015+:
  • ECMAScript 2016+ in Firefox
  • Разберись с промисами перед началом использования async/await
  • Даже с async/await, чистые промисы всё ещё являются оптимальными при конкурентных запросах
  • Что нужно знать о типе Number в ES6 JavaScript
  • Что нужно знать про ES6 Maps

• Angular:
  • Основы AngularJS 1.x (часть 2)
  • От angular.module к ngModule

• React:
  • Как React решает, что нужно перерисовать компонент?
  • 10 мини-паттернов в React
  • Как масштабировать Redux приложения с Redux-Action-Recompose
  • boundless.js — компоненты с UI для React-приложений
  • Представление redux-query

• Vue:
  • Управляем состоянием приложения с помощью Vuex
  • A different point of Vue
  • Топ 3 онлайн курсов по Vue.js 2
  • Как работает роутинг во VueJS
  • Vue-geb — Global Event Bus

• Libs & Plugins:
  • Обработка изображений в Javascript
  • ReactiveMaps — набор UI компонентов для карт реального времени
  • React Select — гибко настраиваемый мультиселект с автозаполнением и поддержкой AJAX-а
  • unfetch — минимальный полифил для fetch
  • AR.js — дополненная реальность для Web с использованием ARToolKit — 60fps на мобильном
  • Dwitter — визаулизации в canvas с минимумом кода
  • walletjs — небольшая библиотека для работы со значениями денежных сумм

Браузеры

• В Firefox началось тестирование новых возможностей SnoozeTabs и Pulse
• В Chrome 57 не будет возможности отключить DRM — механизм защиты авторских прав
• Как использовать режим мобильной эмуляции в Chrome
• Браузер Blisk – «мечта каждого веб-разработчика»

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

• AMP-страницы появились в основной выдаче Google.ru
• Инженеры из Google представили глобальную файловую систему Upspin
• Из-за уязвимости сервис Cloudflare месяцами сливал данные клиентов
• Нейросеть «оживляет» рисунки котов. Выглядит жутко
• Самое понятное объяснение принципа работы блокчейна
• Google дал доступ к своему сервису, который замеряет уровень троллинга в комментариях
• Жизнь мема: кто и как зарабатывает на забавных картинках из интернета
• Открытое письмо рекрутерам IT-сферы
• Что такое алгоритмическое искусство: от Моцарта и Райха до «Нейронной обороны»
• «Бороться за глобализацию». Марк Цукерберг рассказал о новом векторе развития своей социальной сети
• Google и Mozilla сообщили, что антивирусы снижают уровень защиты протокола HTTPS
• Как алгоритмы влияют на жизнь
• Билл Гейтс: Роботы должны платить налоги, раз уж они отнимают работу у людей

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

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

Автор: Zfort Group

Источник