// project detail

Premium Florist E-Commerce (Kagita Craft)

E-commerce platform for a premium florist solving the core tension between visual richness and page performance. Implements a custom image optimization pipeline and Cloudflare edge infrastructure to deliver a luxury buying experience without performance compromises.

E-CommerceCloudflare CDNWebP OptimizationNuxt 3Responsive DesignOrder Management
Complete2025

// Key Challenges

  • Image-Heavy Catalog: High-resolution flower photography caused 8-12 second load times on mobile, directly killing conversion rates.
  • Security Exposure: Direct server exposure led to crawl bots consuming 40% of bandwidth monthly, inflating hosting costs.
  • Seasonal Traffic Spikes: Valentine's Day and Eid holiday traffic caused server timeouts under 10x normal load.
  • Order Management: No structured system to track incoming orders, resulting in missed deliveries during peak seasons.

// Approach & Solutions

1. Custom Image Optimization Pipeline

Automated WebP conversion with responsive srcset generation reduces image payload by 65-75% compared to original JPEGs, while progressive lazy loading ensures above-the-fold content renders instantly.

2. Cloudflare Edge Infrastructure

Cloudflare's global CDN caches product catalog pages at 200+ edge nodes worldwide, absorbing traffic spikes and eliminating bot bandwidth waste while providing automatic SSL and DDoS mitigation.

3. Integrated Order Management

Structured order dashboard with WhatsApp notification integration alerts the shop owner instantly upon each order, with delivery status tracking and date-based order filtering for peak season management.

// Tech Stack

TechnologyReason
Cloudflare CDN + WAFEdge caching absorbs seasonal traffic spikes without scaling server costs; WAF rules block malicious bots that previously consumed 40% of bandwidth.
WebP + Lazy LoadingWebP delivers 65-75% smaller file sizes vs JPEG at equivalent visual quality; lazy loading defers off-screen images until scroll, reducing initial page payload by 80%.
Vue.js + NuxtSSR ensures product catalog pages are fully indexed by Google Shopping and search engines, critical for organic traffic to a local business e-commerce.

// Results & Business Impact

  • 75% - Image Size Reduction (WebP pipeline cut average product image from 800KB to under 200KB)
  • <1.5s - Catalog Page Load Time (Down from 8-12 seconds on mobile to under 1.5 seconds)
  • 10x - Traffic Spike Tolerance (Cloudflare edge absorbs Valentine's & Eid peak loads without server timeouts)
  • Live - Production Status (Actively serving customers at kagita.my.id)
Interested in a project like this?
Let's discuss your project.
Contact Me