Вчера вышел Firefox 80. Самые интересные фичи релиза.

Была добавлена поддержка нового синтаксиса export * as ns from 'module' из ES2021 для именованного экспорта всего пространства имен модуля. Включена поддержка операций наложения эффектов друг на друга в Web Animations API: KeyframeEffect.composite и KeyframeEffect.iterationComposite. Атомарные операции в WebAssembly теперь можно использовать с неразделяемой памятью. В WebGL добавлена поддержка расширения KHR_parallel_shader_compile, которое используется для параллельной компиляции шейдеров.

Были улучшены инструменты разработчика. На панели сетевой активности медленные запросы помечаются значком черепахи. Теперь можно блокировать запросы прямо из консоли с помощью команды :block, для разблокирования нужно использовать :unblock. При возникновении исключений стектрейс ошибки можно посмотреть в тултипе проблемного исходного кода.

Из интересного для пользователей. Firefox теперь можно установить как просмотрщик pdf-документов. Была ускорена работа со списком заблокированных аддонов. Улучшение доступности для svg-элементов на страницах и элементов управления браузера.

#firefox #release

https://www.mozilla.org/en-US/firefox/80.0/releasenotes/
https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/80

Крис Фоллин написал статью про новую архитектуру бэкенда Cranelift — "A New Backend for Cranelift, Part 1: Instruction Selection".

Cranelift — это фреймворк для компиляторов, написанный на Rust. По своему дизайну он похож на llvm: фронтенд часть отвечает за преобразование кода в промежуточное представление (IR), бэкенд часть — за компиляцию IR в исполняемый код целевой платформы. Cranelift используется в Firefox для компиляции wasm. Также он используется в качестве компилятора в wasmtime — обособленном рантайме для WebAssembly.

Старая архитектура бэкенда Cranelift была сложна для добавления новых фич. Также нельзя было скомпилировать последовательность из нескольких команд IR в одну команду (отношение "многие к одному"). Новая архитектура решает эти проблемы.

Статья хардкорная. Рекомендую почитать всем, кто интересуется темой разработки компиляторов.

#firefox #internals #wasm

https://cfallin.org/blog/2020/09/18/cranelift-isel-1/

Вчера вышел Firefox 81. В новой версии нет каких-либо больших изменений.

Атрибут sandbox у iframe'ов теперь поддерживает токен allow-downloads. Также у iframe'ов была удалена поддержка нестандартного mozallowfullscreen, вместо него следует использовать allow="fullscreen". Новая версия Firefox начала поддерживать нестандартный HTTP-заголовок Content-Disposition, содержащий имя файла с пробелами без кавычек. Скрипты воркеров с неправильным MIME-типом теперь будут блокироваться в Worker и SharedWorker.

Улучшена доступность элементов video и audio. Их элементы управления остаются доступны, даже если они были визуально временно скрыты. Оставшееся время проигрывания теперь доступно скринридерам.

В инструментах разработчика дебагер отображает TypeScript-файлы соответствующей иконкой. JSON-ответы с XSSI-защитой корректно парсятся и отображаются в виде дерева. Добавлена поддержка остановки выполнения скрипта на первой инструкции. Улучшен инструмент симуляции проблем со зрением.

#firefox #release

https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/81
https://www.mozilla.org/en-US/firefox/81.0/releasenotes/

Маниш Горегаокар — разработчик Servo — написал статью про сложности имплементации свойства font-size — "Font-size: An Unexpectedly Complex CSS Property".

Маниш разрабатывал Stylo — CSS-движок, написанный на Rust, который стал частью Firefox. Одной из его задач было добавление поддержки свойства font-size.

Проблема в том, что на размер шрифта влияют очень много факторов. Размер может быть задан разными юнитами и ключевыми словами. На него влияет выбранное семейство шрифтов, например, font-size: medium в рубленных шрифтах это 16 пикселей, а в моноширинных шрифтах — 13 пикселей. Также Firefox (из коробки) и Chrome (с помощью расширения) позволяют задавать размер шрифта в зависимости от текущего языка текста. Есть свои нюансы для задания размеров шрифта в MathML и при его использовании c аннотациями ruby.

