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

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

---

Медиа

• Подкаст «Frontend Weekend» #31 – Дмитрий Чекин о создании CSSSR и особенностях удаленной работы
• Подкаст «Веб-стандарты», выпуск №98 – Декодинг картинок, анимация и авторизация в браузерах, Webpack или Parcel, устаревший GIF и всё, что вы хотели знать про Smashing Magazine.
• Подкаст «devschacht»: Ночной фронтенд #14?—?HolyJS. День 1
• Подкаст «Пятиминутка Angular» #7 — HolyJS, Articles, Angular-RU/Universal/OfflineMoscow, NewHR
• Подкаст «Drinkcast», #20 — «Поймать опенсорсера»
• «ALL YOUR HTML» #26: «SVG и WebGL маски»
• 31 видео с KharkivJS #8 2017
• 3 видео с MinskCSS Meetup #3
• 16 видео с Fronteers Conference 2017

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

• Google анонсировал изменения в сканировании AJAX
• Краткие итоги фронтенд-разработки в 2017
• Делаем оффлайн поддержку для вашего веб-приложения: часть 1 — настройка, часть 2: реализация
• Руководство по подготовке к собеседованию на позицию фронтендера
• Узнайте больше о предупреждениях об уязвимостях
• “Что не так с современным фронтендом”, — доклад Максима Корабельского на ThinkPHP

• Производительность:
  
  • Эволюция «img»: Gif без формата GIF
  • Производительность как восприятие: управление восприятием
  • Средняя скорость загрузки страницы в 2018 – как, что и зачем измерять.
  • Производительность — это преимущество
  

• Инструменты:
  
  • Встречайте Turbo: пакетный менеджер, который в 5 раз быстрее Yarn/NPM и работает в браузере
  • wordpressify — система сборки, созданная для автоматизации процесса разработки на WordPress
  • parceljs — новый быстрый бандлер веб-приложений
  • Webpack: мягкое введение в модульный бандлер
  • Настраиваем webpack для любого проекта
  • Visual Studio Code добавил интеграцию с Avocode для работы с дизайном прямо в редакторе
  

• Accessibility:
  
  • Пересмотр подхода к созданию доступных ссылок
  • 5 основных заблуждений на тему веб-доступности
  • Предоставляем альтернативный контент для пользователей скринридеров
  • Руководства по веб-доступности контента для людей, которые их не читали
  • Автоматизация тестов доступности
  • Создание инклюзивного веба: почему доступность имеет значение
  • HTML5 Accessibility. Ресурс, где можно узнать об актуальном статусе поддержки свойств HTML5 в основных браузерах
  

• Анимация:
  
  • Еженедельная подборка красивых эффектов на CSS/SVG/JS #65
  • Создание анимации на SVG с помощью линий на примере велосипеда с помощью GSAP
  • Mountains Adventure — SVG filters, clip-path & morphing
  • Анимация заполнения страницы в виде пиксельной волны
  

CSS

• <i is=«морж»>
• iota — отзывчивый микро-фреймворк для гридов, использующй кастомные свойства CSS
• Несколько идей для чего можно использовать Grid Layout
• Анимация бордеров
• Как сделать ваш HTML отзывчивым с помощью добавления одной строки кода CSS
• Почему CSS Grid лучше, чем Bootstrap для создания лейаутов
• Понимание CSS переменных
• Календарь на CSS Grid
• Пересмотр вариантов реализации вертикального текста с помощью writing-mode
• Отладка CSS Grid Layouts с помощью Firefox Grid Inspector
• normalize.email.css — CSS reset для шаблонов HTML писем

JavaScript

• Анализ шести веб-фреймворков: плюсы, минусы и особенности выбора
• Как написать безопасное приложение для JavaScript
• Вот что говорили технические люди о дебюте JavaScript в 1995-м
• Итак, вы изучили JavaScript – что теперь?
• Нейронные сети на JavaScript с помощью deeplearn.js
• В будущем JavaScript будет меньше JavaScript
• Как я создал тепловую карту истории моих посещений с JavaScript и Google Maps
• Поиск неуникального элемента в Javascript

• ES2015+:
  
  • Промисы на примерах из жизни
  • await vs return vs return await
  • Как отменить свои промисы
  

• Теория и руководства:
  
  • JavaScript. Ядро: 2-ое издание
  • Разные способы понимания this в JavaScript
  • Руководство фронденд-разработчиков по GraphQL
  • Узнайте об Internationalization API в JavaScript
  • Ответы на каверзные вопросы на собеседованиях по JS
  

• React:
  
  • Анализ производительности React 16 приложений с помощью инструментов разработчика Chrome
  • Как Фейсбук приобрел Инстаграм и почему это привело к открытию исходного кода React.js
  • Redux: шаг за шагом
  • Быстрое введение в React для разработчиков Angular 2/4+
  • Два новых (бесплатных) React курса на 2.5 часов. 1 — Руководство для новичков по ReactJS, 2 — продвинутые компоненты шаблонов React
  • Демистификация подходов к стилизации React
  • Как создать простой блог с помощью React и GraphQL
  • Исправление производительности React на листинг страницах Airbnb
  • mdbootstrap — React Bootstrap с Material
  • jQuery лучше, чем React :)
  

• VueJS:
  
  • Безжаргонное введение в Webpack для пользователей VueJS
  • Что за виртаульный DOM во Vue?
  • Анимация VueJS
  

• Angular:
  
  • 11 библиотек компонентов Angular, которые вы должны знать в 2018
  • Angular 5.1 и другие новинки уже доступны
  • Почему мы выбрали Angular 2, а не React для нашей работы над энтерпрайзом
  

• Libs & Plugins:
  
  • Визуализация динамических волновых графиков с помощью wavesurfer.js
  • npmgraph — инструмент для визуального изучения NPM модулей и зависимостей
  • Animate Plus — библиотека для анимации, сфокусированная на производительности и гибкости разработки
  • Muuri — адаптивная, фильтруемая, сортируемая сетка с поддержкой перетаскивания элементов в стиле masonry
  • country-iso — возвращает код страны по географическим координатам
  • Reshader — настраиваемая микро-библиотека для получения оттенков цветов
  

Браузеры

• Выпуск web-браузера Chrome 63
• Google начала «убивать» приложения Chrome и отключила соответствующий раздел магазина Chrome Web Store на Windows, Mac и Linux
• Что нового в Facebook: все изменения ленты новостей за 2017 год
• Chrome для Windows будет блокировать внедрение кода сторонними приложениями, которое часто приводит к сбоям
• Петиция о скорейшей эвантазии Internet Explorer-а раз и навсегда
• Детали релиза Safari Technology Preview 45

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

• Мастер-класс «Почему Стив Джобс любил шрифты» (Алексей Каптерев)
• Mozilla и Yahoo обменялись судебными исками
• Что влияло на выдачу поисковиков в 2017 году
• Что не так с криптокотиками и чем это кончится
• В NVIDIA создали нейросеть, реалистично подделывающую видео
• Дизайнер изобразила главные мировые события 2017 года на одной картинке
• Что случилось с парнем, который купил пиццу за биткоины
• Лучшие книги о программировании, отобранные по многочисленным комментариям в reddit
?

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

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