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

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

---

Медиа

• Подкаст «Frontend Weekend» FW #30 – Евгений Родионов о том, как из верстальщика стать директором по продуктам
• Подкаст «Веб-стандарты», Выпуск №97: Edge и Chrome, Firefox и веб-компоненты, CSS-волшебники, подкаст, форматы, поддержка
• Подкаст «devschacht»: Ночной фронтенд #13— Дарт, Полимер и велосипеды
• Подкаст «Фронтенд Юность (18+)» #28 React разрывает пуканы
• Подкаст «Drinkcast», #19 — «Пресвятой JavaScript»
• «ALL YOUR HTML» #25: «ALL YOUR HTML, Рисуем фото линиями в 3d, three.js»

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

• Введение в тестирование фронтенда
• Баги на продакшене — грязная дюжина самых популярных
• Как начать работать со статическими сайтами — обзор генераторов
• Чеклист фронтенда — это только инструмент… все зависит от вас
• Лучшие подкасты о веб-дизайне и веб-разработке

• Производительность:
  • Производительность как восприятие: восприятие времени
  • Google не использует метрику TTFB в ранжировании
  • Лучший запрос — это отсутствие запросов. Пересмотр стратегии оптимизации под HTTP/2
  • 23 инструмента для повышения производительности веб-сайтов
  • Советы по оптимизации производительности JavaScript
  • Прогрессивная загрузка изображений с помощью Intersection Observer и SQIP Progressive
  • HTTP/2 PUSH или HTTP Preload
  

• AMP/PWA:
  • Анализ экономического влияния AMP на издателей и e-commerce
  • Разработка для безбраузерного веба (в контексте PWA)
  • Addy Osmani подробно о создании PWA для Pinterest и о существенном повышении производительности в связи с этим
  

• Tools:
  • Как (и зачем) использовать eslint на вашем проекте
  • WebStorm 2017.3: улучшенная поддержка Vue.js, рефакторинг, новый REST клиент и прочее
  

• Accessibility:
  • Что нужно знать о 2018-м: грядущие дедлайны соблюдения стандартов и этапы
  • Сначала доступность: переосмысление того, как мы подходим к дизайну и разработке сайтов
  • Руководство по доступности веб-контента для людей, которые не читали об этом раньше
  • funkify — расширение для Хрома, позволяющее эмулировать многие расстройства зрения, моторики, а также некоторые когнитивные
  

• Анимация:
  • Еженедельная подборка красивых эффектов на CSS/SVG/JS #64
  • Анимация лейаутов с помощью техники FLIP
  • Декоративный фон на WebGL
  • infinitown — WebGL эксперимент с процедурально создаваемым городом
  • GLSL: Voronoi octave
  

CSS

• Учим CSS Grid за 5 минут
• О логике построения типографики и пропорций в V6
• Современная асинхронная загрузка CSS
• Инструменты для инлайнинга CSS, которые пригодятся при создании Email шаблона
• Использование feature queries (@supports) для каскада в веб-разработке
• Как я воссоздал эффект хлопка на Medium, и что я понял из этого эксперимента
• Генерация вайрфреймов с контурами и диагоналями при помощи CSS и HTML
• Гибкий контроль переполнения контейнеров с помощью флексов
• Шрифтастическая производительность веба — доклад Monica Dinculescu на SmashingConf Barcelona 2017, а также небольшое пояснение свойства font-display для доклада

JavaScript

• Как работает JS: особенности и сфера применения WebAssembly
• Создание библиотеки компонентов с использованием Storybook
• Путешествие в Fantasy-land. Егор Трубников-Панов рассказывает о функциональном стиле программирования на JavaScript и спецификации Fantasy-land.
• JSRobot — изучайте JavaScript, играя в игру
• Введение в спекулятивную оптимизацию в V8
• JavaScript хаки для ES6 хипстеров
• Полный справочник по собеседованию Javascript разработчика
• Реализация решета Эратосфена в JavaScript
• MobX vs Redux с React: вопросы и сравнение для новичка
• Участие в ECMAScript: инструкция

• VueJS:
  • Приложение реального времени на Vue.js
  • madewithvuejs — коллекция проектов, сделанных с помощью vue.js
  • Как понять Scoped slots во Vue.js
  • vuetron — инструмент для тестирования и отладки ваших приложений на Vue + Vuex
  

• React:
  • Отладка производительности React с помощью React 16 и Chrome Devtools.
  • Введение в React VR
  • GiraffQL — инструмент для интерактивного погружения в GraphQL, написанный на React
  • Представление React Food Truck — курируемый набор расширений для VS Code
  • reactopt — Инструмент для оптимизации React приложений, идентифицирует определенные события, которые могут вызывать ненужный повторный рендеринг
  

• Angular:
  • Использование нового HTTP клиента в Angular v4
  • telemachy — визуальное подсказки в виде интерактивного тура по сайту для приложений Angular
  • История ngUpgrade: миграция AngularJS приложения с версии 1.6 на Angular 4
  

• Libs & Plugins:
  • Classily.js — небольшой плагин для тогглинга классов: простое решение для не всегда простых задач
  • rapid.js — подобный ORM интерфейс и роутер для API запросов
  • superstruct — простой и компонуемый способ валидации данных в Javascript
  

Браузеры

• В Firefox 58 будет запрещён прямой переход на URL «data:»
• Chrome 63 — что нового в DevTools
• Chrome 64 — что нового в DevTools
• Мобильный браузер Microsoft Edge стал доступен всем пользователям Android и iOS
• Новый и улучшеный инспектор событий и CSS в Microsoft Edge DevTools

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

• Проект Mozilla выпустил открытую систему распознавания речи
• Объяснения по обновлениям алгоритмов Google
• 24 Pull Requests: ежегодное мероприятие GitHub по развитию открытых проектов
• HDMI 2.1: новый стандарт, новый кабель
• Квантовые компьютеры и квантовый интернет сегодня и завтра
• Резкие взлёты и падения популярности технологий на Stack Overflow
• Photoshop будет использовать ИИ для быстрого выделения объектов
• Эрик Шмидт: медицина и наука – основные отрасли, где будет использоваться ИИ в ближайшем будущем
• Власть имиджбордов: Как 4chan стал рассадником насилия
• Scripting Cyrillic. О внедрении кириллицы в Google Docs и Slides
• OWASP Top 10 — 2017 — десять наиболее критичных уязвимостей веб приложений
?

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

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