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

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

---

Медиа

• Подкаст «Frontend Weekend» #42 – Андрей Романов о секретах развития frontend-сообщества For Web и карьере в 20 лет
• Подкаст «Веб-стандарты», Выпуск №110: Новости для дизайнеров, зачем CSS-переменные, очень опасный CSS, выражения от контейнера, Webpack быстрее на 146%, перезапуск Dart 2.0
• Подкаст «Фронтенд Юность (18+)» #40 Парадигменная вакханалия
• Подкаст «devschacht»: Ночной фронтенд #24?—?JavaScript, которого не было
• Подкаст «Пятиминутка React» #39 — TypeScript 20/80
• Подкаст «Пятиминутка React» #40 — Яндекс Трекер на фоне YouTrack
• Подкаст «Пятиминутка React» #41 — Дэн Абрамов: Beyond React 16
• «ALL YOUR HTML» #38: «Самолётики, кривые, кватернионы»
• Новый проект dev||bet «Python vs. JS — Сколько бы вы могли заработать на покупке Bitcoin с машиной времени?»
• Итоги февральского PiterJS №22
• 39 видео с JSConf.Asia 2018

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

• Улучшат ли ускоренные мобильные страницы ранжирование в Google и как настроить тест AMP
• Новости AMP в заметках Криса Койера
• frontend-case-studies — курируемый список с техническими докладами и статьями об корпоративной фронтенд разработке в реальном мире
• Как я превратился из графического дизайнера в разработчика фронтенда за 5 месяцев
• Теперь нелегально иметь недоступный сайт в Норвегии — и это хорошая новость для всех нас
• O API?—?альтернатива REST API

• Производительность:
  • Google запустил инструмент для сравнения скорости сайта с другими ресурсами
  • Новая обзорная статья от Google об инструментах для работы с веб-производительностью
  • Улучшение производительности страницы с помощью Chrome DevTools
  • Оптимизация производительности React – 12 инструментов и советов
  • Вы определенно захотите оптимизировать загрузку вашего сайта. И вот как это сделать
  • Ленивая загрузка изображений для улучшения производительности с помощью Intersection Observer
  

• Инструменты:
  • История CSSO: Начало, продолжение, завершение, выводы
  • Как добавить линтинг JavaScript в ваш проект с помощью ESLint и Gulp
  • Chrome 65 — что нового в DevTools
  • Что нового в DevTools (Chrome 66)
  

• Эффектный веб:
  • Пунктирные вау-эффекты: о магии простыми словами
  • Еженедельная подборка красивых эффектов на CSS/SVG/JS #72
  • Красный проявитель: иллюзии в вебе часть 1
  

CSS

• 30 секунд CSS
• Использование CSS-grid при проектировании пользовательских интерфейсов
• Селекторы CSS и их применение в автоматизации тестирования Программного Обеспечения
• Google: GoogleBot не может сканировать пользовательские CSS-свойства
• Как использовать вариативные шрифты в реальном мире
• Отзывчивые компоненты: решение проблемы выражений от контейнера
• Сторонний CSS небезопасен
• CSS крадёт ваши данные
• Менее знакомые особенности CSS и продвинутые советы (на самом деле нет)
• Доказательство того, что CSS Grid готовы к продакшену в перспективе
• Использование Sass для контроля области видимости с наименованием BEM

• CSS переменные:
  • Изучение CSS переменных за 5 минут
  • Время переменных. В этой статье я расскажу, как собрал демку с использованием кастомных свойств CSS (они же CSS-переменные) и по ходу проапгрейдил своё мышление в контексте CSS.
  • Отзывчивый вертикальный ритм с помощью пользовательских свойств CSS и CSS Calc
  • Как сделать отзывчивость супер простой с помощью CSS переменных
  

JavaScript

• Случайные числа не случайны. Как создать генератор случайных чисел на JS и предсказать Math.random()
• Полное руководство по JavaScript SEO
• TypeScript?—?JavaScript с суперспособностями
• Пожалуйста, перестаньте использовать console.log() для отладки, он сломан…

• Теория:
  • Вы не знаете JS: Асинхронность и Производительность. Глава 3: Промисы
  • Service Workers. Web Push и где они обитают
  • Как работает JS: сервис-воркеры
  • Как работает JavaScript: механика веб пуш уведомлений
  

• VueJS:
  • Создатель Vue.js отвечает Хабру
  • Создание MEVN-приложения: Часть 1/2, Часть 2/2
  • Начинаем работать с Webpack 4 и VueJs?— руководство для быстрого старта
  • Давайте создадим кастомные Vue Router
  • Создание бессерверной CMS на Vue.js
  • vueds — опенсорсный инструмент для создания стайлгайдов на Vue.js
  • Как создать доступный компонент Autocomplete на Vue.js
  

• React:
  • Разрабатываем игру на SVG + React. Часть 1
  • Создание клона Airbnb с помощью React и ElasticSearch
  • react-morph — простое добавление эффекта морфинга к вашим интерфейсам
  • Редизайн Redux
  • Первый взгляд на Async React + Apollo
  • 9 инструментов React для организации работы над компонентами
  • Структуризация проектов и наименование компонентов в React
  • 8 условных методов рендеринга в React
  • «Быстрый взгляд на React после релиза 16-й версии», — доклад Дена Абрамова на JSConf Iceland 2018
  

• Angular:
  • Реактивные приложения на Angular/NGRX: Часть 1. Введение., Часть 2. Store., Часть 3. Effects.
  • AngularJS: последний релиз
  • Angular InstantSearch — новая библиотека от algolia для работы с интерфейсами поиска в Angular
  • Angular грядёт: подготовка к апгрейду
  • Введение в NGRX Actions 3.0
  

• Libs & Plugins:
  • termtools — Кастомизация терминала с помощью JS
  • Delighters.JS — добавление CSS анимаций при скроллинге страницы
  • flatbush — быстрый статический пространственный индекс для 2D-точек и прямоугольников в JavaScript
  • prompts — интерактивные формы для CLI
  

Браузеры

• Mozilla прекращает поддержку бета-версий в каталоге дополнений для Firefox
• В Firefox 60 может измениться возможность индивидуального управления Cookie
• С 2014 года доля пользователей Chrome, использующих Flash, снизилась с 80% до 8%
• Ваш приватный режим браузера не настолько приватен, как хотелось бы

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

• В Slack добавлена интеграция для бесшовной работы с GitHub
• Microsoft планирует взимать плату за некоторые премиальные шрифты
• Google представила кроссплатформенный фреймворк для разработки пользовательских интерфейсов Flutter
• Google открыла доступ к самой большой базе мировых достопримечательностей Google-Landmarks
• Intel, Microsoft и другие объяснили властям, почему возникли проблемы с исправлением Spectre и Meltdown
• На GitHub обрушилась DDoS-атака мощностью 1,35 Тб/сек, и благодарить за это нужно Memcached
• Два года, которые потрясли Facebook
• В AdBlock добавили функцию кэширования популярных JS-библиотек
• Google выпустила собственную альтернативу Slack
• Билл Гейтс на Reddit AMA: об опасности криптовалют, недоверии к Hyperloop Илона Маска и президентских амбициях (их нет)
• Java EE переименован в Jakarta EE
?

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

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