Дайджест свежих материалов из мира фронтенда за последнюю неделю №304 (26 февраля — 4 марта 2018)
Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Медиа | Веб-разработка | CSS | Javascript | Браузеры | Занимательное
Медиа
• 
Подкаст «Frontend Weekend» #42 — Андрей Романов о секретах развития frontend-сообщества For Web и карьере в 20 лет
• Подкаст «Фронтенд Юность (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-приложения: Часть ½, Часть 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.
