Worried about Site Speed and Concerned About Page Weight This Peak

Having a website that performs well is crucial. It's the first thing users notice and can greatly impact conversion rates, bounce rates, and SEO rankings. At Amplience, my team and I have been dedicated to improving this aspect of customer experience for the past decade by using dynamic media and headless CMS technology. We are always focused on optimizing the delivery performance of content and media, and just when I thought my team couldn't go any further, they developed an innovative module called "Accelerated Media", which we believe will massively improve site performance and, ultimately, the customer experience.

Why is website performance important?

Website performance is a crucial aspect of web development related to a website's speed, stability, and usability. When we speak of website performance, we are primarily concerned with the speed at which web pages are downloaded and displayed on a user's web browser. A well-performing website is a powerful tool—it can engage visitors, convey trust and authority, and encourage them to interact with the site's content, products, or services. The factors of why website performance is so important are:

User Experience:

When a website loads quickly and efficiently, users can begin interacting with the site immediately, enhancing their overall experience. In today's fast-paced digital environment, users are less tolerant of slow-loading sites, and a negative initial impression can potentially deter them from future visits.

SEO Ranking:

Google and other search engines place considerable importance on website speed as it directly affects SEO rankings. A fast-loading site can rank higher on search engine results pages (SERPs), increasing visibility and traffic.

Bounce Rate and Dwell Time:

Website speed significantly impacts bounce rates—the percentage of visitors who navigate away from the site after viewing only one page. A slow website can increase bounce rates and reduce dwell time, the amount of time a user spends on a site. This, in turn, can negatively affect SEO rankings as search engines infer that the website does not offer a good user experience.

Conversion Rates:

The impact of website performance on conversion rates is undeniable. Various studies have shown that a site that loads in 1 second can have a conversion rate three times higher than one that loads in 5 seconds and five times higher than a site that loads in 10 seconds. Whether this is exactly the same for every site is unknown, but there is a correlation between site performance and conversion. This can mean the difference between gaining or losing a customer to a competitor.

Brand Image and Credibility:

A fast website helps establish a positive brand image and credibility. It conveys professionalism and attention to detail; users are likelier to trust and engage with a well-performing site.

Optimizing Imagery is Crucial for Great Web Performance

Large image files can cause website performance issues, so optimizing them is crucial for improving site speed. Optimizing techniques like image compression and resizing can significantly impact website load time. This is why we built the dynamic imaging service. It is designed to give you the flexibility to retrieve images in any desired shape, size, or format. With this service, you can easily resize, compress, crop, and composite layers, among many other features, at a breakneck speed. You'll be able to control every single pixel delivered to your site for optimal performance.

Even faster with Accelerated Media by Amplience

Amplience can already control the size and compression of images and crop them to focus on specific areas for responsive design to optimize site performance, so what else can we do?? Well, there’s a new format called AVIF that has emerged and promises even more significant compression without sacrificing quality. However, there are many challenges in implementing this new format, and we didn’t want to create new challenges for our customers by requiring additional coding on the client side. Fortunately, my team developed a new Accelerated Media module incorporating AVIF, automatic image selection, sophisticated code libraries, and programmatic CDN architecture. This integration enables fast and efficient media delivery without any complex coding.

Embracing the Future: AVIF

AVIF, which is emerging as the leader in image compression technology, is set to replace Webp due to its superior capabilities. It offers lossless and lossy compression, supports multiple color spaces, and is supported by leading web browsers like Chrome, Firefox, and Safari, covering over 82% of end-user devices.

AVIF Summary

• A royalty-free image format, compressed with AV1 in the HEIF container format
• Support multiple cooler spaces, including HDR, SDR
• Lossless and lossy compression
• 8, 10 and 12 bit colour depths
• Alpha channel for transparency
• 4:2:0, 4:2:2, 4:4:4 chroma subsampling

There are many published papers on the expected results from members of the Alliance of Open Media (the group of companies behind the development of AV1 and AVIF), and independent bodies.? The consensus is that for a like-for-like quality, the file size for AVIF would be 50% smaller than JPEG and 20% smaller than Webp.

“In a number of tests by Netflix in 2020, AVIF showed better compression efficiency than JPEG as well as better detail preservation, fewer blocking artifacts and less colour bleeding around hard edges in composites of natural images, text, and graphics."

In our own in-house studies, we confirmed these results showing that if customers implemented this service, they would decrease their overall image size by between 30% and 50%.? Thanks again to the team for building an analysis tool that allows us to generate reports of these savings.

Challenges and Triumphs: Our Journey with AVIF

Integrating AVIF into Amplience had its own challenges, as AVIF provides excellent compression efficiency but requires more time for output computation, which presented significant obstacles. At a high level, AVIF takes at least 4 times longer to encode than a similar Webp and over 12 times longer than a JPEG. For example, encoding a 1920x1080 image into different file formats

• AVIF: 870ms
• Webp: 250ms
• JPEG: 71ms

It should be noted that the impact mentioned only applies to situations where there is a cold cache miss. Fortunately, Amplience has always utilized a multi-CDN setup, which includes mid-tier caches and autoscaling at the image processing origin servers. This affords us greater control over processing times. Additionally, our team has restructured the media encoding pipeline to reduce these processing times while implementing safeguards to ensure optimal image quality and speed. In real-world testing, we found that over 90% of images were still returned in AVIF format.

AVIF is fully integrated into our intelligent image delivery system, automatically selecting the best format for each request based on device requirements, quality, and speed. This significantly reduces file size and enhances website performance.

Integration: Simplified and Efficient

The great thing about integrating this new accelerated media module is that the team made it super easy, with minimal effort required from existing Amplience customers. The implementation of this module promises immediate improvements in bandwidth and image quality, making the transition seamless and beneficial.? Once Amplience provisions the module for your account, and you are using fmt=auto, your users will start seeing the bandwidth saving of the latest image format with no loss of quality immediately. If you're new to Amplience, using accelerated media is as easy as just adding a new image URL.

Acknowledgements

In my role as CTO, it's always a pleasure to share news about how we're positively impacting our customers. This time, though, I want to give a special shout-out to Greg Loscombe and his Dynamic Media team. They've been working tirelessly to ensure that this latest release is ready in time for our customers to take full advantage of it during peak trading. I'm truly grateful for their hard work and dedication; I know our customers will be too.

Thanks team!