Интересно, что в некоторых случаях разработчики не следуют полностью спецификации, а делают good enough приближение, потому что точно реализовать фичу по спеке бывает очень сложно.

В общем, хорошая статья. Рекомендую почитать всем, кто интересуется внутренней работой браузеров.

#css #internals #firefox #specification

https://manishearth.github.io/blog/2017/08/10/font-size-an-unexpectedly-complex-css-property/

Сегодня зарелизился Firefox 82. В этой версии упор был сделан на скорость работы браузера. Исправлены минорные проблемы с DOM API. Есть немного улучшений в DevTools. По умолчанию включена поддержка Media Session API.

Самое интересное для разработчиков
— В DevTools на вкладке "Network" теперь можно инспектировать server-sent events (SSE); панели "Message" и "Response" были объединены (то есть можно просматривать сообщения web socket'ов и SSE прямо под списком сетевых ответов)
— Диалог выбора цвета стал доступен с клавиатуры на Windows
— Появилась поддержка флага allow-downloads в <iframe sandbox>
— В CSS появилась поддержка псевдоэлемента ::file-selector-button для стилизации кнопки выбора файла
— Псевдоклассы :is() и :where() стали более толерантны к ошибкам — невалидный элемент из списка селекторов больше не делает весь список неавалидным
— Если у тэга <a> есть атрибут download (то есть это ссылка на загрузку файла), он будет перекрывать поведение открытия файла в браузере при установленном HTTP-заголовке Content-Disposition: inline;filename="somefile.jpg"
— Включена поддержка Media Session API. С помощью этого API в системные нотификации можно интегрировать информацию о текущем проигрываемом треке и обрабатыватать события медиа-клавиш на клавиатуре, пультах дистанционного управления и наушниках
— Свойство window.name сбрасывается, если в текущей вкладке загружается другой сайт. Это изменение было сделано для улучшения приватности, но оно может повлиять на фреймворки, которые используют window.name для междоменного обмена сообщениями

Нововведения для пользователей
— Ускорена работа браузера (раскладки на флексах работают на 20% быстрее, сессии восстанавливаются на 17% быстрее, на windows открытие новых окон стало быстрее на 10%).
— В Windows добавлена поддержка аппаратного декодирования видео, оно снижает потребление ресурсов GPU, CPU и положительно сказывается на разряде батареи
— Улучшена работа с режимом Picture-In-Picture

#firefox #release

https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/82
https://www.mozilla.org/en-US/firefox/82.0/releasenotes/

Буквально на днях выйдет новая версия Firefox. В неё попадут изменения с улучшением работы JS-движка SpiderMonkey. Обо всех подробностях рассказал Ян дер Моой в статье "Warp: Improved JS performance in Firefox 83".

В SpiderMonkey используется два уровня компиляции кода: Baseline JIT для быстрой генерации байткода с минимальным количеством оптимизаций и Ion для генерации оптимизированного байткода. Ion в Firefox 83 будет заменён на новый оптимизирующий JIT-компилятор Warp. Warp в отличие от Ion не использует глобально собираемую информацию о типах и использует формат представления байткода CacheIR, которое используется в Baseline JIT.

Благодаря этим изменениям удалось ускорить выполнение JS-кода и уменьшить потребление памяти. Google Docs с Warp работает на 20% быстрее, бенчмарк Speedometer — на 10-12% быстрее. Firefox с Warp потребляет примерно на 8% меньше памяти по сравнению с Ion.

Новая архитектура упростила кодовую базу. Теперь разработчикам SpiderMonkey гораздо проще добавлять новые оптимизации и фичи.

#performance #firefox #internals

https://hacks.mozilla.org/2020/11/warp-improved-js-performance-in-firefox-83/

Сегодня вышел Firefox 83.

В новой версии добавлен режим HTTPS-only (выключен по умолчанию). С включенным HTTPS-only все устанавливаемые соединения будут использовать HTTPS. Если установка безопасного соединения невозможна, будет отображено сообщение об ошибке с возможностью перейти к ресурсу по HTTP. HTTPS-only включается в настройках в разделе "Privacy & Security".

В JS-движок SpiderMonkey добавлен новый оптимизирующий JIT-компилятор Warp. Благодаря ему загрузка страниц ускорилась на 15%, а общее потребление памяти снизилось на 8%. Более подробно о новом JIT-компиляторе можно почитать в предыдущем посте.

В Firefox теперь можно заполнять, сохранять и распечатывать PDF-формы AcroForm с помощью встроенного просмотрщика PDF. Добавили pinch-to-zoom в Windows (для сенсорных дисплеев) и macOS (для тачпадов). Улучшили интерфейс демонстрации экрана.

Для разработчиков не очень много изменений. В CSS была добавлена поддержка конических градиентов conic-gradient(). Свойство :-moz-any() теперь обычный алиас для :is(). В Intl добавлен метод Intl[Symbol.toStringTag], возвращающий строку "[object Intl]". В инспекторе элементов DevTools у DOM-элементов, приводящих к появлению полос прокрутки, теперь отображается бейдж "scroll" (помогает при дебаге двойных скроллов на странице).

#release #firefox

https://www.mozilla.org/en-US/firefox/83.0/releasenotes/
https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/83

Вчера вышел Firefox 84. Релиз в этот раз небольшой, но с полезными улучшениями.

В Firefox 84 появилась нативная поддержка процессоров Apple. Нативная сборка Firefox на процессорах Apple M1 запускается в два раза быстрее, также в нативной сборке гораздо быстрее работает JS.

CSS псевдокласс :not() стал поддерживать сложные селекторы. В Intl.DateTimeFormat() была добавлена поддержка форматирования долей секунд. Была добавлена поддержка Paint Timing API для получения подробной информации о затраченном времени на создание страницы (полезно для анализа и мониторинга производительности).

В инструментах разработчика с помощью инспектора доступности теперь можно узнать, в каком порядке будет переходить фокус при нажатии на клавишу Tab.

Все ресурсы, загружающиеся с локального хоста (127.0.0.1) вне зависимости от url, считаются загруженными в безопасном контексте.

#firefox #release

https://www.mozilla.org/en-US/firefox/84.0/releasenotes/
https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/84

Сегодня вышла новая версия Firefox. Крис Миллс рассказал про основные новинки релиза — "January brings us Firefox 85".

В CSS реализована поддержка :focus-visible. Этот псевдоэлемент позволяет стилизовать кольцо фокуса для тех случаев, когда оно должно быть отображено браузером (например, кольцо фокуса по умолчанию не отображается при клике на кнопку, но появляется при навигации по странице с клавиатуры).

Добавлена поддержка хинта производительности <link rel="preload" ...>. Он позволяет заблаговременно подгрузить ресурсы, которые нужны для отображения текущей страницы.

Полностью удалена поддержка Flash. К этому моменту разработчики шли пять лет.

В ночных сборках Firefox добавлена поддержка top-level await и метода .at() для получения элементов массива/строк с помощью относительных индексов.

#release #firefox

https://hacks.mozilla.org/2021/01/january-brings-us-firefox-85/

В Firefox 85 для всех пользователей включён изолированный кэш для борьбы с супер-куками — "Firefox 85 Cracks Down on Supercookies".

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

В Firefox 85 была включена изоляции для разных видов кэшей: HTTP-кэша, кэша изображений, кэша для favicon, HSTS, OCSP, CSS и т.п. Изоляция может незначительно влиять на производительность — время загрузки сайта для самого наихудшего случая увеличилось на 1.32%.

Firefox стал последним популярным браузером, который реализовал изолированный кэш для ресурсов.

#firefox #cache #performance

https://blog.mozilla.org/security/2021/01/26/supercookie-protections/

Вчера вышел Firefox 86. Крис Миллс рассказал про основные новинки релиза — "A Fabulous February Firefox — 86!"

Появилась поддержка CSS псевдокласса :autofill. С помощью этого псевдокласса можно кастомизировать <input> после его автозаполнения.

Добавлена поддержка конструктора Intl.DisplayNames для консистентного перевода регионов, языков и начертаний.

В бете Firefox появилась поддержка CSS-функции image-set() для создания отзывчивых изображений на уровне CSS.

Стала удобнее отладка iframe'ов в инструментах разработчика — добавлена кнопка, с помощью которой можно выбрать контекст отладки.

#release #firefox

https://hacks.mozilla.org/2021/02/a-fabulous-february-firefox-86/