Stop your social share buttons from tracking your visitors and slowing your page speeds

Most social media plugins are not good for your website's performance or visitors' security. There's an easy way to implement a clean, secure solution.

Author
David

Being a firm that improves search engine optimization, we understand websites need to publish their articles and content on social media platforms.  Social share buttons are the most common tool used to facilitate content distribution.

It's an important function for content creation, but there's a big problem with how most sites implement social shares: they're unsecure and make page loads slower. 

Being a firm that improves performance and security, this is a common problem we fix.  Some are worse than others, but the majority of share plugins track your visitors and hurt page speeds.

Performance

Most plugins load JavaScript onto the web page.  JavaScript should always be used as sparingly as possible because there's a performance cost to using it, as the code needs to be requested and loaded across the network, and also needs to execute in the web browser.

If using JavaScript were the only way to present social share buttons, then we'd have no choice but to use it.  There is, however, another implementation that doesn't use JavaScript, which we integrated into our website today (the buttons below).

Why is JavaScript used with sharing plugins in the first place?  The answer to that involves what a share button is.  It's simply an image wrapped in a share link to a URL of a specific social media platform.

The JavaScript adds the web page URL and any other data required for sharing by the social media platform to that share link destined for the social media platform.

Security

Most plugins nefariously take the data about the web page and instead of sending it to the social media's share URL, they send it to their own tracking platform to collect data.  They then forward it to the social media platform for the share.

Website owners usually aren't aware that they're complicit in providing their website visitors' data to a third party.  Worse, most website administrators aren't technical enough to understand this because plugins to them are a mysterious black box.

These plugins not only load JavaScript, but also load the accompanying style sheets (CSS) that provide color, layout, size, and positioning for the buttons.  This means there's at least two network requests for each page load: one for the JavaScript and one for the CSS.

Solution

This is too much complexity for simple social sharing.  The solution, however, is easy: remove JavaScript from the equation.  This will improve performance and security in one move.

The other performance issue involves the loading of the social icons.  Typically these are an image file, like PNG or JPG, and for each one, another network request is made.  There's ways to optimize this, but most plugins give little care to performance.

A simple solution is to render the icons using SVG.  The browser instantly renders these icons and avoids the multiple image loads.

With this solution, we load the SVG icons on page load, wrapped with the share links "pre-filled" with the data that would otherwise be dynamically set by JavaScript.  There's no calling back to the server, and certainly no third-party intervention.

All of the security and performance gain is traded for a few extra lines of CSS.

There are plenty of libraries implementing this no-tracking, no-JavaScript sharing solution, but we're using Sharingbuttons.io.  We integrated this library with our site today, and you can see them in action below.