Webboptimerad bildleverans web-optimized-image-delivery

Läs om hur Core Components kan utnyttja AEM as a Cloud Service webboptimerade funktioner för bildleverans för att leverera bilder effektivare.

Ökning overview

Den webboptimerade funktionen för bildleverans i AEM som en molntjänst levererar bildresurser från DAM i WebP-format. WebP kan minska hämtningsstorleken för en bild med i genomsnitt 25 %, vilket ger snabbare sidinläsning.

Det är enkelt att aktivera webboptimerad bildleverans i Core Components, och eftersom alla vanliga webbläsare har stöd för WebP blir upplevelsen transparent för slutanvändaren. Den enda skillnaden de kommer att märka är att innehållet laddas snabbare!

Aktivera webboptimerad bildleverans för kärnkomponenter activating

Aktivera webboptimerad bildleverans genom att redigera en sidmall och helt enkelt aktivera alternativet Aktivera webboptimerade bilder i designdialogrutan Bildkomponent. Det här alternativet är tillgängligt för v1, v2 och v3 i Image Component.

Om du inte känner till designdialogrutor och AEM sidmallar kan du kan du läsa det här dokumentet.

Så ja! Bilderna levereras nu med Image Component i WebP-format.

När du har aktiverat webboptimerad bildleverans kanske du vill kontrollera din dispatcherkonfiguration för att verifiera att den inte blockerar begäran till bildleveranstjänsten. Se this FAQ entry för mer information.

Verifierar WebP-leverans verifying

Webboptimerad bildleverans är transparent för konsumenten. Det enda som slutanvändaren kommer att märka är snabbare laddningstid. För att kunna observera eventuella beteendeförändringar måste du därför kontrollera innehållstypen för de återgivna bilderna i webbläsaren. Alla moderna webbläsare har stöd för WebP. Du kan referera till den här webbplatsen om du vill ha information om webbläsarstöd.

När webboptimerad bildleverans inte är tillgänglig fallback

Webboptimerad bildleverans är endast tillgängligt i AEM as a Cloud Service. Om det inte är tillgängligt, t.ex. när AEM 6.5 körs lokalt eller på en lokal utvecklingsinstans, återställs bildleveransen till den adaptiva bildservern.

Om du återgår till den adaptiva bildservern ändras src attributet för img -element i sidkällan.

Vanliga frågor faq

Varför finns det inget alternativ för att aktivera webboptimerade bilder i min miljö? missing-option

Funktionen är bara tillgänglig på AEM as a Cloud Service. Kör AEM lokalt eller lokalt, Image-komponenten faller bakåt till att använda den adaptiva bildservern.

Varför fungerar inte tjänsten med den lokala SDK:n? local-sdk

När AEM SDK används på localhost, bildtjänsten är inte tillgänglig och bildåtergivningen faller bakåt till att använda den adaptiva bildservern.

Om du vill använda den webboptimerade bildleveranstjänsten ska du driftsätta projektet i en AEMaaCS-utvecklingsmiljö och exakt testa hur bildtjänsten fungerar med bildtjänsten.

Varför fungerar inte tjänsten för vissa bilder på min sida? some-images

Bildtjänsten fungerar bara för resurser som finns under /content/dam och det fungerar inte för bilder som laddas upp direkt till sidan och lagras under en cq:Page -objekt. Sådana resurser levereras fortfarande med Adaptive Image Server som en fallback.

Varför visas en bild med sämre kvalitet eller så begränsas bildstorleken? quality

När bildobjekt under /content/dam bearbetas AEM as a Cloud Service miljöer genererar optimerade renderingar med olika dimensioner. Den webboptimerade bildtjänsten analyserar den bredd som Image Core Component kräver, tar hänsyn till den ursprungliga bilden och alla renderingar som är 2 048 pixlar och mindre, och väljer den största av dessa (inom bildtjänsten för storlek och dimensionsbegränsningar kan hantera, för närvarande 50 MB och 12kx12k) som bas för de begärda inställningarna (bredd, beskärning, format, kvalitet osv.).

För att bevara originalets återgivning skalförändras inte bilderna. Ovannämnda återgivningar definierar den bästa kvalitet som bildtjänsten kan leverera. Eftersom du ofta inte kan påverka storleken och/eller dimensionerna på den ursprungliga bildresursen bör du kontrollera att alla bildresurser har en zoomåtergivning på 2 048 pixlar och om de inte gör det, bearbeta om dem.

URL-adressen till bilderna slutar fortfarande med .JPG eller .PNG, inte .WEBP, och det finns inget SRCSET-attribut eller PICTURE-element. Använder detta verkligen optimerade webbformat? content-negotiation

För att leverera WebP-format utför den webboptimerade bildleveranstjänsten serverdriven innehållsförhandling. Detta hjälper till att välja det optimala utdataformatet för bilden baserat på klientens annonserade funktioner, vilket gör att bildleveranstjänsten kan ignorera filtillägget.

Fördelen med att använda innehållsförhandling är att webbläsare som inte annonserar stöd för WebP fortfarande får filformatet JPG eller PNG utan att några ändringar behöver göras i markeringen av sidan. Detta ger optimal kompatibilitet för befintliga webbplatser och garanterar en så smidig övergång som möjligt till webboptimerad bildleverans.

Kan jag använda webboptimerad bildleverans med min egen komponent?

Ja, den webboptimerade bildleveranstjänsten kan användas av anpassade komponenter som byggs av utöka bildkomponenten,

Följande är ett gränssnitt som kan användas för att generera resurs-URL:en.

com.adobe.cq.wcm.spi.AssetDelivery.getDeliveryURL(Resource resource, Map<String, Object> parameterMap)

Kan bilder inte visas när webboptimerade bilder har aktiverats? failure-to-deliver

Nej, det ska aldrig ske av följande skäl.

Dispatcheringsregler kan dock blockera den webboptimerade bildleveranstjänsten. URL:er för bildleveranstjänsten börjar med /adobeoch undersöker avsändarloggarna för avvisade begäranden som beskrivs här bör hjälpa till att felsöka eventuella fel som uppstår när bilderna levereras till webbläsaren.