Gestione di Immagini e Media: Archiviazione S3 con Consegna CDN

Questo articolo spiega come archiviamo, organizziamo e distribuiamo le immagini dei prodotti in modo efficiente.

Il Problema: Gestire Migliaia di Immagini

Abbiamo:

  • Molti SKU di prodotti (5k+) con più immagini ciascuno

  • Immagini dei componenti (10k+) (chassis, schede, accessori)

  • Video di prodotti per i prodotti chiave

  • Multipli formati (WebP per il web, PNG per le schede tecniche)

Archiviare le immagini sul server web causa:

  • Problemi di spazio su disco: Centinaia di GB di immagini

  • Consegna lenta: Limiti di banda del server

  • Nessuna CDN globale: Lenta per gli utenti internazionali

  • Complessità dei backup: Backup di file di grandi dimensioni

La Soluzione: S3 + CloudFront

Utilizziamo AWS S3 per l'archiviazione e CloudFront per la distribuzione:

  • S3: Archiviazione oggetti scalabile con versioning

  • CloudFront: CDN globale per una distribuzione veloce

  • Manifesto delle immagini: Registro centrale delle posizioni delle immagini

  • Formato WebP: Significativamente più piccolo (30-50%) di PNG/JPEG

Archiviazione delle Immagini

Le immagini dei prodotti sono archiviate in S3:

  • Bucket S3: Archiviazione oggetti per i media dei prodotti

  • Formato: WebP per immagini ottimizzate

  • Video: MP4 per i video dei prodotti

  • Manifesto: Registro centrale delle posizioni delle immagini

Reperimento delle Immagini

Le immagini vengono recuperate da S3 utilizzando il manifesto delle immagini:

  1. Manifesto delle immagini: Registro centrale delle posizioni delle immagini
  2. Bucket S3: Immagini dei prodotti archiviate in archiviazione oggetti
  3. Formato WebP: Immagini ottimizzate per un caricamento veloce
  4. Fallback: Immagini segnaposto quando le immagini reali non sono disponibili

Cache delle Immagini

Mettiamo in cache le immagini in memoria:

  • Cache globale: Cache in memoria per le ricerche di immagini

  • Chiave per parte/SKU: Ricerche rapide per identificatore

  • Invalidazione della cache: Quando il magazzino viene aggiornato tramite hook

Struttura della Directory delle Immagini

Le immagini sono organizzate per identificatori di parte:

  • Immagini di parti: Organizzate per ID parte

  • Immagini SKU: Combinazioni di chassis, scheda, WiFi

  • File video: Archiviati insieme alle immagini

Elaborazione delle Immagini

Elaboriamo le immagini per diversi casi d'uso:

  • Immagini complete: Pagine prodotto

  • Immagini ridotte: Schede tecniche (solo la prima immagine)

  • Segnaposto: Fallback quando non sono disponibili immagini

Distribuzione CloudFront

Le immagini vengono distribuite tramite CDN:

  • Cache edge: Posizioni edge in tutto il mondo

  • Latenza ridotta: Gli utenti ricevono i contenuti dal nodo edge più vicino

  • Protezione DDoS: Protezione integrata

Riepilogo

La gestione di immagini e media fornisce:

  • Archiviazione S3: Immagini prodotto, schede tecniche, loghi clienti

  • Formato WebP: Immagini ottimizzate per un caricamento veloce

  • Manifesto delle immagini: Registro centrale delle posizioni delle immagini

  • Caching: Cache in memoria per le prestazioni

  • Distribuzione CloudFront: Distribuzione globale veloce