All references

Case study

Hosting

Half a million images that no longer go missing

Vizkultura. A visual culture portal with one of the largest media libraries in the region: from upload problems, through R2, to Backblaze B2 and AVIF.

Open site Draft — the client is still confirming the text
media files
~480.000media files
PageSpeed (mobile)
94PageSpeed (mobile)
LCP on real users
0,8 sLCP on real users
for every new upload
AVIFfor every new upload
01

The client and the challenge

Vizkultura is a portal on architecture, art, design, photography and film. Editors publish new photo-heavy articles every day, so the library grew to around half a million files. Media had already been moved to Cloudflare R2 with an older plugin, but uploads were not reliable: images sometimes did not make it across, local copies stayed on the disk, and there was no AVIF. When we audited the library we found a more serious problem too: when an editor uploaded a file with a name that had been used before, the old plugin overwrote the image of an older article in the bucket.

02

The solution

Instead of patching the old plugin once more, we moved the site to our own offload plugin, the one that does the same job on all our sites. First in R2 mode, with the same bucket and the same URLs, so nothing changed for visitors. Every file name is unique, the local copy is deleted only after the file is confirmed in the bucket, and the AVIF version is made in the background so the editor never waits. Before any of that we tested the plugin on a separate server against a real R2 bucket. Then we copied the library from R2 to our Backblaze B2 bucket in the EU, verified it file by file and sent the old addresses on with a permanent 301 redirect.

03

The result

The site scores 94 on the mobile PageSpeed test, and Google confirms a Core Web Vitals pass on real users (Chrome UX Report, 28 days): LCP 0.8 s, INP 65 ms, CLS 0. More important for the newsroom: uploads are predictable, no image overwrites another any more, and new images get AVIF right away.

How we got there

  1. 1

    Everything on the web server

    Uploads lived in wp-content/uploads. The library grew faster than the disk, and every backup carried hundreds of gigabytes of images.

  2. 2

    The old R2 offload

    Images moved to Cloudflare R2, but the plugin had bugs: same-name files overwritten, leftovers on disk, no AVIF and no Cache-Control headers.

  3. 3

    Our plugin, same bucket

    Unique names, the local copy deleted only after confirmation, AVIF in the background. URLs did not change, so visitors noticed nothing.

  4. 4

    Backblaze B2 (EU) and AVIF

    A bucket-to-bucket copy, every file verified, permanent 301 redirects for old addresses and AVIF through HTML <picture> with the original as a fallback.

Under the hood

01

Why images “went missing”

After deleting the local copy, the old plugin let WordPress give the same file name to a new upload. The new image silently replaced the old one in the bucket, so an older article suddenly showed the wrong photo. Our plugin checks the bucket before an upload, not just the disk.

02

AVIF without the risk

AVIF is never swapped in at the original address. The page offers AVIF through <picture>, and a browser that does not support it gets the original. Gallery, cover and image blocks show one image per slot, lightbox included.

03

Moving without downtime

Copying runs while the site runs. A file’s location changes only after its copy is confirmed, the old bucket stays untouched as the way back, and old addresses lead to the new ones through a permanent redirect.

More references

All references →
togetherness-togetherless.com
Web studioHostingTogetherness / Togetherless

An interactive pavilion for the Venice Biennale

A web app for the Croatian Pavilion at the 17th Architecture Biennale (2021): visitors build their own compositions from objects in the exhibition and share them.

  • 17th Architecture Biennale, 2021
  • Built to the designers’ design
  • Compose, export and share

Draft — the client is still confirming the text

Read the story
deltalab.hr
Web studioHostingDeltalab

Big galleries and a menu that never overlaps

An urban studio whose project galleries need to be sharp and fast, with a menu that is different every time.

  • PageSpeed 92 (mobile)
  • Galleries in AVIF
  • A menu with no overlaps

Draft — the client is still confirming the text

Read the story

Try it on your own site

Send us your site address — you get a migration assessment within one business day.