📰 Вышел Chrome 86. Пит Лепаж и Джеселин Ин рассказали про новинки релиза

▪️ File System Access API доступен по умолчанию. С помощью него можно получить доступ к файловой системе пользователя для упрощения работы с локальными файлами.

▪️ В рамках origin trials стал доступен Web HID, благодаря которому web-приложения могут взаимодействовать с оборудованием пользователя. Также в рамках origin trials стал доступен Multi-screen Window Placement API. Благодаря этому API возможно получить информацию о всех экранах пользователя и программно управлять размещением окон.

▪️ В CSS появилась поддержка псевдокласса :focus-visible, которое позволяет применять для фокуса эвристики, которые использует браузер. Добавлена поддержка псевдоэлемента ::marker для стилизации маркера списка.

▪️ Начался процесс удаления поддержки ftp (будет отключён в Chrome 88). Удалена поддержка API WebComponents v0 во WebView.

▪️ Много изменений в Chrome DevTools. Добавлена новая панель "Media" для упрощения дебага видеоплейеров. Теперь, как и в Firefox, можно сделать скриншот любого узла DOM-дерева с помощью контекстного меню на панели "Elements". Проблемы с third-party cookie на вкладке "Issues" скрываются по умолчанию. Теперь возможно эмулировать недоступность локально установленных шрифтов. Добавлена эмуляции неактивности пользователей (Idle Detection API) и эмуляция опции экономии траффика (медиа-запрос prefers-reduced-data ). Lighthouse обновлён до версии 6.2.

Источники:
Раз, два

#news

В Chrome 86 HTTP-кэш становится изолированным. Что это означает рассказал Еиджи Китамура в статье "Gaining security and privacy by partitioning the cache".

Ранее, если происходила загрузка ресурса, и он оказывался закэшированным другим сайтом, браузер доставал этот ресурс из кэша. Такое поведение браузера влечёт за собой проблемы с приватностью. Например, можно засечь время получения ресурса с какого-либо сайта и по скорости определить, посещал ли пользователь этот сайт. Таким же методом можно проверить, искал ли пользователь определённую фразу в поисковике.

Chrome 86 начал использовать для имени ключа кэша "Network Isolation Key", который состоит из имени сайта и сайта текущего фрейма (если фрейма нет, то будет использоваться имя сайта второй раз). У изолированного кэша есть небольшой недостаток — он может повлиять на метрики производительности сайта.

На данный момент изоляция кэша включена в Chrome и Safari. В Firefox она тоже поддерживается, но выключена по умолчанию (её можно включить с помощью флага privacy.firstparty.isolate в about:config ).

Источник

#usefull

Когда ты пишешь код, важно учитывать ситуации, приводящие к ошибкам. Обработка ошибок — это неотъемлемая часть работы над веб-приложением. Вот некоторые рекомендации по обработке ошибок в JavaScript

#usefull

Тимлид: «Какая у тебя была роль в проекте?»
Я: «Помогал остальным выполнить их задачи»

#fun

Мэт Перри — автор библиотеки Framer Motion — рассказал о том, в каких случаях браузеры могут троттлить requestAnimationFrame — "Browsers may throttle requestAnimationFrame".

Метод requestAnimationFrame (rAF) — самый главный инструмент для создания плавных анимаций, контролируемых js-кодом. Мэт столкнулся с тем, что в Safari на iOS на двух одинаковых смартфонах, одна и та же анимация в одном случае работала в 30fps, а в другом 60fps. Проблема оказалась в том, что Safari включает троттлинг rAF в режиме сохранения энергии. Также Safari троттлит rAF в iframe'ах с контентом сторонних доменов.

Троттлинг rAF есть и в Firefox, но в нём он ограничивается из-за вопросов безопасности. Для отключения троттлинга сайт должен отправлять HTTP-заголовки: Cross-Origin-Opener-Policy: same-origin и Cross-Origin-Embedder-Policy: require-corp.

#usefull

В JavaScript существует 4 способа создать объект:
▪️ Функция-контруктор (constructor function)
▪️ Класс (class)
▪️ Связывание объектов (object linking to other object, OLOO)
▪️ Фабричная функция (factory function)

Какой метод следует использовать? Какой из них является лучшим?
➡️ Ответы в статье

#usefull

Промис (Обещание) — это объект который содержит будущее значение асинхронной операции. Например, если ты запрашиваешь некоторые данные с сервера, промис обещает получить эти данные, которые ты сможешь использовать в будущем.

➡️ Статья описывает три способа понимания промисов

💬 Стало понятнее?

Многие хоть раз задумывались о том, чтобы сделать свою собственную игру. Автор этого видео рассказывает как делают кроссплатформенные игры на языке программирования JavaScript

#usefull

¯\_(ツ)_/¯

#fun

👯‍♂️ «Как убрать дублирующиеся значения из массива в Javascript?» – один из самых популярных поисковых запросов среди junior-разработчиков. Прочитай про самые популярные способы, их плюсы и минусы с примерами в этой статье

#usefull

📺 Разработчики из Microsoft создали серию видеороликов про JavaScript! На английском само собой ¯\_(ツ)_/¯

Вот, что они говорят о своем курсе:
«Хотя мы не охватываем все аспекты JavaScript, мы поможем вам построить основу, на которой вы сможете продолжать расти. К концу этого курса вы сможете работать с учебными пособиями, кратким руководством, книгами и другими ресурсами, продолжая расти самостоятельно.»

#usefull

Нашел интересную статью для обсуждения, про плюсы и минусы разных IT-компаний:

Что думаешь? Согласен с автором?

#usefull

Перевод статьи «Lessons for beginners and junior developers after 11 years of coding», которая собрала больше 50 наград на Reddit

#usefull