Bunny CDN Demo Logo Bunny CDN Demo

Showcase Detail

Seeded Bunny Showcase

Beispiel-Datensatz fuer die Bunny-CDN-Demo. Die Detailseite zeigt statische Assets aus app/assets sowie Active-Storage-Uploads ueber Bunny-URLs und die relevanten Helper des Gems.

Bearbeiten Zurueck

Runtime

Gem-Konfiguration

enhance_image_tag
true
upload_strategy
mapping
uploads_prefix
uploads-demo
uploads_zone_url
https://bunnydemouploads.b-cdn.net
default_quality
Bunny-Dashboard
delivery_path
Direkter Bucket-Key
mapped_images
Auto mit optimizer=image
opt_out
image_tag(..., bunny: false)

Uploads

Aktueller Datensatz

  • Hero Image: angehaengt
  • Download-Datei: angehaengt
  • Dateiname Download: bunny-demo-notes.txt

User Uploads

Vergleichbare Upload-Demos

Erst kommt die Baseline mit Opt-out gegen CDN-Default. Danach folgen drei Transformationen, die wir ueber enhance_image_tag, bunny_image_tag und cl_image_tag gegeneinander halten.

Baseline

Gleicher Upload, vier Einstiege

Links steht der reine Rails-Opt-out. Rechts sollten enhance_image_tag, bunny_image_tag und cl_image_tag ohne Transformation auf dieselbe Bunny-URL hinauslaufen.

Alle drei Bunny-Einstiege liefern dieselbe CDN-URL.

Active Storage direkt

Opt-out ohne Bunny

Seeded Bunny Showcase direkt ueber Active Storage

/rails/active_storage/blobs/proxy/eyJfcmFpbHMiOnsiZGF0YSI6MSwicHVyIjoiYmxvYl9pZCJ9fQ==--1383d1a8420d4ba3b4a9635559b92b6ed8bc6c0d/upload-sample.png

enhance_image_tag

CDN-Default

Seeded Bunny Showcase via enhance_image_tag

https://bunnydemouploads.b-cdn.net/dgix4z8aql31zu6cgh9u8ebvohxo?optimizer=image

bunny_image_tag

Native Bunny-API

Seeded Bunny Showcase via bunny_image_tag

https://bunnydemouploads.b-cdn.net/dgix4z8aql31zu6cgh9u8ebvohxo?optimizer=image

cl_image_tag

Compat-Helper

Seeded Bunny Showcase via cl_image_tag

https://bunnydemouploads.b-cdn.net/dgix4z8aql31zu6cgh9u8ebvohxo?optimizer=image

Resize + Crop

440 x 300, crop fill

Der haeufigste CMS-Fall: drei Helper, ein Ausschnitt, eine erwartete URL.

Alle drei Bunny-Einstiege liefern dieselbe CDN-URL.

enhance_image_tag

Rails image_tag

Seeded Bunny Showcase via enhance_image_tag - 440 x 300, crop fill

https://bunnydemouploads.b-cdn.net/dgix4z8aql31zu6cgh9u8ebvohxo?crop=440,300&optimizer=image

bunny_image_tag

Native Helper

Seeded Bunny Showcase via bunny_image_tag - 440 x 300, crop fill

https://bunnydemouploads.b-cdn.net/dgix4z8aql31zu6cgh9u8ebvohxo?crop=440,300&optimizer=image

cl_image_tag

Compat Helper

Seeded Bunny Showcase via cl_image_tag - 440 x 300, crop fill

https://bunnydemouploads.b-cdn.net/dgix4z8aql31zu6cgh9u8ebvohxo?crop=440,300&optimizer=image

Cloudinary-Mapping

Graustufen ueber effect: :grayscale

Hier leistet die Compat-Schicht echte Uebersetzungsarbeit: Cloudinary-Effekt rein, Bunny-Parameter raus.

Alle drei Bunny-Einstiege liefern dieselbe CDN-URL.

enhance_image_tag

Rails image_tag

Seeded Bunny Showcase via enhance_image_tag - Graustufen ueber effect: :grayscale

https://bunnydemouploads.b-cdn.net/dgix4z8aql31zu6cgh9u8ebvohxo?optimizer=image&saturation=-100

bunny_image_tag

Native Helper

Seeded Bunny Showcase via bunny_image_tag - Graustufen ueber effect: :grayscale

https://bunnydemouploads.b-cdn.net/dgix4z8aql31zu6cgh9u8ebvohxo?optimizer=image&saturation=-100

cl_image_tag

Compat Helper

Seeded Bunny Showcase via cl_image_tag - Graustufen ueber effect: :grayscale

https://bunnydemouploads.b-cdn.net/dgix4z8aql31zu6cgh9u8ebvohxo?optimizer=image&saturation=-100

Direkter Bunny-Parameter

Tint aaffff

Nicht alles braucht Uebersetzung. Manche Optionen werden durch die Compat-Schicht einfach direkt an Bunny weitergereicht.

Alle drei Bunny-Einstiege liefern dieselbe CDN-URL.

enhance_image_tag

Rails image_tag

Seeded Bunny Showcase via enhance_image_tag - Tint aaffff

https://bunnydemouploads.b-cdn.net/dgix4z8aql31zu6cgh9u8ebvohxo?optimizer=image

bunny_image_tag

Native Helper

Seeded Bunny Showcase via bunny_image_tag - Tint aaffff

https://bunnydemouploads.b-cdn.net/dgix4z8aql31zu6cgh9u8ebvohxo?optimizer=image

cl_image_tag

Compat Helper

Seeded Bunny Showcase via cl_image_tag - Tint aaffff

https://bunnydemouploads.b-cdn.net/dgix4z8aql31zu6cgh9u8ebvohxo?optimizer=image

Download-Datei

PDF und andere Dateien testen

Hier kannst du die zweite Datei direkt einmal ueber Bunny und einmal ohne CDN aufrufen.

bunny-demo-notes.txt via Bunny Ohne Bunny oeffnen
Bunny
https://bunnydemouploads.b-cdn.net/jemojpi3dzr7pv5yy4dsluh0n317
Active Storage
/rails/active_storage/blobs/proxy/eyJfcmFpbHMiOnsiZGF0YSI6MiwicHVyIjoiYmxvYl9pZCJ9fQ==--fd0ca1b1932f318d3c36ba8c184ff09b499c7630/bunny-demo-notes.txt

Helper Output

Relevante Upload-Helper

Native Bunny-Upload-Helper

bunny_upload_url
https://bunnydemouploads.b-cdn.net/dgix4z8aql31zu6cgh9u8ebvohxo?width=600&optimizer=image
rails_storage_proxy_path
/rails/active_storage/blobs/proxy/eyJfcmFpbHMiOnsiZGF0YSI6MSwicHVyIjoiYmxvYl9pZCJ9fQ==--1383d1a8420d4ba3b4a9635559b92b6ed8bc6c0d/upload-sample.png
bunny_download_url
https://bunnydemouploads.b-cdn.net/jemojpi3dzr7pv5yy4dsluh0n317

Cloudinary-Kompatibilitaet

cl_path
https://bunnydemouploads.b-cdn.net/dgix4z8aql31zu6cgh9u8ebvohxo?crop=320,220&optimizer=image
cl_image_path
https://bunnydemouploads.b-cdn.net/dgix4z8aql31zu6cgh9u8ebvohxo?width=240&optimizer=image
cloudinary_url
https://bunnydemouploads.b-cdn.net/dgix4z8aql31zu6cgh9u8ebvohxo?width=640&optimizer=image
cl_image_tag
Siehe Vergleichsbloecke oben.