Дайджест свежих материалов из мира фронтенда за последнюю неделю №253 (6 — 12 марта 2017)

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

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

CSS

Javascript

Браузеры

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

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

• Подкаст Веб-стандарты, Выпуск №58: Жирненький Firefox 52, история Firefox OS, руководства по гридам, кастомные свойства, прогрессивное улучшение CSS, метрики шрифта, инструменты PWA, верните Гитхаб, собеседование на бумажке.
• Подкаст RadioJS, Выпуск 47: Все полимеры
• W3C обновляет свой рабочий процесс
• Краткое руководство по работе с Web Audio API
• microicon — микросервис с SVG иконками, которые можно использовать в качестве плейсхолдера
• Изучаем новые функции SVG 2
• SVGs в вебе — неудачные моменты
• Должен ли я изучать [вставьте любой новый инструмент]?
• Универсальные веб-компоненты
• AMP и веб
• Мысли об AMP: Accelerated Mobile Project
• Тестирование Service Workers
• Создавай веб расширения, просто потому что ты можешь это
• WebAssembly: под капотом с Mozilla

CSS

• Оптимизация шрифтов. Как получить наименьший размер шрифтовых файлов
• Линтинг HTML с помощью CSS
• CSS Grid Layout:
  
  • Грид + флексбокс: мощнейшее комбо в веб-раскладке
  • CSS Grid Layout и PostCSS: Now Kiss !
  • CSS Grid Layout: новый модуль раскладки для веба
  • Играемся с CSS Grids
  • Eric Meyer: Добро пожаловать в Grid!
  • Коллекция примеров использования Grid Layout на CodePen
  • CSS Grid Layout — шаблон страницы поста в блоге
  
  
• Простой пример использования `vmin`
• Как мы сделали EQCSS & и почему ты тоже должен попробовать создать полифилы
• CSS реминификация: совершенно безумная идея, которая сработала
• Использование CSS Transitions для раскрывающихся блоков
• Можете ли вы центрировать сетку изображений с помощью CSS?
• Исправляем белое свечение для фильтра CSS blur()
• Реализация Facebook Emoji Reactions с помощью CSS
• Интервью с Håkon Wium Lie (создателем CSS) о стилях для печати

JavaScript

• История о том, как мы перевели проект в почти четверть миллиона строк на TypeScript и остались в живых
• Инструменты для JS разработки
• Подробно о скроллинге в вебе в блоге разработчиков Microsoft Edge
• hyperHTML: альтернатива для Virtual DOM
• Теория:
  
  • Какая лучшая книга для изучения JavaScript?
  • Интервью с Kris Borchers, исполнительныи директором JS Foundation
  • Анализ использования устаревших JavaScript-библиотек в интернете
  • Частота известных уязвимостей в библиотеках JavaScript
  • Книга Рефакторинг устаревшего JavaScript кода для использования классов: хороший, плохой, злой
  
  
• Практика:
  
  • Использование Neutrino для быстрого начала разработки на JavaScript
  • Создаем изоморфное/универсальное приложение на Next.JS + Redux
  • Разработка механики игры Bounce от Nokia на JavaScript
  • Пишем модульный JavaScript  — ч.2
  • Шаблон навигации горизонтального скроллинга для тача и мыши с движущимся индикатором активного элемента
  
  
• ES2015+:
  
  • Нативные модули ECMAScript: атрибут nomodule для миграции
  • 80/20 руководство по Async/Await в Node.js
  • Возможности ES6 — десять примеров использования Proxy
  
  
• React:
  
  • Что взять за основу React приложения
  • Упрощаем универсальное/изоморфное приложение на React + Router + Redux + Express
  • Подкаст 5minreact #7 — Preact. Preact — быстрая альтернатива React с таким же API и всего 3kB в gzip
  • Перевод поиска Airbnb на React
  • react2angular — простой способ внедрения React компонентов в приложения Angular 1
  
  
• Vue:
  
  • Vue.js Component Style Guide
  • Эй! Слышали ли вы о Vue.js?
  • Интерактивная инфографика с помощью SVGs & Vue.js
  • How do people React to my point of Vue
  • ПереVue-зировка (An overVue)
  • Коллекция примеров с UI компонентами на Vue.js
  • End-to-End тестирование Vue.js с TestCafe
  • vue-parallax-js
  • vue-recyclist — бесконечная прокрутка
  
  
• Angular:
  
  • Сравнение Angular 2 и React
  • Использование Material компонентов в Angular 2
  • Лучшие десять статей по Angular 2 за последний месяц
  • Эмиттеры событий в Angular
  • Angular Gauge 1.2.0 — настраиваемая директива для создания компонента датчика для Angular JS приложений и панелей управления.
  
  
• Plugins & libs:
  
  • Numscrubber.js — позволяет менять числовые значения в инпутах с помощью перетаскивания мышкой
  • eslint-plugin-compat — проверка поддержки браузерами твоего кода
  • franc — определение текста языка по фрагменту
  • Service Worker Toolchain — коллекция утилит для создания/тестирования/экспериментов с service worker-ами
  • blurify — маленькая библиотека для размытия изображений, поддерживающая CSS режим либо HTML5 Canvas режим (там где CSS недоступен)
  • webpack-blocks — конфигурация webpack с помощью блоков с функциональностью
  
  

Браузеры

• Firefox 52: Представляем Web Assembly, CSS Grid и Grid Inspector
• Релиз Firefox 52. Подробности для разработчиков в блоге Марата Таналина
• Анонс CSS Grid & the Firefox Grid Inspector Tool
• Оценка потребления памяти Firefox в многопроцессном режиме
• Выпуск web-браузера Chrome 57
• Новое в Chrome 57
• Что нового в DevTools (Chrome 58)
• Samsung Internet Beta теперь доступен без регистрации
• Нам нужно поговорить про Opera Mini
• 14 нужных советов по работе с Chrome Dev Tools

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

• AMP станут доступны для ещё 1 млрд пользователей в Азии
• Почему новые условия использования GitHub всколыхнули общественность: разбор ситуации без лишних эмоций
• Новости Google: В Google Photos добавили функцию автоматического баланса белого, Система нейронного перевода Google Translate стала доступна на русском языке, «Капча» Google стала невидимой: компания обновила популярную систему reCAPTCHA, а Технологии машинного обучения Google научились распознавать объекты в видео. Кроме того, Google обновила Hangouts для конкуренции со Slack. Но неразбериха все равно осталась
• «Как думаете, какой запрос самый распространенный?». Глава Google Translate Барак Туровски — о том, как сервис переходит на нейросети
• Помощь учёным, майнинг криптовалют, поиск далёких галактик: как использовать ресурсы «спящего» компьютера
• Как Google Maps определяет загруженность парковок благодаря машинному обучению
• Как оценить часы на разработку
• Тренды вычислительной техники: программируем компьютеры будущего
• Подкаст hexlet, №08. Эпоха возрождения и программирование в каменном веке
• Разработчик создал рейтинг самых упоминаемых книг на Stack Overflow
• Как GitHub влияет на вашу карьеру программиста
• Что такое Windows 10 Cloud и почему она так важна для Microsoft?
• IBM рекордно снизила долю ошибок в компьютерном распознавании речи
• Нейросеть научили предсказывать наводнения по Flickr
• Правила для создания паролей — ерунда

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

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

Let's block ads! (Why?)