Дайджест свежих материалов из мира фронтенда за последнюю неделю №277 (21 — 27 августа 2017)

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

Медиа

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

CSS

Javascript

Браузеры

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

Медиа

• Подкаст «Веб-стандарты», Выпуск №82: Safari, Stylo, PWA и Android, Polymer 3.0, читайте Шорты, React или CSS, шрифты, новичкам, RadioJS.
• Подкаст «Пятиминутка Angular» #2: Angular 5 beta 4, CLI 1.4 rc, schematics, ng-content, CodeDojo MEAN
• Подкаст «Frontend Weekend» FW #16: Как проводить BeerJS и ездить на конференции по всему миру
• Подкаст «Пятиминутка React» #32: Webpack 4, Cycle.js, Error Boundaries, StackBlitz, всем Preact, Пятиминутка Angular, npmtrends.com
• Подкаст «RadioJS», Выпуск 49: Alive!
• Подкаст «Фронтенд Юность (18+)», #16: Тайны раскола в разработке Node.js
• Подкаст «devschacht», Выпуск №7: Посмотри мой пулреквест
• Подкаст «devschacht»: Ночной фронтенд — экспериментальный выпуск
• Подкаст «Drinkcast», Выпуск #5: «Фриланс vs офис, о работе и мотивации»
• Хороший плохой манкипатчинг, или Кто такие понифилы? Игорь Алексеенко в HTML Шортах
• «Chrome Extension для показа FPS» — Еженедельный стрим от Юрия Артюха «ALL YOUR HTML» #12
• GitHub Workflow Pro-Tips — свежий выпуск шоу Totally Tooling Tips на канале Google Chrome Developers

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

• Путь верстальщика. Год 2017.
• Релиз html5-boilerplate версии 6.0.0
• Node.js снова форкнут из-за жалоб о безусловном лидерстве
• Что вы знаете о высоте вьюпорта в 2017?
• Формы, готовые к офлайну
• Валидация форм с помощью Web Audio
• Необычная веб-анимация с помощью плагинов GreenSock
• Еженедельная подборка красивых эффектов на CSS/SVG/JS #50
• AMP/PWA:
  
  
  • Прогрессивный путь по созданию вашего прогрессивного веб-приложения на примере cloudfour.com
  • Легкодоступный фрукт PWA: файл манифеста и сервис воркеры
  • Android Oreo откусывает кусочек от PWA
  • MOTOR-TALK.de: наш плавный путь к AMP
• Производительность:
  
  
  • О менеджменте CSS и JS файлов в мире HTTP/2
  • Что такое Time To First Byte (TTFB), почему это значение важно и как его улучшить
  • Производительность — это о людях, а не о метриках. Доклад Tammy Everts с Velocity 2017
• Инструменты:
  
  
  • Превью Polymer 3.0: npm и ES6 модули
  • puppeteer — Headless Chrome Node API
  • Custom Elements Everywhere —  проект, который показывает состояние и совместимость Custom Elements с другими фреймворками
  • Генератор градиентный волн на SVG
  • Aperitif — онлайн-инструмент для построения шаблонов и прототипов на HTML
  
  Становитесь GIT профи, изучив архитектуру GIT за 15 минут
  

Доступность:

• 10 рекомендаций по улучшению доступности веб-страниц
• Что нового в WCAG 2.1
• WordPress плагины для улучшения доступности сайтов
• Как структурировать заголовки для доступности в вебе

CSS

• Проверяем браузер на поддержку определённого свойства CSS
• Простой эксплоит даёт злоумышленникам возможность изменить содержимое письма после отправки
• detect_flex —  Простой и гарантированный метод определения поддержки FLEX и BOX в любых браузерах
• Внутри супербыстрого CSS движка: Quantum CSS (aka Stylo)
• Улучшаем типографику в вебе с помощью CSS Font Size Adjust
• 4 техники CSS, которые будут работать с любым CSS препроцессором или фреймворком
• Итак, вам нужна библиотека утилит в CSS? Размышления Криса Койера
• Создание отзывчивого лейаута с помощью CSS Grid
• Продолжение серии визуальных руководств на @CodePen о CSS Transforms: объяснение системы координат
• Пример использования Sass Maps и циклов

