Социальные api кнопки убивают производительность сайта

в 18:48, , рубрики: Песочница, метки: , ,

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

Многие знают сервис Google PageSpeed Insights для проверки скорости загрузки страницы. Он помог мне обнаружить, что кнопка лайка Facebook подгружает пользователю огромный javascript, который даже не удосуживается сжать. Мне стало очень интересно: зачем для того чтобы поставить лайк нужен js скрипт на 224 Kb? Культовая игра СуперМарио весила 40 Kb, а кнопка лайка 224! Сразу представил себе, чем занимается кнопка Facebook на моем сайте помимо своих основных обязанностей. Дальнейшее исследование показало, что абсолютно все социальные кнопки подгружают большие несжатые скрипты.

Проверив скорость загрузки страницы, на которой установлен ряд кнопок из соц сетей, я ужаснулся. PageSpeed Insights показывал 50 баллов.

Социальные api кнопки убивают производительность сайта - 1

Убрав кнопки, я снова замерил скорость и обнаружил, что оценка поднялась сразу на 24 балла:

Социальные api кнопки убивают производительность сайта - 2

Ничего себе цена за социальные кнопки.

Конечно же, есть много сервисов, которые предоставляют красивые стилизованные социальные кнопки, которые при этом мало весят. Но там есть только возможность поделится записью. Нигде, ни в какой из этих библиотек нет кнопки Facebook Like, которая работала бы в один клик — как фирменные API кнопки.

Я пытался отложить загрузку скриптов до полной загрузки страницы и даже ставить задержку в несколько секунд перед подгрузкой кнопок, но Google PageSpeed Insights неизменно показывал, что моя страница далека от совершенства. Снижение оценки страницы на 24 балла — это очень высокая цена за api кнопки.

Мой вывод

Поместить кнопки лайка на сайт, не утяжеляя его избыточно, просто невозможно. И только кнопки «Поделится» от сторонних разработчиков можно установить без жертв.

* - обязательные к заполнению поля


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js