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

Медиа

• Подкаст «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 отключит скрипты при медленных подключениях
• Экологическое влияние разнообразия браузеров

До новых встреч!