JavaScript

• Исследование и оптимизация производительности Object#toString в ES2015
• Хороший плохой манкипатчинг, или Кто такие понифилы?. Текстовая расшифровка свежего выпуска HTML Шортов
• Реверс-инжиниринг вредоносного мошеннического скрипта
• Новые видео с базового курса по JS от Ильи Климова на канале Javascript.Ninja: «Настройка окружения», «Асинхронность #1. Callbacks — Базовый курс»
• Pretty algorithms —  популярные полезные алгоритмы, написанные на современном и понятном Javascript наряду с примерами использования в реальном мире
• JavaScript поедает мир. Пример пяти огромных компаний, которые перешли на server-side JavaScript
• Как работает JavaScript: внутри движка V8 + 5 советов как писать оптимизированный код
• Мышление на языке JavaScript
• 8 самых популярных JavaScript фреймворков на текущий момент
• Конвертация разговора в текст с помощью JavaScript
• ES2015+:
  
  
  • ES8 представляет функции `async/await`
  • async & await, свежая статья у David Walsh
  • «Async/Await in JavaScript», 47-минутное подробное видео на CodeWorkr
• VueJS:
  
  
  • Миграция VueJS приложения на Vuex
  • Создание викторины на Vue.js
  • Vue.js + Brunch: альтернатива Вебпаку, которую вы ждали
  • 4 AJAX шаблона для приложений на Vue.js
• React:
  
  
  • Все фундаментальные принципы React.js, собранные в одной статье
  • Если вы стартап, не используйте React (оглядываясь на BSD + патентные лицензии)
  • От нуля в Angular до героя React за 3 дня
  • Как вы разделяете компоненты?
  • FermionJS — инструмент визуального прототипирования для приложений React
  • Презентация downshift —  примитива, который нужен вам для создания простых, гибких, WAI-ARIA совместимых (p)React компонентов для autocomplete/typeahead/dropdown/select/combobox/etc. От PayPal
• Angular:
  
  
  • Предзагрузка ngrx/store с помощью Route Guards
  • Создание продвинутых компонентов в Angular
  • Юнит тестирование с помощью Angular и ineeda
  • Angular —  применяем приципы движения к листингу
  • compodoc — Автоматическая документация для ваших проектов на Typescript/Angular
• Libs & Plugins:
  
  
  • Pts.js — позволяет создавать и визуализировать точки в пространствах.
  • JQuery.myData — Небольшой и удобный JQuery&Zepto плагин для двустороннего связывания данных
  • media-player — маленький, адаптивный, интернациональный, доступный, кроссбраузерный медиаплеер на ванильном JavaScript.
  • fuzzysort — быстрая библиотека для реализации fuzzy-поиска
  • fitty — скрипт, меняющий размер шрифта относительно размера родительского элемента так, чтобы текст в него вписывался
  • textics — подсчет текстовой статистики — строки, слова, символы и пробелы

Браузеры

• В Firefox планируют реализовать анонимный сбор статистики о посещаемых сайтах
• Google Chrome получит возможность постоянного отключения звука на сайтах
• Что нового в DevTools в Chrome 61
• Технические детали Safari Technology Preview 38

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

• Google ускорил рендеринг AMP-объявлений
• Google выпустила новую версию Android под названием Oreo
• Ядру Linux исполнилось 26 лет
• Google представила алгоритм, который удаляет водяные знаки. Уже через неделю Shutterstock «сломал» его
• Google представил Chrome Enterprise, вариант Chrome OS для предприятий
• Разработчик vs программист
• Китайский интернет и софт: о наболевшем
• Догнать эволюцию: история шагающих роботов Boston Dynamics
• DDoS: как оружие против войны стало оружием против интернета
• Как блокчейн и искусственный интеллект будут управлять городами
• Бит или не бит: как компьютеры громят людей во все новых играх и что с этим делать
• Шесть мифов о блокчейне и Биткойне, или Почему это не такая уж эффективная технология
• Как Яндекс научил искусственный интеллект понимать смысл документов

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

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