Web performance is important for anyone making a living from a website. Websites these days use third-party scripts to deploy ads, conversion pixels, embeds and many more tools. Third-party scripts have gained popularity due to their ease of use. At Pelcro we decided to build the most powerful content subscription platform that is bundled in one easy to integrate script. The challenge was the ensure we adhere to the highest performance standards in order not to negatively affect any of our client’s page performance. In this post, I will guide you through what we do, this can also serve other developers working on third-party script and also for webmasters to ensure all their 3rd party scripts adhere to the same standards.
1- Code redundancy
We always ensure our code is as efficient as possible, reducing any redundancy in the code is the first step to ensuring our script remains as efficient as possible.
2- Content delivery network
In order to speed the delivery of our script to your visitor’s browser, we leverage a content delivery network (CDN). CDN is a system of distributed servers that store a copy of our script on several caching servers around the world. If our server is for example based out of Montreal, Canada, a CDN server in China will copy our script and server is from there to any Chinese visitors. This allows the visitor to download our script on their browser a lot faster.
Minification is simply an automated process to remove any unnecessary or redundant code/data without affecting how the code is processed. The process simply removes any comments, formatting, un-used code and transforms variable and function names to shorter ones. Minifying our code reduced it from 1M to 150KB!
Gzip is a compression algorithm that allows our servers to compress our files to be transferred faster on the network, this improves performance significantly. Here a quick tutorial if you would like to learn how to do it.
Caching can have a huge impact on script performance and so it is important to prioritize it. Google’s Speed Tool puts a lot of emphasis on Caching, we cache all our scripts on visitor’s browsers for a week. We do force the script to be updated as soon as an update of the script is released.
Our script is executed asynchronously, this allows the rest of the page to continue to parse while our script is being executed. Setting the script to async is simple, you just add the attribute to the script.
Most of the points above are related to the script, but it is important to discuss our API as well. Our API handles millions of requests a day and so ensuring our JSON responses are GZipped was the first step. In order to reduce the load on our database and not allow it to be our bottleneck, we leverage Memcached. Memcached is an in-memory key-value store for small chunks of arbitrary data (strings, objects) from results of database calls or API calls. Facebook uses Memcached :).
HTTPS connection protects all data transferred between a user’s browser and our API. This protects users from hackers trying to access or tamper with the data. Although we use a TLS protocol for all our data transfers, we recommend all our clients to do the same. Google Chrome recently announced it will alert users visiting an HTTP domain a security alert.
Hope this helped clarify what we do regarding performance. Please visit our site to learn more about Pelcro and how we help websites drive subscriptions from their audience.