Beste forumleden,

Ik heb een vraag over "Image Caching".

Ik ben bezig met het maken van een (hobby) website waarop ik feeds inlaad van dagaanbiedingen.
In de feeds komen afbeeldingen voor. De ene afbeelding is 1024x1024 en de ander 256x480.
Met CSS zorg ik ervoor dat ze gescaled worden, alleen dan blijft de issue nog over dat de afbeeldingen continu ingeladen moeten worden en dat de grootte van de afbeelding een rol speelt bij de laadtijd van de website (onnodig grootte afbeeldingen inladen).

Nu heb ik gehoord van image caching, die ervoor zorgt dat een afbeelding wordt opgeslagen en gescaled op de server en deze wordt ingeladen op de website.
Nu is de vraag wie weet hoe ik dit kan doen?

Hopelijk kunnen jullie mij wegwijs erin geven.

Kevin

In het kort werkt dit als volgt:

1. upload je pics in bv. /foto/fotonaam.jpg
2. link in de html naar je pics bv: /foto/640x480/fotonaam.jpg
3. maak een .htaccess rule om foto/640x480/fotonaam.jpg te redirecten naar /cache/640x480/fotonaam.jpg
4. maak een .htaccess rule om /cache/640x480/fotonaam.jpg te redirecten naar een imageconversie script dat de foto converteert op basis van de grootte in de link en deze in een /cache/640x480 directory plaats. Dit script wordt dan alleen uitgevoerd als je pic nog niet in de /cache/... staat.

En zorg dat je vóór de htaccess rules in 3 en 4 nog een rule hebt zoals:

RewriteCond %{REQUEST_FILENAME} -f
RewriteRule ^(.*)$ - [L]

Het voordeel is duidelijk. Je kunt on-the-fly imagesizes in je html wijzigen en het wordt automatisch aangepast en je images in de html zijn geen pixel groter dan nodig is.

Beste John,

Bedankt voor de snelle reactie.
Ik gebruik Joomla voor de website, is daar ook een component/plugin voor die dus de extern ingeladen afbeeldingen omzet?

En heb een script gevonden die de on the fly imageconversie uitvoerd...
http://joedesigns.com/v22/?page=scripts_widgets&id=67

Origineel gepost door John Timmer

In het kort werkt dit als volgt:

1. upload je pics in bv. /foto/fotonaam.jpg
2. link in de html naar je pics bv: /foto/640x480/fotonaam.jpg
3. maak een .htaccess rule om foto/640x480/fotonaam.jpg te redirecten naar /cache/640x480/fotonaam.jpg
4. maak een .htaccess rule om /cache/640x480/fotonaam.jpg te redirecten naar een imageconversie script dat de foto converteert op basis van de grootte in de link en deze in een /cache/640x480 directory plaats. Dit script wordt dan alleen uitgevoerd als je pic nog niet in de /cache/... staat.

En zorg dat je vóór de htaccess rules in 3 en 4 nog een rule hebt zoals:

RewriteCond %{REQUEST_FILENAME} -f
RewriteRule ^(.*)$ - [L]

Het voordeel is duidelijk. Je kunt on-the-fly imagesizes in je html wijzigen en het wordt automatisch aangepast en je images in de html zijn geen pixel groter dan nodig is.

Van Joomla weet ik niks, maar daar zijn vast ook wel plugins voor.
Het enige 'nadeel' van die plugin lijkt me dat je a) voor elk image de resize functie moet aanroepen waarbij bovenstaande slechts een redirect naar het reeds gecachte image is. Zal iets meer overhead zijn maar aangezien Joomla daar toch al vol mee zit zul je het in de praktijk wellicht niet merken.
En b) de plugin werkt op dezelfde server dan waar je de Joomla zelf al draait terwijl je met bovenstaande heel gemakkelijk het hele imageverhaal kunt offloaden naar een andere server.

Natuurlijk ben je met een kant en klare plugin een stuk sneller klaar, dus het lijkt me ruim voldoende omdie te gebruiken.

Ter info...

Ik maak gebruik van joomla en component van Affilatiefeeds, waarin ze het kort en bondig uitleggen: http://www.affiliatefeeds.nl/faq/27-...eeldingen.html

Wie kan tips tricks oid geven hoe te implementeren in dit systeem?