Subscribe

Lessons learned from building a high-volume public-facing Web site


Johannesburg, 20 Jun 2018
Saratoga has been working on one of the largest news sites in SA for over four years.
Saratoga has been working on one of the largest news sites in SA for over four years.

Saratoga has been developing and managing the public-facing news Web site for a large South African media house for the past four-and-a-half years.

The site currently ranks as the second-largest news site in South Africa, with 5.5 million unique browsers visiting each month, producing more than 24 000 000 page views, when measuring international traffic.

Saratoga's team has learnt many valuable lessons from working on such a large site, with one of the key lessons being that the saying 'time is money', can also be applied to loading times for Web sites.

In a case study Walmart found that for every 100 milliseconds of improvement, they grew incremental revenue by up to 1%.

Akamai found that 64% of shoppers who are dissatisfied with an online store's experience and loading time will take their business elsewhere.

In the world of online media, which is a very competitive sector that often solely relies on ad revenue, the same harsh reality applies.

Here are some of the lessons that we've learnt through our years of development on this site:

1. Design for scalability

Unpredictable growth and wildly varying traffic can place considerable pressure on infrastructure and push monthly spend through the roof. Before the cloud there was no option but to cater for the worst-case scenario and invest heavily in servers and other infrastructure to carry the worst load imaginable. Even then, sites would be pulled offline when a sudden surge of interest would send millions of visitors to the site.

It's easy to see why cloud-based scaling is so popular, and auto-scaling allows more resources to be deployed and removed on demand automatically and as the need arises.

The software components need to be able to deal with scaling too. Often this means splitting services from the main codebase, which is the collection of source code that is used to build the software system, off onto their own services to allow them to be allocated more resources when required.

In this case, Saratoga split the content management service from the front end, to allow each component to scale individually. This allows the front-end to scale independently from the back-end when the traffic increases.

2. Effective caching

A cache is used to store something temporarily. In computing, active data is often cached to shorten data access times, reduce latency and to improve input and output. Caching is therefore vital to almost all applications to improve performance.

For example, Web browsers such as Firefox, Safari and Chrome use a browser cache to improve performance for frequently accessed Webpages and Webpage components. When you visit a Webpage, the files your browser requests are stored on your computer in the browser's cache. If you click 'back and return to that page, your browser can retrieve the files it needs from cache instead of requesting them from the server again. Ultimately the benefit of cache is that it's much faster for your browser to read data from the browser cache, than to have to receive the files from the server.

A common misconception of caching is that it only affects the above-mentioned example; the transaction between the browser and the Webserver. In fact, caching affects all layers of the system, including the edge servers, the Web presentation server, the Web application server, the network, the existing business applications, and the database. Over-caching however is as counterproductive as under-caching, hence a well-thought caching strategy is critical.

A caching strategy reduces load on the servers, which means fewer servers are necessary to handle the same load as without caching. While activating a CDN (content delivery network) such as Cloudflare will provide an initial and cheap performance gain, most systems require a lot of fine-tuning to truly take advantage of all the features such a system provides.

3. Push the workload to the edge

In a nutshell, edge computing is a method of optimising cloud systems by extending the control of computing applications, data, and services away from the servers to the other logical extreme (the 'edge') of the Internet. In this architecture, performing analytics and knowledge generation at the edge reduces the traffic between client and server.

Edge workers let developers deploy code at the edge, closer to the end user, and enables programmatic functionality for routing, filtering and responding to HTTP requests that would otherwise need to be run on the server at the origin.

Combining edge workers with an effective caching strategy, back-end servers can be fine-tuned to handle just the critical transaction workload. This reduces the number of resources required and improves the overall user experience, which translates to higher income and lower expenditure.

4. Design pages for performance

It is easy to overcrowd a Web page with features and elements, but when looking at performance, each feature or element should have a business value for being there. Each item delivered by the page degrades the time needed to download the page, and as mentioned earlier every millisecond counts.

Performance is placed in sharp focus when one looks at the fact that Web sites are being accessed more and more by mobile devices on slow and unreliable networks. For good reason, performance tools such as Google's Lighthouse insist on doing performance tests on a 3G equivalent network.

Leveraging the right technologies and techniques, such as effective caching, goes a long way to retaining visitors, reducing bounce rates and ultimately pushing up the bottom-line.

Willo van der Merwe is a Principal Developer at Saratoga and works with a team to develop and maintain this Web site. For more insights from our technical experts, or Saratoga's success stories across the financial, retail and media sectors, connect with it at www.saratoga.co.za.

Share

Editorial contacts