- PVSM.RU - https://www.pvsm.ru -
Вы когда-нибудь задумывались над такими вопросами:
А я вот задумался.
И не просто задумался, а сделал маааленькое исследование.
И написал маленькое расширение для хрома, которое, возможно, сделает жизнь лучше или сломает интернеты.
Результаты внутри.
Я вот призадумался — почему браузеры не добавляют популярные js-библиотеки в свои дистрибутивы? Ведь CDN [4] — это очень хорошо, один урл для ресурса, кеширование, все дела. Но ещё лучше вообще не загружать статические файлы, а иметь их сразу в браузере.
Как ответ на несправедливость судьбы был изготовлен сей образец расширениестроения [5], который призван ускорять интернеты.
Но нельзя же просто выдвинув пару гипотез и «запилив» прототип успокоиться и почивать на лаврах:
Итак, есть несколько идей:
Эти идеи требовали подтверждения. А в ходе реализации расширения я столкнулся с дополнительными вопросами:
Изначально я хотел использовать Common Crawl [7] корпус. Но в виду того, что этот зверь весит 81 Тб, и учитывая количество времени и денег, которое придётся потратить на его анализ, зверь был оставлен в покое.
Чуть позже я наткнулся на замечательную статью [8], в которой автор исследовал интернеты как раз по той теме, которая была мне нужна.
Проблема была в том, что нужных ответов в статье я не нашёл, но нашёл нужные инструменты!
Для нужным мне ответов я использовал датасет httparchive [9]. Это набор данных краулера, опращивающего сайты из TOP 300 000 сервиса Alexa [10]. Т.е. можно сказать, что это огромная куча самых популярных сайтов интернета.
Я скачал себе самый свежий датасет — результаты опроса сайтов за 1 марта 2014 года.
Ниже я приведу результаты исследования и запросы, которые я использовал для их получения.
Вы можете сравнить мои результаты с результатами, полученными годом ранее [8].
SELECT "jquery" AS name,
count(distinct(pageid)) AS count,
(100*count(distinct(pageid))/290835) AS percent
FROM requests WHERE pageid <= 14802750 AND pageid >= 14489007
AND url LIKE "%//ajax.googleapis.com/ajax/libs/jquery/%"
Имя | Количество | % |
---|---|---|
jquery | 59977 | 20.6223 |
Каждый год количество сайтов, которые используют различные CDN-решения для подключения jQuery, растёт. Это означает, что прогресс не стоит на месте и люди осознают всю крутость такого решения.
В данном случае я модифицировал оригинальный запрос. Моя цель — изучить долю каждой версии jQuery в общем количестве сайтов, которые вообще подключают jQuery. В статьях других авторов есть мааааленькие проблемы, влияющие на наглядность результата:
select SUBSTRING(
url FROM POSITION("/libs/jquery/" IN url) + 13
FOR
LOCATE("/jquery", url, POSITION("/libs/jquery/" IN url) + 13) - (POSITION("/libs/jquery/" IN url) + 13)
) as version,
count(distinct(pageid)) as count,
(100*count(distinct(pageid))/59977) as percent
from requests where pageid >= 14489007 and pageid <= 14802750
and url LIKE "%//ajax.googleapis.com/ajax/libs/jquery/%.min.js"
group by version order by count desc;
Версия | Число включений | % |
---|---|---|
1.7.2 | 8938 | 14.9024 |
1.7.1 | 6842 | 11.4077 |
1.8.3 | 5670 | 9.4536 |
1.9.1 | 5533 | 9.2252 |
1.10.2 | 5244 | 8.7434 |
1.8.2 | 3832 | 6.3891 |
1.4.2 | 3673 | 6.1240 |
1.3.2 | 2519 | 4.1999 |
1.5.2 | 2297 | 3.8298 |
1.6.4 | 1987 | 3.3129 |
1.4.4 | 1985 | 3.3096 |
1.6.2 | 1644 | 2.7411 |
1.6.1 | 1395 | 2.3259 |
1.5.1 | 1160 | 1.9341 |
1.9.0 | 964 | 1.6073 |
1.8.1 | 880 | 1.4672 |
1.10.1 | 868 | 1.4472 |
1.8.0 | 803 | 1.3388 |
2.0.3 | 508 | 0.8470 |
1.2.6 | 449 | 0.7486 |
1.7.0 | 403 | 0.6719 |
1.4.1 | 382 | 0.6369 |
1.11.0 | 363 | 0.6052 |
1.4.3 | 357 | 0.5952 |
2.0.0 | 246 | 0.4102 |
1.6.0 | 204 | 0.3401 |
1.6.3 | 193 | 0.3218 |
1.3.1 | 112 | 0.1867 |
1.5.0 | 104 | 0.1734 |
1.4.0 | 83 | 0.1384 |
1.10.0 | 79 | 0.1317 |
2.0.2 | 74 | 0.1234 |
2.1.0 | 68 | 0.1134 |
1.3.0 | 42 | 0.0700 |
2.0.1 | 19 | 0.0317 |
1.2.3 | 13 | 0.0217 |
В мире jQuery наблюдается интересный тренд — версия 1.7.х лидирует из года в год с огромным отрывом.
Параметр | Число | % всех сайтов |
---|---|---|
Общее число CDN-запросов | 78160 | 26.8743 |
select "Google"as name, count(distinct(pageid)) as count,
(100*count(distinct(pageid))/78160) as percent
from requests where pageid >= 14489007 and pageid <= 14802750
and url LIKE "%//ajax.googleapis.com/ajax/libs/%"
UNION
select "Yandex" as name, count(distinct(pageid)) as count,
(100*count(distinct(pageid))/78160) as percent
from requests where pageid >= 14489007 and pageid <= 14802750
and url LIKE "%//yandex.st/%"
UNION
select "Microsoft" as name, count(distinct(pageid)) as count,
(100*count(distinct(pageid))/78160) as percent
from requests where pageid >= 14489007 and pageid <= 14802750
and url LIKE "%//ajax.aspnetcdn.com/ajax/%"
UNION
select "JsDelivr" as name, count(distinct(pageid)) as count,
(100*count(distinct(pageid))/78160) as percent
from requests where pageid >= 14489007 and pageid <= 14802750
and url LIKE "%//cdn.jsdelivr.net/%"
UNION
select "Cloudflare" as name, count(distinct(pageid)) as count,
(100*count(distinct(pageid))/78160) as percent
from requests where pageid >= 14489007 and pageid <= 14802750
and url LIKE "%//cdnjs.cloudflare.com/ajax/libs/%"
UNION
select "jQuery" as name, count(distinct(pageid)) as count,
(100*count(distinct(pageid))/78160) as percent
from requests where pageid >= 14489007 and pageid <= 14802750
and url LIKE "%//code.jquery.com/%"
group by name order by count desc;
CDN | Count | Percent |
---|---|---|
67671 | 86.5801 | |
jQuery | 9222 | 11.7989 |
Cloudflare | 3996 | 5.1126 |
Yandex | 2379 | 3.0438 |
Microsoft | 1300 | 1.6633 |
JsDelivr | 324 | 0.4145 |
Как мы видим, львиная доля ресурсов подключается из Google CDN.
Давайте теперь посмотрим на профиль Google CDN. Будет интересно, но результат предсказуем.
select "jquery" as name,count(distinct(pageid)) as count,
(100*count(distinct(pageid))/67198) as percent
from requests WHERE pageid <= 14802750 AND pageid >= 14489007
and url like "%//ajax.googleapis.com/ajax/libs/jquery/%"
UNION
select "jquerymobile" as name,count(distinct(pageid)) as count,
(100*count(distinct(pageid))/67198) as percent
from requests WHERE pageid <= 14802750 AND pageid >= 14489007
and url like "%//ajax.googleapis.com/ajax/libs/jquerymobile/%"
UNION
select "angularjs" as name,count(distinct(pageid)) as count,
(100*count(distinct(pageid))/67198) as percent
from requests WHERE pageid <= 14802750 AND pageid >= 14489007
and url like "%//ajax.googleapis.com/ajax/libs/angularjs/%"
UNION
select "chrome-frame" as name,count(distinct(pageid)) as count,
(100*count(distinct(pageid))/67198) as percent
from requests WHERE pageid <= 14802750 AND pageid >= 14489007
and url like "%//ajax.googleapis.com/ajax/libs/chrome-frame/%"
UNION
select "dojo" as name,count(distinct(pageid)) as count,
(100*count(distinct(pageid))/67198) as percent
from requests WHERE pageid <= 14802750 AND pageid >= 14489007
and url like "%//ajax.googleapis.com/ajax/libs/dojo/%"
UNION
select "ext-core" as name,count(distinct(pageid)) as count,
(100*count(distinct(pageid))/67198) as percent
from requests WHERE pageid <= 14802750 AND pageid >= 14489007
and url like "%//ajax.googleapis.com/ajax/libs/ext-core/%"
UNION
select "jqueryui" as name,count(distinct(pageid)) as count,
(100*count(distinct(pageid))/67198) as percent
from requests WHERE pageid <= 14802750 AND pageid >= 14489007
and url like "%//ajax.googleapis.com/ajax/libs/jqueryui/%"
UNION
select "mootools" as name,count(distinct(pageid)) as count,
(100*count(distinct(pageid))/67198) as percent
from requests WHERE pageid <= 14802750 AND pageid >= 14489007
and url like "%//ajax.googleapis.com/ajax/libs/mootools/%"
UNION
select "prototype" as name,count(distinct(pageid)) as count,
(100*count(distinct(pageid))/67198) as percent
from requests WHERE pageid <= 14802750 AND pageid >= 14489007
and url like "%//ajax.googleapis.com/ajax/libs/prototype/%"
UNION
select "scriptaculous" as name,count(distinct(pageid)) as count,
(100*count(distinct(pageid))/67198) as percent
from requests WHERE pageid <= 14802750 AND pageid >= 14489007
and url like "%//ajax.googleapis.com/ajax/libs/scriptaculous/%"
UNION
select "swfobject" as name,count(distinct(pageid)) as count,
(100*count(distinct(pageid))/67198) as percent
from requests WHERE pageid <= 14802750 AND pageid >= 14489007
and url like "%//ajax.googleapis.com/ajax/libs/swfobject/%"
UNION
select "webfontloader" as name,count(distinct(pageid)) as count,
(100*count(distinct(pageid))/67198) as percent
from requests WHERE pageid <= 14802750 AND pageid >= 14489007
and url like "%//ajax.googleapis.com/ajax/libs/webfont/%"
order by count;
Script | Count | Percent |
---|---|---|
jquery | 59977 | 89.2541 |
jqueryui | 12437 | 18.5080 |
webfontloader | 4624 | 6.8812 |
swfobject | 2347 | 3.4927 |
prototype | 993 | 1.4777 |
scriptaculous | 787 | 1.1712 |
mootools | 445 | 0.6622 |
angularjs | 353 | 0.5253 |
dojo | 186 | 0.2768 |
chrome-frame | 75 | 0.1116 |
ext-core | 16 | 0.0238 |
jquerymobile | 1 | 0.0015 |
jQuery — действительно самый популярный скрипт. Обходит остальные библиотеки на порядок!..
Заметили интригующий результат? jQuery mobile подключен только на одном сайте!
Это не ошибка, я проверил трижды :)
В ходе анализа данных я заметил устойчивый паттерн, вносящий шум в результаты. А именно непонятный параметр в запросах к статике: ?ver=xxx.
Как оказалось, в основном это проделки WordPress! Он добавляет к статике параметр с версией.
К тому же, есть еще несколько характерных паттернов — некоторые сайты добавляют кеш бастинг ко всем ресурсам, включая статику из CDN.
Вернемся к вордпрессу. Я обнаружил интересные закономерности, которые позволяют ввести простую эвристику и оценить, на сколько распространён вордпресс:
Используя эти знания, получаем следующее.
select count(distinct(pageid)) as count,
(100*count(distinct(pageid))/290835) as percent
from requests where pageid >= 14489007 and pageid <= 14802750
and url LIKE "%jquery-migrate%.js\?ver=%"
or url LIKE "%jquery-migrate%.js\?v=%";
Число сайтов | % от общего количества |
---|---|
29819 | 10.2529 |
Как видите — более 10% самых посещаемых сайтов в мире используют wordpress.
P.S. В ходе исследования ни один сайт не пострадал. А вот расширение может что-нибудь сломать. Если вы его все же решите использовать и обнаружите такое поведение — напишите мне в личку.
P.P.S. Если у вас есть интересные вопросы, то задавайте их в комментариях. Я буду обновлять статью и добавлять ответы.
Автор: MrMig
Источник [12]
Сайт-источник PVSM.RU: https://www.pvsm.ru
Путь до страницы источника: https://www.pvsm.ru/javascript/56700
Ссылки в тексте:
[1] Google: https://developers.google.com/speed/libraries/devguide
[2] jQuery: https://code.jquery.com/
[3] Cloudflare: http://cdnjs.com/
[4] CDN: http://ru.wikipedia.org/wiki/Content_Delivery_Network
[5] сей образец расширениестроения: http://bit.ly/webbooost
[6] мозг: http://www.braintools.ru
[7] Common Crawl: http://aws.amazon.com/datasets/41740
[8] замечательную статью: http://www.stevesouders.com/blog/2013/03/18/http-archive-jquery/
[9] httparchive: http://httparchive.org/downloads.php
[10] Alexa: http://www.alexa.com/topsites
[11] jquery-migrate: http://jquery.com/download/#jquery-migrate-plugin
[12] Источник: http://habrahabr.ru/post/215173/
Нажмите здесь для печати.