#webplatform #Лаборатория_веб_платформы
Как узнать, как часто та или иная HTML-, CSS- или JS-фича используются на сайтах в интернете? Окей, на Can I Use можно узнать, как фичи поддерживаются браузерами. Но как узнать часто ли фичи используются разработчиками?
К примеру, нужно узнать про сайты:
- как часто в стилевых файлах используется
Grid Layout или @import?- много ли где в HTML встречается атрибут
placeholder или required?- насколько в JS-файлах распространён
fetch или ResizeObserver?Собрать статистику во всём интернете сложно, но возможно: есть два решения, которые в тандеме приближаются близко к решению задачи.
Сервис статистики Chrome Stats
Каждый браузер Chrome собирает анонимную статистику. Разработчики Chrome добавляют в код браузера «счётчики» использования фич. Если пользоваль открывает в своём браузере сайт с определённой фичей, то «счётчик» увеличивается. В итоге получается такая статистика: сколько процентов страниц, загруженных через Chrome, было с интересующей фичей (фича встретилась в коде хотя бы один раз).
Посмотреть статистику можно тут. На 1 июня 2021 года:
- по
Grid Layout — стили 9-10% всех загруженных пользователями страниц содержит гриды (источник);- по
@import — в CSS-коде почти 15% всех загруженных страниц используются директива @import (источник);- атрибут
placeholder встретился в HTML-коде 52% сайтов (источник);- атрибут
required появился на 9% сайтов (источник);-
fetch использовался на 38% сайтах (источник);-
ResizeObserver был замечен на 17% загруженных сайтов (источник).В отдельном разделе живёт детальная статистика по использованию в коде CSS-свойств.
Самое клёвое, что есть не только текущая статистика, но и график её «адаптации» на сайтах со временем (период в несколько лет).
Статистика HTTP Archive
«Счётчики» в Chrome Stats анонимные, то есть не показывают конкретные адреса сайтов и абсолютное количество проанализированных страниц. А вот у HTTP Archive, где собирается и анализируется «архив сайтов», есть публичный датасет в сервисе BigQuery. Превью этих данных есть также на самой странице Chrome Stats.
К примеру, в таблице за 1 июня 2021 года сохранено 6435567 десктопных и 7452047 мобильных страниц. По этим страницам собрана информация:
- по тем же «счётчикам», что и в Chrome Stats, только с привязкой к конкретному сайту;
- лог работы движка V8 на странице;
- метрики Web Vitals;
- количество HTML-элементов и доступность страницы;
- картинки и другой медиа-контент на странице;
- использованные сторонние приложения и библиотеки (jQuery, React, Google Analytics…).
Чтобы отобразить эту информацию, нужно знать SQL. В прочем, в HTTP Archive есть и уже готовые отчёты о состоянии веба, которые просто открываются в браузере.