Фронтенд дайджест #206 Лучшее за неделю Подкаст [EN] Иссле | FrontoWeek: Недельный дайджест [Фронтовик]

Фронтенд дайджест #206
Лучшее за неделю
Подкаст

[EN] Исследователи из Иллинойсского университета в Чикаго обнаружили, как обычная фавиконка может использоваться для трекинга пользователей. 94% браузеров, при первом открытии URL, кэшируют его favicon в F-Cache. При последующих открытиях, иконка берётся из кэша и повторный запрос не отправляется.

Суть уязвимости:
В режиме записи ключа, для каждого уникального пользователя генерируется такой же уникальный id, который переводится в бинарный вид. С помощью серии редиректов, браузер пользователя прогоняется по каждому URL, отвечающему за свой бит. Ссылки, соответствующие битам пользователя, возвращают фавиконки, которые браузер закэширует в F-Cache. Для остальных ссылок, сервер вернёт 404 и ничего в кэш не попадёт.

Прогоняя пользователя по тем же ссылкам, мы можем точно узнать, какие из них были закэшированы, а какие запрашиваются. А значит мы точно знаем уникальный id в бинарном представлении, несмотря на выключенные куки, режим инкогнито или VPN.

Достаточно всего 32 редиректа, которые выполнятся за 3 секунды, чтобы покрыть всех пользователей интернета. Если интересно — посмотрите репозиторий с демонстрацией уязвимости.

[EN] Кент Доддс — автор курсов по Реакту и его тестированию — рассказал, за что он так любит именно Реакт.
Например, за явное обновление состояния. По сравнению с двунаправленным биндингом данных, как в том же Angular, автор находит подход Реакта более простым, гибким, мощным и поддерживаемым.

JSX позволяет использовать все возможности JavaScript прямо в шаблонах, вместо борьбы с ограничениями кастомного синтаксиса шаблонизатора.

Хуки позволяют легко шарить функциональность между компонентами.

С помощью Реакта можно строить, как большие, так и маленькие проекты. И не только веб, но и мобильные, VR и даже консольные утилиты.

React — самый популярный инструмент в мире (после jQuery, разумеется). А чем больше людей им пользуется, чем больше инструментов они создают, тем больше проблем уже решено за вас и тем проще найти подходящего сотрудника.

[EN] Статья о том, как устроены дефолтные стили и в каком порядке они применяются.
Все стили, накладываемые на элемент, можно разделить на 6 уровней:

Уровень 1 — это дефолтные значения всех CSS-свойств.

Уровень 2 — это стили, которые браузер добавляет конкретным HTML-элементам. Эти стили определяются стандартом W3C, но у браузеров могут быть свои особенности.

Уровень 3 — чтобы уравнять особенности браузеров, придумали нормализацию стилей, например normalize.css. Она переопределяет стили из предыдущего уровня, чтобы элементы выглядели одинаково в разных браузерах.

Уровень 4 — сброс ненужных стилей. Например, reset.css Эрика Мейера приводит элементы к нейтральному виду: убирает отступы у заголовков и списков, проставляет общие свойства для размера текста и высоты строки.

Уровень 5 — сброс любого свойства, используя ключевые слова: inherit, initial, unset, revert.

Уровень 6 — чтобы сбросить все свойства элемента разом, можно использовать свойство all с необходимым значением.

История о том, как Netflix придумали свою систему найма и мотивации сотрудников.
Netflix нанимают исключительно талантливых, высокопроизводительных разработчиков. «Середняки» только снижают интеллектуальный уровень команды и требуют больше внимания руководства. А вот работа в коллективе «звёзд» — это сама по себе уже большая награда для сотрудников.

В Netflix не верят в эффективность премий, основанных на квартальных или годовых KPI. Вместо этого, в зарплату уже включены премии, что позволяет предлагать зарплаты по самой верхней планке рынка.

Сборник из 15 полезных однострочных выражений в JavaScript вызвал бурную реакцию нашего сообщества.
Сами по себе, эти однострочники скорее вредят, чем помогают: например, функция isArray = (arr) => Array.isArray(arr) явно дублирует встроенный метод. Любой опытный разработчик заставит переписывать такой код, если увидит нечто подобное на Code Review.
Почитайте историю драмы, но, пожалуйста, не применяйте эти однострочники в реальной жизни.