image-optimization-cdn
Image Optimization CDN
Overview
Product images are typically the largest assets on e-commerce pages and the single biggest contributor to poor Largest Contentful Paint (LCP) scores. An optimized image pipeline resizes images to the required dimensions, converts to modern formats (WebP, AVIF) for 30–50% smaller file sizes, delivers from a CDN close to the user, and applies lazy loading to images below the fold.
When to Use This Skill
- When product pages fail Core Web Vitals due to large or unoptimized images (LCP > 2.5s)
- When setting up an image pipeline for a new headless storefront
- When original product images from vendors are multi-megabyte files that need automation
- When adding WebP/AVIF support to an existing storefront that serves only JPEG/PNG
- When measuring Core Web Vitals and images are the primary bottleneck
Core Instructions
Step 1: Determine your platform and available image optimization
More from finsilabs/awesome-ecommerce-skills
product-comparison
Let shoppers select multiple products and compare them side-by-side in a table with highlighted differences to help them make the right buying decision
115international-shipping
Handle cross-border orders with customs form generation, duties and taxes estimation, HS code assignment, and restricted items blocking
109tiktok-shop-integration
Sync your product catalog to TikTok Shop, manage orders and inventory, and enable shoppable content with live shopping and affiliate creator programs
98inventory-tracking
Track stock levels in real time across your platform with inventory reservation to prevent overselling and support for backorders
86sales-reporting-dashboard
Build executive dashboards showing revenue, average order value, conversion rates, and cohort analysis with drill-down by date and channel
84gift-cards
Sell and accept gift cards with secure code generation, real-time balance tracking, partial redemption support, and expiration enforcement
81