Дайджест свежих материалов из мира фронтенда за последнюю неделю №284 (9 — 15 октября 2017)

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

    Медиа    |    Веб-разработка    |    CSS    |    Javascript    |    Браузеры    |    Занимательное

Медиа

• Подкаст «Frontend Weekend» #23 – Вячеслав Слинько об открытии своей web-студии и руководстве frontend-разработки
• Подкаст «devschacht»: Ночной фронтенд #7 — REST vs GraphQL
• Подкаст «Drinkcast», Выпуск #12: «Автостопом по Галактике с Андреем Ситником»
• «ALL YOUR HTML» #18: «intersectionObserver и SVG анимация маски»
• 25 видео с Front-Trends 2017
• 9 видео с NEJS CONF 2017

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

• Прогрессивная деградация. Как правильно понимать принцип прогрессивного улучшения?
• Релиз HTML5 Boilerplate 6.0
• Использование CodePen может улучшить ваш процесс разработки фронтенда
• Фильтрация изображений с помощью Web Audio API. Эксперименты с массивами аудио и видео контента

• AMP/PWA:
  • Google придумала для формата AMP более простое название
  • Быстрый старт работы над amp-страницами с новыми шаблонами AMP Start
  • 6 мифов о Прогрессивных Веб Приложениях (PWA)

• Tools:
  • Разработчики WordPress сменили Browserify на Webpack для процесса сборки
  • Treo — новый инструмент для аудита сайта, с Lighthouse в облаке, API, интеграцией Github & Slack и кучей настроек
  • Что нового в DevTools (Chrome 63)

• Accessibility:
  • Usability и Accessibility. Новое в WCAG 2.1 и 10 эвристик юзабилити от Якоба Нильсена
  • Практическое руководство по улучшению веб-доступности

• Анимация:
  • Еженедельная подборка красивых эффектов на CSS/SVG/JS #57
  • Пишем более умный код для анимации: GSAP и GSDevTools
  • Слайдер с эффектами искажения жидкости (WebGL + PixiJS и GSAP)

CSS

• Обновление slack.com: редизайн с CSS Grid, оптимизированный под производительность и доступность
• FOIT vs FOUT, интерактивное сравнение от Zach Leatherman
• Как эффективно использовать Warnings и Errors в Sass
• Обзор нового reset от Bootstrap 4: Reboot.css
• Как писать красивый код на Sass
• Эффекты, которые можно применить на изображение с помощью CSS
• 5 наиболее раздражающих штук в CSS. CSS клевый, не так ли?
• Ловушка использования @supports в письмах

• Эксперименты:
  • Пастельные тентакли с помощью CSS переменных от Ana Tudor
  • Connect 4 на чистом CSS
  • Вы можете зайти довольно далеко в создании слайдера только на HTML и CSS
  • Создание галереи изображений на CSS(с фоллбеком)

JavaScript

• Теория:
  • Использование преимуществ TypeScript в JavaScript разработке
  • «Строгий» JavaScript: зачем и кому это надо
  • Понимание асинхронного программирования
  • JavaScript стал лучше, пока я за ним не следил. Небольшая ретроспектива и обзор функций, появившихся за последнее время

• Практика:
  • Challenge: пишем программу на javascript без переменных
  • Имплементация Service Worker для SPA на WordPress
  • Лучшая отладка кода с условными брейкпоинтами
  • Как я (не) использую jQuery

• ES2015+:
  • JavaScript ES8 и переход на async / await
  • Введение в часто используемые особенности ES6. Часть 1
  • Асинхронные стектрейсы: почему await побеждает .then()
  • «Exploring ES2016 and ES2017» онлайн-книга от Dr. Axel Rauschmayer
  • ES6 для начинающих: Промисы
  • Утечки памяти при использовании JavaScript Promise
  • Новейшая версия JavaScript имеет только две новые функции. И вот, как они работают
  • Как вы можете использовать стрелочные функции ES6 для облегчения чтения вашего JavaScript кода
  • Как работает JS: циклы событий и восход асинхронного программирования плюс пять способов улучшения кода с async/await

• VueJS:
  • Релиз Vue 2.5
  • Почему и как мы мигрировали с AngularJS на VueJS
  • Веб-разработка с VueJS чертовски забавна
  • Руководство по Vue.js: от jQuery до Vue.js
  • Offline First Masonry Grid на Vue

• React:
  • React, встроенные функции и производительность
  • Настройка Webpack, Babel и React с нуля
  • Шаблоны React, о которых вы должны знать
  • Ring UI — веб-UI компоненты для React от JetBrains
  • Основы Redux
  • React-Sight — инструмент визуализации для React, с поддержкой Fiber, Router (v4) и Redux

• Angular:
  • Все команды Angular CLI и их назначение
  • Начало работы с Angular
  • Улучшаем производительность с новой опцией updateOn в Angular v5

• Libs & Plugins:
  • Интересные JavaScript библиотеки созданные в Китае
  • Taucharts One — высокопроизводительные графики с временными отрезками
  • ProseMirror 1.0 — движок для создания WYSIWYG редакторов
  • smooth-scrollbar — настраиваемые, расширяемые и производительные полосы прокруток

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

• GitLab получил $20 млн инвестиций в серии C, Мэтт Мулленвег вошел в совет директоров
• Как «Яндекс» создавал «Алису»
• Microsoft признала медленную смерть Windows 10 Mobile
• «ВКонтакте» 11 лет! Вспомним как менялась социальная сеть
• Фейсбук подслушивает вас, чтобы потом подсунуть рекламу. Мифы и легенды о крупнейшей соцсети планеты
• Gutenberg, корабль Тесея
• Microsoft обучит детей и подростков программированию при помощи Minecraft
• Главный специалист Google по облачным технологиям: «Машинам требуется обрести понимание контекста»
• Как Сатья Наделла создал новую Microsoft
• Интервью про стажировку в Facebook: процесс изнутри, советы по подготовке

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

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

Автор: alexzfort

Источник