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

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

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

• Favicon сегодня: форматы, поддержка, автоматизация
• Будущее MDN — фокус на Web Docs
• Подкаст «Frontend Weekend» FW #6 — Организатор MoscowJS про зарплаты, DevConf и WWDC
• Зачем нужны заголовки — HTML Шорты
• Записи докладов с потока Frontend на Codefest 2017
• Чеклист для запуска сайта
• Большой список советов по работе с Progressive Web Apps
• Подробное введение в веб-компоненты с теорией и примерами. И выдрами.
• SVGI — CLI инструмент для инспектирования контента SVG файлов
• JPG, PNG и SVG в вебе: руководство для новичков
• World Wide Web, небогатый западный веб (часть 1). Bruce Lawson о нюансах использования интернета в Азии и Африке
• Креативные идеи эффектного интерактива для букв в заголовках
• WebAssembly 101: первые шаги разработчиков
• Производительность:
  • Индекс скорости – что это такое?
  • Как 17 строчек кода улучшили загрузку Shopify.com на 50%
  • Оптимизация изображений: основные ошибки и решения
  • Мрачные мысли по поводу AMP
  • Как создавать страницы AMP в wordpress

• Доступность:
  • Принципы доступности. Как люди с ограниченными возможностями используют веб. Обновленная официальная документация W3C WAI
  • Чеклист доступности: 10 критических элементов для оценки доступности сайта
  • Аудит доступности — это забавно
  • Как сделать сайт доступным для людей, пользующихся Screen Magnifier
  • Как работать с доступностью цвета

CSS

• Парадоксы display:contents и будущее текста в CSS
• Как работает функция minmax()
• Советы по написанию современного CSS
• «Цена пропущенного фрейма». Доклад на производительной анимации от Дмитрия Шуранова
• Текстовая визуализация Template Areas в CSS Grid
• Локальные CSS переменные: что, как и зачем
• Awesome CSS in JS: коллекция полезных ссылок на тему техник CSS in JS
• 70% повторений в таблицах стилей: информация о том, как мы фейлим оптимизацию CSS
• CSS Shapes, clipping и masking – и как их использовать
• Masking vs. Clipping: когда их использовать
• Равносторонний треугольник идеального параграфа. Если хочется поиграться со шрифтами
• OOCSS – будущее написания
• CSS в качестве инструмента тестирования / проверки доступности
• Как долго нужно работать с css, чтобы быть в нем хорошим? Обсуждение на reddit/r/css
• Забавы с единицами вьюпорта

JavaScript

• Нативные EcmaScript модули: новые возможности и отличия от webpack
• От «нового числового формата» до «кода как UI»: как прошла HolyJS 2017 Piter
• Частичное применение функций
• Что Google AMP означает для JavaScript сообщества
• Функции высшего порядка в Lodash
• Обязательно изучите функциональное программирование в 2017 году
• Как выглядит современный веб без JavaScript
• util.promisify() для замены колбэков на промисы
• Внушительный список современного JavaScript инструментария
• ES.next: object rest и свойства распространения
• Рассматриваем ES2017 декораторы в JavaScript
• Коллбэки в JavaScript
• Классы, сложность, и функциональное программирование
• Сравнение Flow и TypeScript
• JavaScript: что такое немедленно вызываемые функции?
• Функциональные миксины
• Как получить максимальную отдачу от консоли JavaScript
• Апгрейдим Node 6 до Node 8: сравнение производительности в реальном мире
• Angular:
  • Полное руководство по Angular Material Themes
  • Angular 2 vs React: очередное сравнение
  • Angular2: советы и хитрости разработки

• React:
  • Подкаст «Пятиминутка React» #21 — Список пожеланий на следующие 6 месяцев разработки React
  • Пример приложения задачника на React-е с объяснением
  • Начало работы с PreactJS  —  пошаговое руководство

• VueJS:
  • Типизированные компоненты в Vue.js, или как подружить Vue, TypeScript и Webpack
  • Введение в серверный рендеринг приложений Vue.js с помощью Nuxt
  • Создание приложения для поиска учебников на Vue
  • Впечатления от VueJs & ReactJS. Что думают люди…
  • Может ли Vue бороться за трон с React?

• Libs & Plugins:
  • synt — находит похожие функции и классы в JavaScript/TypeScript коде
  • flubber — инструмент для плавной анимации между 2-D фигурами
  • getlibs — Встроенный загрузчик модулей, настроенный на получение внешних зависимостей непосредственно от CDN. Включает babel/typescript
  • billboard.js — леграя интерфейсная JavaScript библиотека для графиков, основанная на D3 v4+

Браузеры

• Выпуск web-браузера Tor Browser 7.0
• Выпуск web-браузера Chrome 59, видео от Google Chrome Developers
• Safari в iOS 11 предложит автоматический запуск режима чтения без рекламы для всех сайтов
• Apple запретит автозапуск аудио и видео в Safari
• Браузер от Samsung появился в Google Play
• Новые функции Microsoft Edge: поддержка CSS object-fit/object-position, position: sticky, улучшенная консоль и многое другое
• Стал доступен Safari Technology Preview 32, с WebRTC, WebAssembly и улучшениями Auto-Play
• Кроссбраузерные расширения теперь доступны в Firefox

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

• Главные анонсы WWDC 2017
• WWDC 2017 за 14 минут на русском
• Microsoft внедрила большое количество новшеств в новой тестовой сборке Windows 10
• Вышел WordPress 4.8 с новыми виджетами и другими улучшениями панели администратора
• Cisco: К 2021 году мировой объем дата-трафика превысит три зеттабайта, а на долю приложений IoT придется больше половины устройств и соединений
• Материнский холдинг Google продал производителя роботов Boston Dynamics японскому SoftBank
• Несдержанное обещание статической типизации
• 12 принципов применения анимации в пользовательских интерфейсах
• 5 «человечных» ботов Microsoft
• Сколько ждать квантового превосходства?
• В MIT разработали девайс, который считывает эмоции с помощью Wi-Fi

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

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

Автор: Zfort Group

Источник