Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
•
Подкаст «UnderJS Podcast» #6 — Деоптимизация React внутри V8, preventExtension курильщика
•
Подкаст «CSSSR»: Argumentarium —Хуки, декларативность и классы
•
Подкаст «CSSSR»: Новости 512 — Preact X, Next.js и Create Next App, бунт в GNU и дружба с Китаем
•
Подкаст «Пятиминутка React» — Reatom vs Redux
•
АйТиБорода: Всё про Node.js / От 0 до 2,5к долларов за год / Интервью с Backend JS Developer
•
FrontSpot Show #13: Виталий Бобров про переезд в Польшу и мировом турне с JS докладами.
•
Repozitorro #30 — Выглядит — просто, поэтому заглянем «под капот»
•
Подкаст «Веб-стандарты» №196. Eva Ferreira и Ian Pouncey on chromakey, Argentina, a11y, SEO, HTML, ARIA
•
Подкаст «Веб-стандарты» №197. FrontendConf, Web Components, AOM, ARIA challenges, browser support, dialogs и date pickers
•
Интервью с веб-разработчиком Pornhub
•
Как простой <img> тэг может стать высоким риском для бизнеса?
• Избыточная вариативность во Front-end Stack: суть и причины
• Ссылочные атрибуты nofollow, sponsored и ugc и их влияние на SEO
•
W3C отмечает двадцатипятилетний юбилей
•
Анализ использования HTML на ~8 миллионов страницах (и что это значит для современного SEO)
•
Каскадирование инвалидации кеша
•
Немного практики с элементом HTML Dialog
•
Разница между форматами шрифтов
•
Превратите ваш сайт в PWA
•
Sass MediaScreen — Определяем девайсы на CSS
• Современныи? сброс стилей CSS
• Извлекаем критический CSS
•
Презентация модулей в Sass
•
Sass: модульная система запущена
•
Clipping, Clipping, and More Clipping! Примеры креативного использования свойства clip-path
•
Шаблоны для практического использования пользовательских свойств CSS
•
CSS и окружности
•
Руководство по новым и экспериментальным инструментам для работы с CSS в Firefox DevTools
•
Можно ли нам стилизовать элемент select, пожалуйста ?!
•
Toucaan — переосмысление CSS фреймворков
•
Новый мощный CSS для стилизации маркеров, чисел и маркеров в списках
•
TypeScript. Мощь never
•
12 возможностей ES10 в 12 простых примерах
•
Что лучше выбрать в 2020 году — React или Vue?
• Как работать с localStorage в JavaScript
•
Как определить Ad Blocker
•
Создание приложения распознавания лиц на JavaScript, которое работает как в фильмах
•
Руководство по JavaScript в стиле игры-«рогалика»
•
Соглашения об именовании в JavaScript
•
Chrome полностью заблокирует смешанный контент
•
10 малоизвестных возможностей инструментов разработчика Chrome
• В Firefox добавлена поддержка работы в режиме киоска
• Код Firefox полностью избавлен от XBL
• Google добавила вспомогательные функции для слепых и слабовидящих пользователей в Chrome и Maps
• Chrome Web Store блокировал публикацию обновления uBlock Origin
< Дайджест за прошлую неделю
Материал подготовили dersmoll и alekskorovin
Медиа | Веб-разработка | CSS | JavaScript | Браузеры
Медиа
•

•

•

•

•

•

•

•


•


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

•

• Избыточная вариативность во Front-end Stack: суть и причины
• Ссылочные атрибуты nofollow, sponsored и ugc и их влияние на SEO
•

•

•

•

•

•

- Производительность
•Оптимизация загрузки JavaScript-кода в Wikipedia
•Время до первого байта: что это такое и почему это важно
•[Не] используйте CDN
•Изображения, сделанные правильно: веб-графика, которая хороша до последнего байта
•Рецепты для тестирования производительности SPA в WebPageTest
- Доступность
•Верховный суд присудил победу слепому человеку, который подал в суд на Domino из-за доступности
•Доступность: веб-ссылки должны быть ссылками, а веб-кнопки должны быть кнопками
•Что такое ARIA? Руководство для начинающих по ARIA
- Эффекты
•Подборка креативных сайтов Inspirational Websites Roundup #9
•legendary-cursor — креативный курсор на WebGL
•Создание эффекта водо-искажения с помощью Three.js
CSS
•

• Современныи? сброс стилей CSS
• Извлекаем критический CSS
•

•

•

•

•

•

•

•

•


JavaScript
•

•

•

• Как работать с localStorage в JavaScript
•

•

•

•

- Теория
•Наследование в JavaScript с точки зрения занудного ботаника: Фабрика Конструкторов
•Высокоуровневый await
•Понимание This, Bind, Call и Apply в JavaScript
•Когда использовать Map вместо простого JavaScript-объекта
•JavaScript Promises: От нуля до героя, плюс шпаргалка
•Полное руководство по использованию массивов в JavaScript
•Рассказ о троеточии в Javascript
- React
•Встречайте Create Next App
•Часть 1: вопросы для интервью по React
•Полное руководство по аутентификации в Next.js с Auth0
•Как реализовать Idle Timeout в React
•Использование JSX для вашей собственной легкой декларативной UI библиотеки
- Vue
•10 советов и приемов, которые помогут вам стать лучшим разработчиком на VueJS
•MSK VUE.JS meetup #3 в Mail.ru Group: материалы с митапа
•Создание библиотеки компонентов Vue.js в качестве модуля (часть 1)
•Мгновенный поиск с Vue.js и Axios
•Vue-Next и почему Map решают большую проблему
•Как шарить компоненты Vue между приложениями
•Разделение Vue.js компонентов из Vuex Store
•Управление SVG изображениями в приложениях на Vue.js
•Vue3: Первый взгляд
•Создайте приложение для опросов в реальном времени, используя Vue и Socket.io
- Angular
•Взаимодействие между компонентами Angular с использованием RxJS
•Что под капотом Angular 8?
•Миграция в Angular 8 от TSLint до ESLint
•Отслеживание запросов в Angular приложении с инжекторами дочерних модулей без отложенной загрузки
- Ember
•Ember-engines: что, что нет и почему? — часть 1
•О {{mut}} и двусторонний биндинг
•Промисы и UI состояния в Ember.js
•Ember и GraphQL: быстрый пример
- Libs & Plugins
•roughViz — JS библиотека для создания стилизованных под скетч / нарисованных от руки диаграмм в браузере
•is-website-vulnerable — находит общеизвестные уязвимости в библиотеках JavaScript на сайте
•Как сделать JavaScript локализацию с помощью jQuery.i18n
Браузеры
•

•

• В Firefox добавлена поддержка работы в режиме киоска
• Код Firefox полностью избавлен от XBL
• Google добавила вспомогательные функции для слепых и слабовидящих пользователей в Chrome и Maps
• Chrome Web Store блокировал публикацию обновления uBlock Origin
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
< Дайджест за прошлую неделю
Материал подготовили dersmoll и alekskorovin
LeX_KaR
Спасибо за упоминание :)