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

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

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

---

Медиа

• Подкаст «Frontend Weekend» #26 — Владислав Козуля про идеальное собеседование и как избавиться от образа шутника в твиттере
• Подкаст «devschacht»: Ночной фронтенд #9 — Может быть не React?
• Подкаст «Drinkcast», Выпуск #15 — «Юные Бобби»
• Подкаст «Пятиминутка Angular» #5 — Angular 5, CLI 1.4, meetups (NYC, MIX, Moscow), Acronis on Angular
• Подкаст «Фронтенд Юность (18+)» : Первый стрим
• О девушках в программировании и честности. Frontend Юность в гостях у loftblog
• Запись трансляции WSD, прошедшей в эту субботу в Киеве
• «ALL YOUR HTML» #21: «SVG кривые и анимация лого css-live.ru на snap.svg»
• Шоу «Totally Tooling Tips»: Тестирование доступности

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

• Кроссбраузерная вёрстка. Что такое кроссбраузерная вёрстка? Какие есть браузеры и нужен ли пиксель-пёрфект
• Пробел в знаниях основ веб-разработки
• Как рассказать о современной веб-разработке путешественнику во времени из 2007 года
• Новости Node.js: Выпуск серверной JavaScript-платформы Node.js 9.0, Node.js 8 переходит на долгосрочную поддержку, а ветка Node.js 9 становится текущей. Итого, Что же нового в Node.js 9?
• Будущее производительности — бандлинг

• AMP/PWA:
  • service workers в Safari и другие хорошие новости для PWA
  • Дерзкие планы Microsoft по поводу PWA в Windows 10
  • Новый Angular Service Worker  — автоматическое создание  PWA: Часть 1: теория, Часть 2: практика. Полное практическое руководство по Angular Service Worker: caching, push, updates
  • Shadow DOMs: Инкапсуляция в PWA
  • The meaning of AMP. Критическая статья Jeremy Keith о предназначении AMP
  

• Инструменты:
  • Список лучших инструментов для web-анимации
  • Chrome Headless. Запускаем на удаленном сервере с режимом отладки
  • Состоялся релиз SVGO 1.0.0, одного из лучших оптимизаторов SVG
  • Как дебажить фронтенд: Console
  • Новый уровень Webpack Dashboard
  • Дорожная карта разработки VS Code в 2018
  • icongram — сервис для использования популярных иконок на лету
  • Bootstrap 4 Buffet — интерактивный визуальный выбор компонентов Bootstrap 4 для быстрого использования
  • gifski — конвертер видео в высококачественные GIF, базирующийся на pngquant
  

• Анимация:
  • Еженедельная подборка красивых эффектов на CSS/SVG/JS #60
  • Создание анимации на базе JavaScript с помощью библиотеки Anime.js. Часть 2
  • Анимация обрезанных фигур
  • 3D Movie Booking App UI на CSS/HTML
  • Эмуляция плавной CSS анимации средствами JavaScript
  • Прелоадер страницы на CSS в виде Kylo Ren
  

CSS

• Как прятать. Когда display: none, а когда visibility: hidden
• Понимание вьюпорта WebView в iOS 11
• Крис Койер о преимуществе кастомных свойств CSS перед data-атрибутами в разметке
• Flexbox и Grid, ваши лучшие лейаутные друзья
• Подробно о создании отзывчивых доступных таблиц
• CSS in JS: преимущества, недостатки и инструменты
• Продвинутая стилизация форм средствами CSS
• О трудностях преодоления проблем глобального CSS
• Как Sass может сохранить вам кучу времени
• Священная CSS война, или как выйти за рамки догмы
• Как лучше струкрутировать CSS по компонентам
• Как написать TODO приложение на HTML и CSS без использования JavaScript

• Типографика:
  • Типографика и современный CSS
  • MyFonts представила мобильное приложение для распознавания шрифтов
  • CSS font-display: будущее рендера шрифтов в вебе
  • Управление загрузкой шрифтов больше не является проблемой. Zach Leatherman о postcss-foft-classes
  • Веб-типографика: создаем таблицы для того, чтобы их читать, а не рассматривать
  • Тесты размеров вариативных шрифтов
  

JavaScript

• JS: Настройка окружения. Новый бесплатный курс на Hexlet
• Плавильный котел JavaScript.. Перевод статьи Дэна Абрамова «The melting pot of JavaScript»
• Чем хорош (и чем плох) Typescript: опыт UI-разработчиков
• JavaScript, Node, Puppeteer: автоматизация Chrome и веб-скрапинг
• 3+ года Ember, 6 месяцев React
• Лямбда-исчисление с помощью JavaScript. Введение в корни функционального программирования
• Как работает JavaScript: глубокое погружение в WebSockets и HTTP/2 с SSE + как выбрать правильный путь

• ES2015+:
  • Введение в часто используемые особенности ES6. Часть 2
  • Рефакторинг старой и сломанной библиотеки с использованием async/await c TDD
  

• Angular:
  • Выпущено обновление JS-фреймворка Angular 5.0.0
  • Angular v5 вышел, ознакомьтесь с новыми функциями, изменениями и улучшениями
  • 18 советов от keycdn по улучшению производительности Angular
  • Эти 5 статей помогут вам стать экспертом Angular Change Detection
  

• VueJS:
  • Демистификация методов жизненного цикла Vue
  • VueJs: введение в Vuex
  • Интеграция React и Vue компонентов в одном приложении
  • Создание Vue приложения с Nuxt.js и Server-Side рендерингом
  • Создание игры 2048 на Vue.js
  

• React:
  • Правила жизни с Редаксом
  • История React: как покупка Инстаграмма Фейсбуком привела к опенсорсингу React.js
  • Netflix ускорился в два раза, отказавшись от client-side React
  • Шаблоны компонентов React
  • svgr — трансформация SVG в компоненты React
  

• Libs & Plugins:
  • Frappé Charts — простые и современные графики, вдохновленные GitHub, без зависимостей
  • Введение в тепловые карты на Mapbox GL JS
  • handorgel — доступный аккордеон, соответствующий стандартам W3C и написанный на ES6
  • Focusingly — JavaScript библиотека для улучшения стилизации фокуса на элементах
  

Браузеры

• В Firefox 58 появится защита от скрытой идентификации пользователей при помощи Canvas
• Сотрудник Microsoft прямо посреди презентации возможностей Azure установил Chrome, поскольку Edge постоянно зависал
• Google выпустила бета-версию браузера Chrome 63
• Firefox получит инструмент анонимности из Tor Browser
• Преставляем новые оптимизации JavaScript, WebAssembly, SharedArrayBuffer, и Atomics в EdgeHTML 16
• Технические подробности Safari Technology Preview 43
• Статистика операционных систем и браузеров за октябрь 2017 года

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

• Комитет IETF одобрил код 103 ответа HTTP
• GitHub запустил форумы сообщества для объединения разработчиков
• Доступно о машинном обучении: распознавание речи
• Студентам MIT удалось обмануть ИИ Google, заставив думать, что черепаха – это винтовка
• Результаты поиска Google больше не зависят от домена верхнего уровня
• AliExpress наняла инженеров из «Яндекса» для обучения сервисов русскому языку
• Полное руководство по SEO в 2018


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

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