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

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

Производительность:
• Google: поисковый алгоритм Speed Update будет запущен в июле 2018 года, Google Speed Update будет учитывать даже мелкие улучшения скорости загрузки
• Аудит производительности: A глубокое погружение в Firefox Developer Tools
• Улучшаем восприятие производительности: ресайз изображений по запросу
• Оптимизация скорости сайтов с помощью Chrome DevTools. Обновленная статья в блоге разработчиков Google
• Компоненты, зависимые от соединения. Используйте Network Information API для адаптации к разной скорости: img для, video для 4G
• Уменьшение полезной загрузки JavaScript с помощью Tree Shaking

Accessibility:
• stylelint-a11y — плагин для stylelint с правилами a11y
• Доступная карусель с использованием ARIA
• Мощь и опасность WAI-ARIA: подробнее о распознавании голоса

Эффектный веб:
• Generative WorldCup. Эксперимент с API статистики чемпионата мира для генерации абстрактных шаблонов для каждой игры
• Представляем GaspTools от Ueno: a simple tool to make your animations development workflow easier.
• div, который по-разному выглядит во всех браузерах
• Призрачная мышь, следующая за курсором

CSS Grid:
• CSS Grid Level 2: и пришел Subgrid
• CSS Grid в IE: разоблачение основных заблуждений об IE Grid
• CSS Grid в IE: CSS Grid и новый Autoprefixer
• CSS Grid в IE: Эмуляция Auto-Placement Grid с помощью Gaps

React:
• 16 инструментов React, которые пригодятся разработчикам интерфейсов
• Самые распространенные ошибки в вашем React коде, которые вы (возможно) совершаете
• Простое (не менее 99% ES2015) обучающее руководство по React.
• React — это просто JavaScript
• Самые основы React Без NPM. Без Webpack. Без Redux. Изучите основы React, создавая анимированный фрактал прямо в браузерной песочнице
• 5 популярных практик, которые вы можете перестать использовать в React
• Что такое Redux: руководство дизайнера
• react-scrollbar-custom — лучший компонент React для создания кастомного скроллбара

VueJS:
• Vue Test Utils и Jest: как писать простые модульные тесты для фронтенда
• Как использовать роутинг во Vue.js для улучшения пользовательского опыта
• Создание мобильного приложения с помощью Capacitor и Vue.js
• The Vue Handbook: подробное введение во Vue.js
• Vue Authentication и Route Handling с помощью Vue-router
• Лучшие шаблоны для админок на Vue.js в 2018

Angular:
• Angular Developer Roadmap. Проект, цель которого — собрать самые основные / важные концепты, которые должен выучить каждый желающий стать разработчиком Angular
• Веб-компоненты в Angular и AngularJS
• Решения для динамических компонентов в Angular

Libs & Plugins:
• shepherd — библиотека для создания визуального помощника по элементам сайта
• Rete.js — JavaScript фреймворк для визуального программирования
• itty.bitty — инструмент для создания ссылок, содержащих маленькие сайты