Skip to main content

My experiment with golang and social counters

Starting with my frustration while building the scroll website: the social buttons are freaking slow to load. Especially on pages that has a lot of scripts (like mine) it is way worse. The buttons usually take minutes to show up and when they do, each of them render differently from the rest. Thanks Facebook, Twitter and Google for that.

So I went in and found a few options. It looks like people made a few scripts that will collect the counters via AJAX (on user browser) and render the buttons with images. Some use data URI to avoid triggering more requests, brilliant! Since I wanted to make something super simple and fast to use, I decided to have one script that does all of those. The server will keep track of the counters and put them in the script so everything needed is one and only one request.

I needed 3 social networks and each of them has different ways to retrieve the counters so I figured the server has to make the requests asynchronously, cache the values for sometime and return the bundled js. My goal is to have it at maximum 50KB and delivered within 500ms. According to my measurement, current scripts from the social networks are way more than that:

  • Facebook sdk.js is the worst contender at about 164KB 
  • Twitter's widgets.js is 107KB
  • Google is the winner here, their platform.js is only 37KB
At first I wanted to do this with Node.js because it's fairly simple and it looks like all output is javascript anyway. Turned out making 3 async http requests and merging the results together is quite complicated (callback hell, anyone?). So I switched to use golang since I tried their channel before and it seems to be a good fit. The project went well and I have them running at both Google App Engine and Heroku at the moment:
The code is pushed to GitHub too, with a simple demo site which makes use of the Heroku instance: http://hoangson.vn/go-socialcounters/. The all.js script is only 14KB (8KB gzip) and normally finished loading in less than a second. I also added a jQuery Plugin script for advanced usage (it fetches a heavily cached jsonp file). The project uses data URI as the other scripts that I found but those images do not look good in high resolution screens so I try to detect SVG support and use SVG whenever possible.

I hope this project is useful for someone.

Comments

Popular posts from this blog

IMAP module for PHP in Mac OS X Mountain Lion

So here it comes again. I have recently upgraded to Mountain Lion and for whatever reason, Apple decided to nuked all my previous PHP (among other things) configurations so I have to setup IMAP in PHP again. A simple Google search may point you to this post with detailed instruction for Lion however, some steps have been changed a bit... Step 1: Install prerequisites You may choose to download Xcode ( FREE ) from the App Store then go to menu Xcode > menu item Preferences > tab Downloads, select to install Command Line Tools OR you can go to Apple Developer  to get it, you may need to login. Step 2: Compile IMAP Get the IMAP source code from University of Washington website . Please do me a favor and check that website for the latest version, it's good practice. If you that laz y , try to click the "y" to get direct link to 2007f version. Extract the package and open the Terminal to the new directory before executing these command: make osx EXTRACFLAG

A faster Docker for Mac experience

Docker for Mac is freaking slow, this is known issue for years. I'm switching to docker-machine running within Parallels for now... Image from unsplash.com Install the tools I use brew to quickly install these: brew install docker-machine brew install docker-machine-parallels Create the virtual machine The --driver param and vm name is required. The others are all optional, the default values are quite low so I bumped the specs a bit. docker-machine create --driver=parallels \   --parallels-cpu-count=2 \   --parallels-disk-size=100000 \   --parallels-memory=4096 \   parallels Usage Set up the shell environment: eval $(docker-machine env parallels) Then use the cli as normal: docker ls docker-compose up -d To get the vm IP address: docker-machine ip parallels

Flutter: Fixing Firebase header not found with Notification Service Extension

If you follow the FCM tutorial Send an image in the notification payload and encountered this error message: 'FirebaseMessaging/FirebaseMessaging.h' file not found You are on the right place, I'm going to show you how to fix it. My app was working fine but one day it stopped compiling. Apparently Flutter 1.20 changed the way it uses CocoaPod so the service extension no longer has the proper library configured. After some tinkering, I came up with this pod config, it has to be added to ios/Podfile below the main Runner target. target 'FcmImage' do use_frameworks! use_modular_headers! require File.expand_path('../.symlinks/plugins/firebase_core/ios/firebase_sdk_version.rb', __FILE__) firebase_sdk_version = firebase_sdk_version! pod 'Firebase/Messaging', "~> #{firebase_sdk_version}" end FcmImage is my extension name, replace it with yours We can use a hardcoded version for Firebase/Messaging pod but doing so m