SShortSingh.
Back to feed

How Zenith Walls served 70,000+ 4K wallpapers on Next.js 15 without breaking the edge

0
·2 views

Zenith Walls, a wallpaper platform offering over 70,000 high-resolution 4K and 8K images, faced severe performance challenges when scaling its Next.js 15 infrastructure across multiple CDNs and Cloudflare R2 storage. Key issues included browser tab crashes from parallel 4K bitmap decoding, CDN 403 errors caused by missing Referer headers in Next.js image optimization requests, and edge function CPU timeouts when attempting server-side image resizing. To address these, the team built a strict URL normalization pipeline that routes every image through a custom proxy endpoint before it reaches the UI, allowing controlled header injection, source routing, and edge caching. This architecture separated display-optimized image delivery from full-resolution downloads, eliminating layout shifts and improving Core Web Vitals like LCP. The approach avoided expensive infrastructure scaling by handling transformation logic deterministically at the proxy layer rather than on raw edge functions.

Read the full story at DEV Community

This is an AI-generated summary. ShortSingh links to the original source for the complete article.

Discussion (0)

Log in to join the discussion and vote.

Log in

Related stories

0
ProgrammingDEV Community ·

Why AI Agents Run Jobs Twice After Restart and How to Prevent It

When an AI agent restarts after a crash, it may re-execute tasks that were already completed, causing duplicate emails, payments, or deployments. The core problem lies in the gap between when a worker dispatches an action and when the result is recorded in durable storage. Developers can address this by assigning a stable idempotency key to each operation at creation time, rather than generating a new key on every retry. Recovery logic should not simply check whether a job is incomplete, but instead query the last confirmed state of the effect from the provider. If a provider lacks native idempotency support, a durable effect ledger combined with a reconciliation adapter can help prevent unsafe replays.

0
ProgrammingDEV Community ·

How Atomic Clocks Define Time and Keep Distributed Databases in Sync

Atomic clocks serve as the ultimate source of accurate time by exploiting the fixed quantum resonance frequency of cesium-133 atoms, which forms the official SI definition of one second. Unlike quartz oscillators that drift roughly one second every 11–12 days, cesium atomic clocks lose only about one nanosecond per day, making them far more reliable. NTP servers ultimately trace their time back to these atomic clocks through a hierarchy of stratum servers, with the cesium atom itself acting as the irreducible reference. The Bureau International des Poids et Mesures in Paris aggregates data from around 450 atomic clocks across 80-plus institutions to produce International Atomic Time, which is then adjusted for Earth's rotation to yield UTC. Different atomic clock technologies — including cesium beam, rubidium, and hydrogen maser — vary in accuracy, size, and cost, and are often combined to balance short-term stability with long-term precision.

0
ProgrammingDEV Community ·

Studios Own the Content But Can't Prove It: The Provenance Gap AI Exposed

A media studio discovered its back catalogue had likely been used to train a public AI model, but when asked to prove ownership and rights history of its assets, it could not produce the records. While the studio had robust digital rights management to prevent piracy, it lacked a structured, queryable record of when each work was created, who contributed, and what rights applied. This information existed only in scattered contracts, production notes, and the memories of former employees — not as retrievable data. The incident highlights a broader vulnerability in the media industry: owning content is legally distinct from being able to prove its provenance on demand. As AI training practices face growing legal scrutiny, the absence of machine-readable rights records is becoming a costly operational and legal liability for content businesses.

0
ProgrammingDEV Community ·

Polyhost: An Open-Source Docker Compose Stack for Self-Hosting Multiple Websites

A developer has released Polyhost, a MIT-licensed reference stack designed to simplify self-hosting multiple websites from a single server. Rather than building a reusable framework or package, the author chose a forkable, readable Docker Compose setup that developers can adapt to their own needs. Polyhost integrates five services: Nginx as a reverse proxy, Squidex as a headless CMS, MongoDB for data storage, an ASP.NET Core backend, and a Debian-based development shell. The project targets independent developers who want a repeatable hosting setup without relying on a full platform-as-a-service solution. It is available on GitHub, and the author plans a multi-part series walking through the stack end to end.