Radical Media: Website

LAMP, Javascript, LESS

Our team was tasked with rebuilding Radical Media's website so that it reflected the quality of work that Radical Media produces. We made it mobile-friendly, accessible, and significantly reduced load-times

Responsibilities:

1. One of three engineers. I worked mostly on user interactions and media delivery.

Takeaways:

1. I built features to optimize media delivery: determining which compression to deliver, front-loading low-quality assets to make it appear like the media was already loaded, and predictively pre-loading content.

As a production company our site is exceptionally media heavy. It is also important to us that we provide the highest-quality images & videos at the quickest speeds.

Example Problem:

Our designers wanted to have the homepage cycle through tens of full-bleed images at a quick pace. It was also necessary that the image quality was maintained and that the page loaded quickly. However, loading the images asynchronously left the page blank initially but loading just the first full-size image delayed the page load by a full second.

Solution:

To give the illusion of loading, the homepage immediately loads a blurry ~3kb version of the first full-bleed image. It then asynchronously loads the full-quality version, and begins to pre-load the rest of the images. If an image is not loaded in time it skips it and loads the next available image. This process shrunk our homepage load by 80%.