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

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

Медиа

• Подкаст «Frontend Weekend» #49 – Алексей Куреев про React Native, жизнь в Амстердаме и собеседование в Facebook
• Подкаст «Frontend Weekend» #48 – Вова Барсуков о переезде в Берлин и о том, как перейти из frontend-разработки в консалтинг
• Подкаст «Девшахта», Ночной фронтенд #31: Новая книга Дяди Боба
• Подкаст «Фронтенд Юность (18+)»: From Amsterdam with love: Javascript — основа программирования
• Подкаст «CSSSR», Выпуск 1: Второй пилот новостного подкаста.
• «ALL YOUR HTML» #45: «Полосатые объекты на кривых и шейдерах»
• Moscow SPA Meetup #4, 4 видео
• Render Conf 2018, 15 видео
• JSConf AU 2018cd h, 15 видео

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

• Поисковая оптимизация сайтов, использующих SPA-приложения
• Хочу стать frontend разработчиком: базовые знания и план обучения
• Design Checklist для креативных веб-дизайнеров и упорных фронтенд-разработчиков
• Когда следует игнорировать ‘mobile-first’
• Выбираем отзывчивый фреймворк для верстки писем: MJML vs. Foundation for Emails
• Замена анимированных GIFs на Video
• Создание эффекта панорамирования для SVG
• packagephobia — узнай цену добавления каждой новой зависимости в проект

• Производительность:
  • Mission Critical: оптимизация CSS для CDN
  • <link rel=”prefetch/preload”> в webpack
  • Оптимизация производительности JS: обзор

• Анимация:
  • Еженедельная подборка красивых эффектов на CSS/SVG/JS #76
  • Исследование солнечной системы на CSS
  • Креативный слайдер в научном стиле
  • Погружение в матрицу

CSS

• Фокусы со стилями для фокуса
• Взгляд на единицы вьюпорта в CSS
• Руководство по CSS переменных
• Хей хей `font-display`
• Лучшие практики для CSS Grid Layout
• Почему не использование CSS каскада является проблемой?
• Свайп вьюпорта с помощью CSS Snap Points: создание эффективной мобильной навигации
• 1 HTML элемен + 5 CSS свойств = Магия!
• Создание плавной последовательной анимации с помощью Sass

JavaScript

• Ошибка в JavaScript-классе привела к генерации уязвимых ключей для криптокошельков
• Grasshopper – бесплатное ПО от разработчиков Google, обучающее основам программирования на JavaScript через мини-игры
• Побег из ада async/await
• SvelteJS: Релиз второй версии
• Чего ожидать от Node.js 10
• Проектирование очень больших (JS) приложений
• Как компоненты выиграли “войну фреймворков”. React vs Angular vs Vue: почему это не имеет значения
• Точка зрения: Angular обречен, React OK — вы заслуживаем лучшего

• Руководства:
  • Простое руководство по ES6 итераторам а JavaScript с примерами
  • JS декораторы: что это и когда их использовать
  • Десять функциональностей Lodash которые можно заменить используя ES6
  • Быстрый старт ESLint — ищем ошибки автоматически

• VueJS:
  • Добавление индикаторов загрузки в приложение на Vue.js
  • Создание превью продукта в стили Amazon на Vue.js
  • Создание собственного Vue.js роутера, руководство в четырех частях

• React:
  • 9 советов по улучшению качества кода React-приложений
  • React Lazy Images — компоненты и утилиты для ленивой загрузки изображений в React.
  • Что такое компоненты высшего порядка в React?
  • React SPA с модулями React-Router и React-Transition-Group

• Angular:
  • Angular — Все доклады с ng-conf 2018
  • Универсальный стартовый набор для Angular 6, основанный на @angular/cli с SSR и HMR
  • Введение в роутинг в Angular 5

• Libs & Plugins:
  • PicoJs — нахождение лица в видео
  • Slugify — преобразователь строки (URL, имени файла и т.д.) в строку, разделённую тире
  • Маска для полей ввода для React, Angular, Ember, Vue, и ванильного JavaScript

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

• Релиз web-браузера Chrome 66
• Amazon выпустил свой мобильный браузер
• На GitHub появились новые инструменты для разработчиков open source проектов
• Intel предлагает использовать GPU для защиты от малвари
• Google закрыла возможность использовать свой домен в качестве прокси
• Google замораживает Allo и делает ставку на Chat
• Переводчик Microsoft с ИИ научился работать без Интернета
• Google отключила возможность использовать свою сеть в качестве прокси

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

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