Web Performance Optimization with Amazon CloudFront for HealthT…

Healthera operates a leading UK healthcare marketplace that provides patients with medicines, healthcare services and products through the largest digital platform of pharmacies and GPs, including national chains and independent providers.

Healthera, in partnership with a leading European pharmacy network, sought to leverage its API for the network’s web application built on React.js/Next.js. Their obstacles included mitigating latency issues in the app’s performance, navigating the complexities of establishing an efficient CI/CD pipeline, enabling scalability for potential traffic growth, and minimizing infrastructure costs.

By leveraging the power of Amazon CloudFront (as well as other AWS tools) implemented to the application by our professionals, the client gained improved user-friendliness and user experience. Furthermore, we ensured scalable infrastructure and reduced IT costs through strategic technology choices, benefitting both the client and their customers.

Healthera has engaged with a leading European network of independent pharmacists with over 1,000 member pharmacies across the UK and stores in 9 European countries. The pharmacy network wanted to utilize Healthera’s API and build their web application using React.js/Next.js frameworks on top of it.

Moreover, the DNS configuration of the network domain is managed outside of AWS on their side but the web application has to be launched in Healthera’s AWS account.

So Healthera as our client asked us to assist with this project from the AWS infrastructure and deployment perspectives. Here are the actual challenges we were tasked with addressing:

Improving the app performance by reducing latency and optimizing load times for users;

Developing a CI/CD pipeline that deploys a React.js SPA (single-page application);

Ensuring the app’s scalability and optimal performance for expected traffic increase;

Reducing application infrastructure costs (e.g. data transfer expenses).

In general, we solved the problem of improving the performance of the client’s website and partners’ applications using Amazon CloudFront. CloudFront helped us speed up static content such as images, animations, CSS, JavaScript, and the ReactJS apps to end users worldwide.

We configured a CloudFront distribution with a source to an S3 bucket with a website. Additionally, the ability to integrate CloudFront with Lambda@Edge allowed us to rewrite client requests and add the .html suffix, which is necessary for proper processing on the Next.js side.

With the new integration, the client expects a surge in traffic and we advised increasing the amount of running tasks in the ECS cluster responsible for processing requests to the api.healthera.co.uk endpoint.

For the pharmacy network host we recommended creating a CNAME record and directing it to the CloudFront distribution. In order to efficiently route traffic to the root domain through CloudFront, we suggested setting up AWS Global Accelerator (GA) and creating two A records to IPs provided by it. Additionally, we configured Global Accelerator (GA) to direct traffic to the existing AWS ALB (Application Load Balancer) where a new listener rule was established, enabling a 301 redirect to the root domain for URLs without the “www” prefix.

The client decided to sell a ready-to-use version of their web application as a SaaS solution, which needed the capacity of the rapid delivery at scale, targeting the onboarding of 10 or 15 new clients every day. It was imperative that the onboarding process required minimal involvement of non-tech skilled clients while also keeping infrastructure costs low.

What we did was create a CI/CD pipeline that deploys a React single-page application (SPA) to static S3 hosting. The deployment pipeline we implemented using Jenkins as this is the main build tool for Healthera’s workloads.

Using CloudFront with S3 bucket proved to be a cost-effective solution by minimizing data transfer expenses. It was achieved through caching frequently used content in edge locations, consequently reducing the volume of requests directed to the S3 bucket. As a result, data transfer costs were reduced, and application performance improved by reducing latency and load times for users located far from the S3 bucket.

Leveraging Amazon CloudFront:

Enhances app availability by caching content in edge locations which reduces server workload

Enables quick content delivery through the usage of HTTP or HTTPS protocols

Facilitates GEO targeting service for content delivery to specific end-users

Provides high security with the ‘Content Privacy’ feature

Sustains cost-efficiency as it only charges for the data transfer

Ensures significant productivity gains because the service is easy to use.

Amazon CloudFront

Amazon S3 (Simple Storage Service)

AWS CodePipeline

AWS Certificate Manager (ACM)

AWS Global Accelerator

Application Load Balancer

What was made during the project led to significantly faster loading times of the application and its better responsiveness, so the app became notably more user-friendly.

Consequently, the abovementioned improvements have propelled the client’s platforms up in SEO rankings, attracting more organic traffic and, in turn, a larger customer base.

Expected traffic increase as well as further enhancing of solutions’ users needs in flexible and controllable extending of the computing capacity of the application. So we thought out and ensured this ability in advance.

Since the client provides the web application as a SaaS solution, the usage of Amazon CloudFront with Amazon S3 instead of ECS resulted in significant cost efficiency, which in turn ensures lower prices for SaaS clients.

[Redacted] is AWS Advanced Tier Services Partner, trusted Software Development Company and Managed Service Provider, founded in 2004. We help customer-centric companies build, run, and optimize their cloud systems on AWS with creative, stable, and cost-efficient solutions.

Delivery of quality solutions

Customer satisfaction

Long-term partnership

We have successfully delivered 100+ projects and have a proven track record in FinTech, HealthCare, AdTech, and Media industries.

[Redacted] possesses a 5-star rating on Clutch due to its strong expertise, responsiveness, and commitment. 60% of our clients have been working with us for over 4 years.