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

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

Похоже, что Firefox скоро потеряет остатки аудитории и станет нишевым браузером.
10 лет назад Firefox занимал 30% рынка браузеров, а сегодня только 4%. Если посмотреть на динамику, доля Firefox падает почти столь же стремительно, как IE+Edge.

Среди мобильных браузеров всё ещё хуже: мобильный Firefox не добирает даже половины процента, несмотря на поддержку расширений, которые можно использовать, скажем, для блокировки рекламы.

Недавно Mozilla уволила четверть штата, что приведёт лишь к ощутимому замедлению разработки. Скорее всего, команда будет концентрироваться на поддержке безопасности и улучшению приватности, в ущерб новым фичам.

А что дальше? А дальше ждите линейного падения доли Firefox, новой серии увольнений и всплывающего окна: «Данный браузер не поддерживается».
Если только вдруг не случится самое настоящее чудо.

[EN] Как создать утечку памяти в JavaScript?
Вроде просто: нужно создать ссылку, на объект, который затем будет удалён, а ссылка на него — останется.
На самом деле, в современных браузерах не так-то и просто создать утечку памяти: сборщик мусора использует целую серию эвристик для определения неиспользуемых объектов.

Однако один стопроцентный способ всё же есть: нужно создать окно или iframe через JS. Дело в том, что даже если закрыть окна и удалить iframe, в JavaScript останется ссылка на это окно со всем его содержимым. А раз есть ссылка — значит сборщик мусора не удалит содержимое.

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

Как написать свой Virtual DOM.
Все знают, что в Реакте и Vue используется Virtual DOM. Но что это такое на самом деле? Как именно он работает? Почему элементы не перерисовываются полностью, при каждом изменении стейта?
Это руководство ответит на все вопросы.
Если вдруг вам захочется больше — почитайте ещё одно, на этот раз интерактивное руководство Build your own React.

[EN] Некоторые браузеры могут замедлять requestAnimationFrame.
Например, iOS в режиме энергосбережения принудительно снижает количество кадров в секунду до 30.

Safari замедляет requestAnimationFrame для iframe со сторонних доменов. Чаще всего такие iframe встречаются в баннерах, поэтому снижение FPS помогает экономить батарейку устройства без ощутимого влияния на пользовательский опыт.

Firefox в некоторых случаях возвращает неточное значение текущего времени, что может помешать корректному расчёту анимаций. Всё сделано для нашей приватности. Спасибо, Firefox!

requestAnimationFrame делает ровно то, что и должен: просто запрашивает следущий кадр. А вот отдавать кадр или нет — каждый браузер решает по-своему.

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