How Dub saved $12,000/year in bandwidth with Lottie

Summary & Key ROI

Dub is the modern link attribution platform for short links, conversion tracking, and affiliate programs. Because the product bridges marketing and infrastructure, the team prioritized intuitive design for their recent homepage redesign.

They utilized purposeful animation to simplify complex workflows and showcase products without sacrificing performance or distracting the user. The goal was to ensure motion served as a guide, making the experience feel seamless and easy to understand.

While the team initially used Rive’s file format, increasing animation complexity resulted in significantly larger export file sizes, creating performance and hosting challenges.

This led to Dub’s Founding Designer, Marcus Farrell, rebuilding the animations and exporting them as Lottie files. The transition transformed motion from a bottleneck into a competitive advantage:

• Significant Cost Reduction: Saved nearly US$1,000 per month in bandwidth costs by replacing oversized animation files with optimized Lottie JSON and dotLottie formats.
  
  

• Drastic Performance Gains: Reduced animation file sizes from 5MB (Rive) to ultra-compact Lottie files, resulting in instant loading times, zero lag, and smoother transitions across all devices.
  
  

• Engineering Efficiency: Eliminated the "rebuild burden" associated with Rive’s complex layout management, switching to a production-ready Lottie ecosystem that offers better compression tools and more reliable scalability.
  
  

The Problem: The Hidden Cost of “Heavy” Motion

Design is central to how Dub explains complex workflows. But during their homepage redesign, the team hit a wall. During a major site redesign, Dub launched with Rive-based animations that worked well for their initial needs. However, as the brand matured and their product surface expanded, the team began questioning whether those file sizes and workflows would scale sustainably over time.

What worked at launch didn’t necessarily guarantee long-term performance as the site’s motion needs grew. In one instance, layouts became unmanageable. A single ungrouping error forced a complete rebuild of a core dashboard animation. Most critically, exports ballooned to 5MB and there were no clear options for compressing or optimizing those files, which made self hosting impractical.

"Our image sizes ranged from 11kb to 50kb but exported Rive's file sizes were too large to host on the site. It was disappointing because they did not have many options for image optimization or compression," said Marcus.

Additionally, support was limited, and troubleshooting issues took more time than the team could afford.

As the redesigned homepage gained traction with promotions, the problem became more visible. Increased traffic meant that large animation files were being downloaded repeatedly. Bandwidth usage climbed quickly, and hosting costs rose along with it. What started as a design challenge turned into a broader performance and cost issue. Animation was supposed to improve the experience, but it was now creating a measurable burden for the business.

The Solution: Lottie as a Production-Ready Ecosystem

When performance issues threatened the project, Marcus turned to Lottie to rebuild. The change reduced file sizes and allowed animations to load instantly across devices, even under heavy traffic.

By moving to Lottie, Dub traded tool-induced fragility to a more stable and predictable motion setup that was easier to maintain at scale. They moved away from troubleshooting infrastructure and back to designing meaningful experiences. With Lottie, motion is no longer a high-maintenance liability; it’s a performant, scalable asset that works every time, at a fraction of the weight.

After sharing these performance gains on social media, Nattu, the CTO of LottieFiles, sent him a message to suggest further optimizations. This led to a technical exchange where Nattu helped Marcus implement from dotLottie (.lottie) to the optimized json format, which improved efficiency at scale. For the Dub team, the experience was a practical example of how a technical update can lead to unexpected collaboration.

The Impact: From Cost Fix to Long Term Motion Strategy

What happens when your design ambition outpaces your performance budget? Dub solved this by standardizing on LottieFiles, the production-ready format for high-growth product teams.

Beyond saving $1,000 a month in bandwidth, the switch gave the team something more valuable: Confidence. With predictable performance and the optimized lottie format, motion is no longer a technical risk; it’s a core product pillar. No more visible lag. No more infrastructure headaches. Just a smooth, scalable workflow that lets designers be designers and engineers stay focused on shipping.

With their homepage and dashboard animations fully optimized, Dub has moved beyond just solving a bandwidth problem. They intend to standardize on Lottie as their default format for all future motion work, starting with a complete overhaul of dashboard iconography using dotLottie.

What began as a tactical fix for rising costs has evolved into a deliberate, long-term motion strategy. By adopting a format built specifically for speed and scale, the Dub team regained control over their design-to-engineering handoff.

For Dub, LottieFiles isn't just about smaller files; it’s about a performance-safe workflow that allows them to use animation as a core product pillar without technical debt. Motion now does its job exactly as intended: enhancing the user experience without ever slowing it down.

Next step

Looking ahead, Dub plans to continue using the Lottie format for all complex marketing site animations. By using Lottie for interactive icons and subtle motion details, they’re able to carry a consistent visual language throughout their product.