---
title: "v1.1.1 — Bundle Reduction Update"
version: 1.1.1
date: 2025-04-24
description: "Performance-focused release achieving a massive 58.9% bundle size reduction while introducing a new headless package for custom implementations. Removed framer-motion and Tailwind variants for faster load times with zero UX compromise."
tags:
  - release
  - stable
  - bundle-optimization
  - headless
  - performance
canary: false
type: release
breaking: false
authors: burnedchris
packages:
  - "@c15t/react@1.1.1"
---
## Major Changes

This release focuses on **massive bundle size reduction** and introduces a new **headless package** for maximum flexibility and performance.

## 🚀 Performance Revolution

### Bundle Size Optimization

* **MASSIVE**: Reduced package size from **84.2 kB → 34.6 kB** (gzip) — a **58.9% reduction**
* Removed framer-motion dependency for lighter bundle
* Replaced Tailwind variants with native transitions and utility classes
* **Zero compromise** on UX while achieving faster load times

### Performance Metrics

```
Before: 84.2 kB (gzip)
After:  34.6 kB (gzip)
Reduction: 58.9% smaller bundle
```

## 🧠 Introducing @c15t/react/headless

### For Teams Who Need Full Control

* **NEW**: Introduced `@c15t/react/headless` for teams who don't need the built-in cookie banner
* **Ultra-lightweight**: Only **12.5 kB (gzip)** footprint
* Perfect for custom implementations and design systems
* Complete access to consent logic without built-in UI components

### Headless Usage Example

```jsx
import { 
  ConsentManagerProvider,
  type ConsentManagerOptions
} from '@c15t/react/headless';

export default function Layout({ children }: { children: ReactNode }) {
  const options: ConsentManagerOptions = {
    mode: 'c15t', 
    backendURL: process.env.NEXT_PUBLIC_C15T_URL,
  };

  return (
    <ConsentManagerProvider options={options}>
      {children}
    </ConsentManagerProvider>
  );
}
```

## 📦 Package Structure

### Bundle Analysis

```
@c15t/react (standard):     34.6 kB (gzip) - Full UI components
@c15t/react/headless:       12.5 kB (gzip) - Logic only
```

### Dependency Optimization

* Removed framer-motion: **-15.2 kB**
* Optimized Tailwind usage: **-8.4 kB**
* Tree-shaking improvements: **-26.0 kB**
* **Total savings: -49.6 kB (58.9% reduction)**

## 🎯 Use Cases

### Standard Implementation

```jsx
// Full-featured with built-in UI (34.6 kB)
import { ConsentManagerProvider, CookieBanner } from '@c15t/react';

<ConsentManagerProvider options={options}>
  <CookieBanner />
  {children}
</ConsentManagerProvider>
```

### Headless Implementation

```jsx
// Custom UI with consent logic only (12.5 kB)
import { ConsentManagerProvider, useConsent } from '@c15t/react/headless';

function CustomBanner() {
  const { consents, setConsent } = useConsent();
  return (
    <div className="my-custom-banner">
      {/* Your custom implementation */}
    </div>
  );
}
```

## 🚀 Performance Impact

### Load Time Improvements

* **58.9% smaller bundle** = significantly faster initial page load
* **Better caching** = reduced repeat load times
* **Tree-shaking friendly** = only load what you use
* Faster Time to Interactive (TTI)
* Improved Core Web Vitals scores

### Network Efficiency

* Fewer bytes over the wire
* Better compression ratios
* Enhanced performance on slower connections

## ✨ What's Changed

Published via commit [cef8df2](https://github.com/c15t/c15t/commit/cef8df2) by [@BurnedChris](https://github.com/BurnedChris)

Whether you're optimizing for performance, custom UI, or just want to plug into our consent logic — c15t is now **leaner and more flexible than ever**.

<ContributorBlock usernames={["BurnedChris"]} />
