Дайджест свежих материалов из мира фронтенда за последнюю неделю №316 (21 — 27 мая 2018)

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

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

---

Медиа

• Подкаст «Frontend Weekend» #54 – Всеволод Шмыров о том, как из разработчика игр на Flash стать тимлидом в Яндексе
• Подкаст «Веб-стандарты», Выпуск №122: 28 мая 2018: Кроссбраузерный Google, что обсуждал TC39, генерация SVG, новинки и проблемы React, якорь по CSS-селектору, танцующие скелеты, высокоуровневые API.
• Подкаст «devschacht»: Ночной фронтенд #34 — HolyJS 2018 Piter
• Подкаст «Фронтенд Юность (18+)» #49 Другой взгляд на конференции
• Подкаст «CSSSR», Новости 512 — Выпуск №7 (21.05 — 27.05)
• «ALL YOUR HTML» #50: «Простой generative art на 2d canvas»
• MinskJS Meetup #4 — 24 мая 2018
• React Finland 2018

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

• Mobile-first indexing — революция в поиске от Google
• Исследование: влияют ли ссылки nofollow на ранжирование в Google? Корреляция и анализ данных.
• Learning Gutenberg. Серия статей на css-tricks, посвященная изучению Gutenberg, новому редактору в Wordpress (React-driven SPA)
• Работа с динамическими кривыми Безье
• Техники редактирования текста, о которых должен знать каждый разработчик фронтенда
• Web Push Notifications. Руководство и техническое демо от команды Microsoft Edge
• Wired Elements — набор UI компонентов выглядящих как скетчи

• Производительность:
  • Ускорение загрузки шрифтов на сайте
  • Состояния веба: лучшие стратегии по оптимизации изображений
  • Как использовать Lazy Loading в контексте времени загрузки Slash Page
  • Делаем легаси сайты более производительными с помощью современных техник фронтенд производительности
  

• Tools:
  • 10 трюков Firefox Dev Tools, которые могут поразить вас
  • Выбираем победителя битвы между ESLint и Prettier
  • Что нового в DevTools (Chrome 68)
  • Каким инструментом тестировать доступность?
  

• Анимация:
  • Grid Layout, совмещенный с эффектами смещения при наведении и возможностью предпросмотра контента
  • Воссоздание анимации из MS fluent design — наведение, затрагивающее целую группу элементов
  • segmented-type — необычная сегментированная типографика на SVG
  

CSS

• Display: contents — не CSS-сброс
• eqio — простая, компактная альтернатива выражениям от элемента/контейнера
• Объяснение Z-Index: как складывать элементы с помощью CSS
• Темная тема за день. Использование набора современных возможностей CSS для создания ночного режима для приложения
• Начинаем работать с CSS Layout. Подробная статья от Rachel Andrew
• Правильный способ стилизации кнопок

JavaScript

• Классические алгоритмы и структуры данных на JavaScript
• Новшества Node.js 10 в области разработки и безопасности
• Практика применения прокси-объектов в JavaScript
• Символы, генераторы, async/await и асинхронные итераторы в JavaScript: их сущность, взаимосвязь и варианты использования

• VueJS:
  • Создание и публикация веб-компонентов при помощи Vue CLI 3
  • Почему VueX — это лучший интерфейс между фронтендом и API
  • Vue.js — соображения и трюки
  • Привет Protovue — фреймворк прототипирования компонентов для Vue.js
  • Vuido — создание десктопных приложений для Windows, OS X и Linux с помощью Vue.js.
  

• React:
  • React v16.4.0: События указателей
  • CI и развертывание React приложений
  • Всё о React: Откройте для себя все, начиная от основ и заканчивая новейшими решениями React — React-Render Props, Context API, Suspense, CSS-in-JS, прогрессивными веб-приложениями, библиотеками пользовательского интерфейса и т.д.
  • Flow vs TypeScript в React — мои две копейки
  • Что React Context API может для вам сделать?? Multi-language text, Modals и переключатели тем
  • RSUITE — набор React компонентов
  • Продвинутая визуализация с помощью react-vis
  

• Angular:
  • Определение изменений в Angular Ivy: вы готовы?
  • Понимание provider scope в Angular
  • Использование Angular Augury для отладки вашего кода
  • Ускоряем процесс разработки с помощью Angular 5 сниппетов и VS Code
  • Реактивное программирование в Angular: о пуш нотификациях
  

• Libs & Plugins:
  • nanoJS — минимальная JS библиотека без зависимостей для манипуляций с DOM
  • hybrids — UI библиотека для создания веб-компонентов с простым и функциональным API
  • Hyphenopoly — полифил для клиентской расставки переносов в тексте
  

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

• GDPR. Практические советы
• Истерия вокруг GDPR, часть 2. Полезные советы
• Adobe купит одну из самых популярных в мире систем для управления интернет-магазинами Magento за $1,68 млрд
• Как потерять друзей и заставить всех себя ненавидеть, делая код-ревью
• Каким станет будущее — 7 предсказаний журнала Wired
• Facebook открыла исходный код библиотеки для балансировки нагрузки на сеть
• Pornhub запустил бесплатный и безлимитный сервис VPNhub
• Ученые представили новую технику, позволяющую размещать скрытую информацию в символах шрифта


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

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