Are my Lottie files uploaded to a server?

No. TinyLottie processes everything locally in your browser using JavaScript and WebAssembly. Your files never leave your device, ensuring 100% privacy.

What is dotLottie format?

dotLottie is an open-source binary format that packages Lottie JSON and its assets into a single ZIP-compressed .lottie file. It is typically 30–40% smaller than raw Lottie JSON and is supported by LottieFiles, DotLottie players, and most modern animation libraries.

How do I reduce Lottie file size in Webflow?

Export your Lottie JSON from After Effects using Bodymovin, then upload it to TinyLottie at tinylottie.com. TinyLottie removes metadata, rounds coordinate precision, and compresses embedded images. After optimization, upload the smaller file to Webflow to improve Core Web Vitals scores.

How do I optimize Lottie animations for React Native?

Use TinyLottie to compress your Lottie JSON before bundling it in your React Native project. TinyLottie removes runtime-unnecessary properties (layer names, match names) and rounds float precision, reducing JS thread parse time. For best results, also consider the dotLottie output format supported by @lottiefiles/dotlottie-react-native.

How do I compress After Effects JSON exports?

After exporting from After Effects using the Bodymovin plugin, upload the JSON file to TinyLottie. TinyLottie strips Bodymovin metadata (nm, mn, cl properties), rounds float precision from 6 to 3 decimal places, and converts embedded raster assets to WebP. Most AE exports see 50–85% file size reduction.

Yes. TinyLottie is free forever for Lottie and dotLottie files up to 3MB. A one-time Lifetime PRO upgrade ($99) unlocks unlimited file sizes with no subscriptions.

Zero Server Uploads · 100% In-Browser Compression

Free Lottie Compressor

Compress Lottie JSON and dotLottie animations directly in your browser. Reduce file size up to 98%, preview results and download optimized files.

Offline Privacy .json & .lottie Fast Web Vitals Free up to 3 MB

Drag & drop your Lottie file here

or click to browse

Supports .json and .lottie files

Step-by-Step Guide

How to Compress a Lottie File

Follow this straightforward workflow to trim excess payload from your animation exports:

Export from Your Design Tool

Export your composition as Lottie JSON from Adobe After Effects via Bodymovin, Figma (LottieFiles plugin), or LottieLab.

Drop Into TinyLottie

Drag and drop the exported .json or .lottie file above. The parser validates the AST tree locally in your browser.

Preview & Download

Review the side-by-side playback preview, select your desired export format (JSON or dotLottie), and click Download.

Format Specifications

Supported Lottie Formats

TinyLottie provides cross-format optimization and conversion between standard Lottie architectures:

Lottie JSON (.json)

The universal standard for web, iOS, Android, and Webflow. TinyLottie removes redundant JSON keys, trims decimal places, and strips developer layer metadata while preserving full playback compatibility.

Compatible with lottie-web, react-lottie, and mobile SDKs
Standard UTF-8 JSON text representation

dotLottie (.lottie)

A modern open-source container format that packages animation JSON, state machines, and raster assets into a compressed Deflate archive. Delivers up to 50% smaller sizes than standalone JSON files.

Deflate binary compression with manifest indexing
Fast network streaming and reduced memory footprint

Engine Architecture

What Optimization Changes Under the Hood

TinyLottie applies deterministic AST parsing algorithms designed to safely strip non-essential byte weight:

1. Editor Metadata & Non-Visual Node Pruning

Bodymovin and After Effects export internal layer names (nm), match names (mn), and class names (cl) for every layer and shape group. TinyLottie strips these strings completely because the Lottie web/mobile runtimes do not use them to draw frames.

2. Coordinate & Float Precision Truncation

Graphic software often stores bezier control points and transform matrix values with 6 to 8 floating-point decimal places (e.g. 241.98471203). TinyLottie rounds float coordinates to 3 decimals, which is visually imperceptible to human eyes but dramatically reduces character counts across thousands of keyframes.

3. In-Browser WebP Raster Transcoding

When animations contain embedded raster assets (such as logos, photo textures, or raster gradients encoded in base64 PNG/JPEG), TinyLottie passes them through an in-memory HTML5 Canvas pipeline, converting them to high-density WebP format—cutting asset payload by 50% to 70%.

Performance Insight

Why Do Compression Results Vary?

The exact reduction percentage depends heavily on the structure of the input animation:

High Keyframe Density: Animations with baked per-frame positions or expressions see the highest reduction from decimal truncation.
Embedded Bitmaps: Files with uncompressed base64 PNGs benefit heavily from WebP transcoding.
Minimal Vector Rigs: Hand-crafted animations with few layers already have small footprints, resulting in moderate percentage gains.

Verification

How to Verify Your Gains

You can easily verify the performance advantages of your compressed Lottie files:

Chrome DevTools: Open the Network tab and observe transfer size and response times when loading the compressed file.

Core Web Vitals: Measure Largest Contentful Paint (LCP) and Total Blocking Time (TBT) in Lighthouse or PageSpeed Insights.

100% In-Browser Privacy Guarantee

Your confidential animations and unreleased product UI never leave your computer.

Many online file compression tools upload customer files to remote cloud storage or third-party servers. TinyLottie operates strictly inside your browser environment. All JSON parsing, float rounding, and WebP encoding happen directly in your browser tab's memory.

Got Questions?

Frequently Asked Questions

Everything you need to know about compressing Lottie animations with TinyLottie: