Addthis / Sharethis VS добавляя каждую кнопку "вручную"

Question

Я хотел бы добавить fb-like, google + 1, кнопку твита и т. Д. На мою новую страницу (при отображении определенного сообщения).Я знаю, что, например, addthis предлагает это по умолчанию.Но недостатком является то, что вы получаете довольно большой файл javascript, который иногда выдает некоторые ошибки.Поэтому мой вопрос: какой вариант и почему вы, ребята, обычно выбираете в подобных сценариях.Спасибо

Answer 1

Включение через addthis не является моим предпочтительным способом включения социальных кнопок.На самом деле, как вы заметили, иногда выдаются некоторые ошибки, и если библиотека addthis не работает (например, ошибка javascript, тайм-аут сервера ...) все кнопки могут не работать, поскольку они зависят от уникальной библиотеки.Кроме того, для простоты производительности addthis - это скрипт, который загружает другие скрипты (это 33kb в сжатом виде), поэтому его можно избежать, и я могу полностью контролировать включение социальных кнопок.

Я предпочитаю загружать все асинхроннонеобходимые библиотеки и внедряют необходимую разметку только в том случае, если они мне действительно нужны, например:

$(document).ready(function() {

    if (('.socialshare').length) {

       /* twitter button */      
       $('<a href="https://twitter.com/share" class="twitter-share-button">Tweet</a>').appendTo($('.socialshare'));
       loadscript('//platform.twitter.com/widgets.js', 'twitter')

       /* Google +1 button */      
       $('<div class="g-plusone" data-size="medium" data-annotation="bubble"   data-expandTo="top"></div>').appendTo($('.socialshare'));
       loadscript('https://apis.google.com/js/plusone.js', 'google-plusone');
    }

})

(ради производительности кешируйте ссылку на .socialshare) loadscript - простая функция загрузчика скриптов, такая какэто

function loadscript(url, id) {
    var js, fjs = document.getElementsByTagName('script')[0];
    if (document.getElementById(id)) { return; }
    js = document.createElement('script'); 
    js.id = id;
    js.charset = "utf-8";
    js.src = url;
    fjs.parentNode.insertBefore(js, fjs);
};

в основном, если мой шаблон содержит элемент с социальной кнопкой (элемент .socialshare), я внедряю элемент script с идентификатором (так что я уверен, что никакой другой скрипт не сможет внедрить их дважды)