Дайджест свежих материалов из мира фронтенда от JSExpert ( 17 февраля — 28 февраля 2019 )
Небольшая подборка с ссылками на интересные материалы из области фронтенда и около него за последних 2 недели ( 17 февраля — 28 февраля 2019)
Java Script
Подробности о JavaScript-объектах
Автор материала, перевод которого мы предлагаем к ознакомлению, говорит, что в JavaScript-объектах содержится много такого, о существовании чего можно и не подозревать, пользуясь ими в повседневной работе. Объекты в JavaScript очень легко создавать, с ними удобно работать, они кажутся понятными и гибкими сущностями, и многие программисты попросту не задумываются о том, что на самом деле устроены объекты не так уж и просто. Из этой статьи вы узнаете о том, что скрыто в глубинах объектов и обсудим тонкости работы с ними.
Как дебажить фронтенд и бекенд: пошаговая инструкция
Представляем вам перевод статьи «How to debug javascript in Chrome quick and easy «. В этом посте вы научитесь дебажить JavaScript на фронт- и бекенде с помощью Chrome DevTools и VS Code.
HTML
Кастомный виджет googleTranslate для сайта
Автор этой статьи предлагает создать кастомный виджет googleTranslate для сайта. В этой статье вы найдёте пошаговую инструкцию как это сделать, а так же объяснения автора, демо и ссылку на репозиторий с проектом на GitHub.
Занимательное
Что можно узнать при разработке аудио плеера для разных браузеров
Наверное, каждый, кто хоть раз в своей жизни писал аудиоплеер для браузеров, сталкивался с проблемой кроссбраузерности и кроссплатформенности. Вот и автор во время работы над новым MVP столкнулся с различными особенностями в отношении проигрывания аудио в браузерах. Автор проливает свет на некоторые подводные камни, с которыми можно столкнутся и поможет разобраться в поиске нужного решения.
Telegram опять раздаёт деньги за разработку простых шаблонов CSS
Павел Дуров объявил о втором конкурсе Template Competition 2.0, всем участникам которого платят по $100 за каждый шаблон HTML/CSS для предпросмотра сайта СМИ в мессенджере. А также $2 за каждую ошибку, найденную в чужом шаблоне (сумма вычитается из гонорара автора). Сделать Instant View для предпросмотра очень легко. Например, победители прошлого конкурса написали по 40 штук. Они получили по 40×100 долларов гонорара (минус штраф за ошибки) и вдобавок разделили главный приз $10 000. Свои кошельки пополнили около 370 других участников! В этом году призы такие же: $10 000 за первое место и $5000 за второе. Сто долларов за каждый шаблон и $2 за найденную ошибку. Общий призовой фонд — $300 000.
Новое в браузерах: Firefox 66 по умолчанию блокирует видео и звук, Chromium ограничивает бюджет страниц
В ближайших версиях Firefox и Chromium могут произойти важные изменения! Во-первых, в Firefox 66 для десктопов по умолчанию заблокируется автоматическое воспроизведение видео и звука на всех страницах. Блог Mozilla Hacks заранее предупреждает об этом разработчиков. Воспроизведение видео и звука разрешается только через HTMLMediaElement API и только после взаимодействия пользователя со страницей (щелчок мыши, нажатие кнопки или прикосновение к тачскрину). В Chromium могут произойти ещё более интересные изменения. При этом разрешено автоматическое воспроизведение видео с заглушённым звуком. Для такого контента нужно для HTMLMediaElement установить атрибут “muted” в значение true. На скриншоте показано, что пользователи могут вручную отключить блокировку звука для отдельных сайтов. В Firefox для Android новая реализация заменит существующий механизм блокировки автоматического воспроизведения. Технически Firefox блокирует вызов play() от HTMLMediaElement.play(), возвращая ошибку NotAllowedError. Так же поступают все браузеры с аналогичной функциональностью. Соответственно, веб-разработчикам не следует предполагать, что вызов play() всегда будет успешен. Чтобы избежать блокировки, рекомендуется два варианта. Первый: запускать воспроизведение контента в связке с обработчиком событий, например, KeyboardEvent на десктопе или touchend под Android. Второй: запустить автовоспроизведение без звука (оно разрешено по умолчанию) и показать пользователю кнопку для включения звука. Финальная версия Firefox 66 запланирована к выходу на 19 марта 2019 года, так что у разработчиков есть время на подготовку. Mozilla сейчас работает над автоматической блокировкой контента Web Audio: её обещают до конца 2019 года.