Дайджест свежих материалов из мира фронтенда за последнюю неделю №329 (27 августа — 2 сентября 2018)

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

FYI: На следующей неделе дайджеста не будет в связи с отпуском.

    Медиа    |    Веб-разработка    |    CSS    |    Javascript    |    Браузеры  

---

Медиа

• Подкаст «Frontend Weekend» #68 – Егор Бугаенко о том, как и почему нужно выделять себя из толпы других программистов
• Подкаст «Веб-стандарты», Выпуск №136: Chrome не такой дерзкий, Firefox против трекеров, опенсорс и политика, OpenType и полезный каскад, развитие React DOM.
• Подкаст «Недельный Vue», выпуск 2
• Подкаст «Пятиминутка React» #45 — Как записать подкаст без микрофона и оборудования
• «Девшахта — подкаст»: #48: Боль от Ext JS и TFS, или как DevOps меняет мир к лучшему
• Подкаст «CSSSR», Новости 512 — Выпуск №19 (20.08 — 02.09)
• Шесть наиболее полезных докладов с Frontend Conf 2018

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

• Непрерывный рост JSON
• Подводные грабли SmartTV разработки
• Почему современный веб — отстой и что с этим делать
• Что блокчейн значит для разработчиков фронтенда?
• Рефакторинг унаследованного кода
• Использование интерфейса синтеза речи из Web Speech API
• Нативная ленивая загрузка для веба

• Инструменты:
  • Что нового в DevTools (Chrome 70)
  • gulp-webpack — свежая сборка Gulp 4 + Webpack 4 + Babel + BrowserSync + Font Awesome 5
  • Universal PWA Builder — расширяемый инструмент для создания прогрессивных веб-приложений без привязки к фреймворку
  

• Accessibility:
  • Семантика речи — отличный пример того, как писать более инклюзивный код для всех (вспомогательных) технологий, среди которых поисковые системы, программы для чтения с экрана, интеллектуальные колонки и чат-боты.
  • Как Google активизировал свои усилия, чтобы сделать свои техники более доступными для инвалидов
  • Как вы можете использовать AI, AR и WebGL шейдеры для помощи слабовидящим
  • Reach UI — библиотека доступных компонентов для приложений на React
  

• Эффектный веб:
  • Применяем мозаику Вороного, пикселизацию и геометрические маски в шейдерах для украшения сайта
  • Web Graphics Experiments
  • Оптическая иллюзия всего в 18 строках JavaScript
  

CSS

• Новые (и старые) единицы измерения в CSS, о которых вы вряд ли слышали
• Продвинутая CSS темизация с помощью кастомных свойств и JavaScript
• Полное CSS демо со свойствами OpenType
• Супер-усиленные Grid-компоненты с помощью кастомных свойств CSS
• Прогрессивное улучшение CSS лейаутов: от Float к Flexbox & Grid
• Как делать стили страниц, дружественных для печати
• «Solving container queries today», — доклад Greg Whitworth на CSS Day 2018
• Прогрессивное раскрытие блоков с помощью CSS
• Редакторы CSS Shape
• Двадцать советов по оптимизации CSS производительности

JavaScript

• Почему человек из мира Java стал горячим сторонником Node.js и JavaScript?
• Что такое тестирование и почему мы должны его делать? Первая статья в серии из пяти частей о тестировании в JavaScript
• Node Hero — руководство по безопасности Node.js
• Состоялся релиз JS-транспайлера Babel 7
• Итак, что нового в Babel 7?
• Что появится в JavaScript 2018: асинхронные генераторы, улучшенный Regex
• JS в примерах: 8 различных вариантов использования JavaScript Array Slice
• aiji — курируемая коллекция вдохновляющих JS-приложений, работающих с AI
• Быстрое введение в веб-воркеры
• Обзор таймеров JavaScript в вебе

• Typescript:
  • TypeScript и Babel 7
  • Быстрое руководство по TypeScript
  • Как моя команда случайно перешла на TypeScript и полюбила его
  

• React:
  • Хорошие практики написания кода с React и Redux
  • Валидация React Component Props с помощью prop-types
  • React Performance – полное руководство по оптимизации основных проблем производительности в React
  • Props и PropTypes в React
  • Урок по React: создание и защита твоего первого приложения
  • Эволюция React
  • code-surfer — React-компонент для прокрутки, увеличения и подсветки сниппетов кода
  • boilerplate.react.spa.full-server — заготовка для создания SPA на React, с полноценным сервером.
  

• VueJS:
  • Вышли в переводе две книги по Vue.js: Величие Vue.js 2 и Тестирование компонентов Vue.js с помощью Jest
  • Освоение Vuex — с нуля до героя
  • Создание приложений на Vue.js
  • vue-goodshare — vue.js компонент для социального шаринга
  • Полное руководство по использованию иконок Font Awesome в приложениях Vue.js
  • tiptap – a renderless rich-text editor для Vue.js
  

• Angular:
  • Angular: неочевидные возможности селекторов директив
  • Механизм биндинга событий в Angular
  • Angular 6 CRUD с нуля, руководство с примером
  • Как использовать Material Design в Angular 6
  

• Libs & Plugins:
  • turbo-json-parse — турбированный JSON.parse для стабильных JSON данных
  • shimport — используйте модули JavaScript во всех браузерах, в том числе с динамическим импортом
  • reworm — простейший способ управлением состоянием приложения
  • lazyestload.js — загрузка изображений только при их попадании в видимую область
  

Браузеры

• В Firefox решено по умолчанию блокировать отслеживание перемещений между сайтами
• Для Firefox развивается система контекстной рекомендации дополнений
• Анализ переносимости API современных web-браузеров
• Компания Mozilla опубликовала статистику по использованию Firefox
• Mozilla опубликовала отчёт о том, как люди используют настольные версии Firefox
• Google мешает защитным решениям осуществлять инжекты в процессы Chrome
• Новая функция мобильного Chrome отключит скрипты при медленных подключениях
• Экологическое влияние разнообразия браузеров


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

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