CDN-old - Configuration CDN de W3TotalCache
... / Configuration CDN de W3To...
BMPCreated with Sketch.BMPZIPCreated with Sketch.ZIPXLSCreated with Sketch.XLSTXTCreated with Sketch.TXTPPTCreated with Sketch.PPTPNGCreated with Sketch.PNGPDFCreated with Sketch.PDFJPGCreated with Sketch.JPGGIFCreated with Sketch.GIFDOCCreated with Sketch.DOC Error Created with Sketch.
Frage

Configuration CDN de W3TotalCache

Von
FredericR1
Erstellungsdatum 2017-02-11 21:56:55 (edited on 2024-09-04 14:00:32) in CDN-old

Le support OVH est très incompétent quand on les sollicite par ticket, par téléphone parfois on tombe bien.
Ils ne sont pas fichus capables de me dire comment configurer W3TotalCache pour la partie CDN.

Je précise, que je suis sur une offre Performance Mutualisée, et donc je dispose du CDN mutualisé.
Mais je voudrais que les contenus dynamiques (images) soient dans le CDN.
Seulement voilà, aucune idée comment configurer W3TotalCache, notamment quel CDN choisir parmi ceux qu'ils proposent... Le comble c'est que le support me dirige vers un lien où il est dit " W3TotalCache est un plugin que l'on conseille pour utiliser le CDN OVH" mais nul part il n'est écrit comment le configurer ...


23 Antworten ( Latest reply on 2017-02-13 19:38:52 Von
FredericR1
)

Bonjour,

il n'y a rien a configurer pour le CDN mutu car il est transparent et se positionne automatiquement entre le client et le cluster mutualisé en France.

Par exemple vi votre visiteur est au canada les fichiers statique il les recevra du CDN de BHS et le contenu dynamique de P19 ou GRA selon votre cluster.

Cordialement, janus57


Mais je voudrais que les contenus dynamiques (images) soient dans le CDN.


Ce sont des contenus dit statiques et pas dynamiques.... Par définition un contenu statique ne varie pas et peut donc être stocké sur le CDN alors qu'un contenu dynamique est généré à chaque visite.

Il n'y a pas besoin de ce plug in pour le CDN Mutualisé ovH. Le CDN est inclus dans l'infrastructure ce n'est pas un CDN ajouté.

Pour la documentation ovh... Elle n'est pas toujours fiable malheureusement.

Je pense a contrario que le CDN gagnerait à être piloté par W3TotalCache pour ce qui est des images que l'on uploade dans la bibliothèque de media (sous wpcontent/upload) ...

Si les images sont directement uploadées vers le CDN, (par quelle magie ? est-ce instantané ? un script toutes les nuits ?) je ne pense pas que le vidage de cache que l'on opère par W3TotalCache soit effectif sur le CDN; il y a bien le besoin de lier les deux, non ?

Quand un visiteur visite ton site, çà fait

Visiteur <=> CDN OVH <=> Ton serveur.

Le CDN OVH analyse les requêtes et si c'est un fichier statique, il le met en cache en fonction de la durée déterminée par le serveur.

Je ne connais pas ton plug in donc je ne sais pas comment il s'interface avec le CDN OVH (ni même si il s'interface tout court).

Le plugin entre autre rajoute des lignes dans .htaccess pour mettre en cache les images (directive expire on)
(il rajoute aussi des directives gzip, deflate, ...)

Sa description: https://fr.wordpress.org/plugins/w3-total-cache/

le mode d'intégration est bien expliqué ici:
https://www.keycdn.com/support/wordpress-cdn-integration-with-w3-total-cache/


je pense d'ailleurs que c'est la bonne façon de le configurer avec le cdn mutualisé, mais le cname à utiliser je ne le connais pas ...

Le principe est donc de transformer le modèle
Visiteur <=> CDN OVH <=> Ton serveur

en
Navigateur Visiteur <=> Ton serveur pour les fichiers hors CDN
Navigateur Visiteur <=> CDN OVH pour les fichiers dans le CDN

OVH suggère l'utilisation de W3TC d'ailleurs: (§ comment mettre en cache les fichiers du document suivant
https://docs.ovh.com/fr/fr/web/hosting/accelerer-mon-site-web-en-utilisant-le-cdn/ )

même si c'est effectivement optionnel car on peut aussi le faire via directive .htaccess, ce que j'ai fait, mais google page speed insights me remonte que certains fichiers ne sont pas cachés dans le navigateur, alors j'ai des doutes sur le fait que mon fichier .htaccess soit bien pris en compte ... donc j'essaye l'autre mode de mise en cache, j'aurais plus confiance ...

pour vérifier si les images sont bien mises en cache gtmetrix permet de le savoir par exemple. Si les images sont bien mises en cache, https://gtmetrix.com mettra une bonne note pour la ligne "Leverage browser caching"

Quel code a été ajouté au .htaccess pour la mise en cache ?

```text voici en pièce jointe le résultat GT metrix par ailleurs à la racine du site[Envoi en cours…]. On dirait que les images sont bien en cache oui, il m'alerte plus sur des fichiers js ou css.

Concernant le fichier .htaccess en voici un extrait:



ce que W3TC rajoute:
# BEGIN W3TC Browser Cache

AddType text/css .css
AddType text/x-component .htc
AddType application/x-javascript .js
AddType application/javascript .js2
AddType text/javascript .js3
AddType text/x-js .js4
AddType text/html .html .htm
AddType text/richtext .rtf .rtx
AddType image/svg+xml .svg
AddType text/plain .txt
AddType text/xsd .xsd
AddType text/xsl .xsl
AddType text/xml .xml
AddType video/asf .asf .asx .wax .wmv .wmx
AddType video/avi .avi
AddType image/bmp .bmp
AddType application/java .class
AddType video/divx .divx
AddType application/msword .doc .docx
AddType application/vnd.ms-fontobject .eot
AddType application/x-msdownload .exe
AddType image/gif .gif
AddType application/x-gzip .gz .gzip
AddType image/x-icon .ico
AddType image/jpeg .jpg .jpeg .jpe
AddType image/webp .webp
AddType application/json .json
AddType application/vnd.ms-access .mdb
AddType audio/midi .mid .midi
AddType video/quicktime .mov .qt
AddType audio/mpeg .mp3 .m4a
AddType video/mp4 .mp4 .m4v
AddType video/mpeg .mpeg .mpg .mpe
AddType application/vnd.ms-project .mpp
AddType application/x-font-otf .otf
AddType application/vnd.ms-opentype ._otf
AddType application/vnd.oasis.opendocument.database .odb
AddType application/vnd.oasis.opendocument.chart .odc
AddType application/vnd.oasis.opendocument.formula .odf
AddType application/vnd.oasis.opendocument.graphics .odg
AddType application/vnd.oasis.opendocument.presentation .odp
AddType application/vnd.oasis.opendocument.spreadsheet .ods
AddType application/vnd.oasis.opendocument.text .odt
AddType audio/ogg .ogg
AddType application/pdf .pdf
AddType image/png .png
AddType application/vnd.ms-powerpoint .pot .pps .ppt .pptx
AddType audio/x-realaudio .ra .ram
AddType image/svg+xml .svg .svgz
AddType application/x-shockwave-flash .swf
AddType application/x-tar .tar
AddType image/tiff .tif .tiff
AddType application/x-font-ttf .ttf .ttc
AddType application/vnd.ms-opentype ._ttf
AddType audio/wav .wav
AddType audio/wma .wma
AddType application/vnd.ms-write .wri
AddType application/font-woff .woff
AddType application/font-woff2 .woff2
AddType application/vnd.ms-excel .xla .xls .xlsx .xlt .xlw
AddType application/zip .zip


ExpiresActive On
ExpiresByType text/css A31536000
ExpiresByType text/x-component A31536000
ExpiresByType application/x-javascript A31536000
ExpiresByType application/javascript A31536000
ExpiresByType text/javascript A31536000
ExpiresByType text/x-js A31536000
ExpiresByType text/html A3600
ExpiresByType text/richtext A3600
ExpiresByType image/svg+xml A3600
ExpiresByType text/plain A3600
ExpiresByType text/xsd A3600
ExpiresByType text/xsl A3600
ExpiresByType text/xml A3600
ExpiresByType video/asf A31536000
ExpiresByType video/avi A31536000
ExpiresByType image/bmp A31536000
ExpiresByType application/java A31536000
ExpiresByType video/divx A31536000
ExpiresByType application/msword A31536000
ExpiresByType application/vnd.ms-fontobject A31536000
ExpiresByType application/x-msdownload A31536000
ExpiresByType image/gif A31536000
ExpiresByType application/x-gzip A31536000
ExpiresByType image/x-icon A31536000
ExpiresByType image/jpeg A31536000
ExpiresByType image/webp A31536000
ExpiresByType application/json A31536000
ExpiresByType application/vnd.ms-access A31536000
ExpiresByType audio/midi A31536000
ExpiresByType video/quicktime A31536000
ExpiresByType audio/mpeg A31536000
ExpiresByType video/mp4 A31536000
ExpiresByType video/mpeg A31536000
ExpiresByType application/vnd.ms-project A31536000
ExpiresByType application/x-font-otf A31536000
ExpiresByType application/vnd.ms-opentype A31536000
ExpiresByType application/vnd.oasis.opendocument.database A31536000
ExpiresByType application/vnd.oasis.opendocument.chart A31536000
ExpiresByType application/vnd.oasis.opendocument.formula A31536000
ExpiresByType application/vnd.oasis.opendocument.graphics A31536000
ExpiresByType application/vnd.oasis.opendocument.presentation A31536000
ExpiresByType application/vnd.oasis.opendocument.spreadsheet A31536000
ExpiresByType application/vnd.oasis.opendocument.text A31536000
ExpiresByType audio/ogg A31536000
ExpiresByType application/pdf A31536000
ExpiresByType image/png A31536000
ExpiresByType application/vnd.ms-powerpoint A31536000
ExpiresByType audio/x-realaudio A31536000
ExpiresByType image/svg+xml A31536000
ExpiresByType application/x-shockwave-flash A31536000
ExpiresByType application/x-tar A31536000
ExpiresByType image/tiff A31536000
ExpiresByType application/x-font-ttf A31536000
ExpiresByType application/vnd.ms-opentype A31536000
ExpiresByType audio/wav A31536000
ExpiresByType audio/wma A31536000
ExpiresByType application/vnd.ms-write A31536000
ExpiresByType application/font-woff A31536000
ExpiresByType application/font-woff2 A31536000
ExpiresByType application/vnd.ms-excel A31536000
ExpiresByType application/zip A31536000


AddOutputFilterByType DEFLATE text/css text/x-component application/x-javascript application/javascript text/javascript text/x-js text/html text/richtext image/svg+xml text/plain text/xsd text/xsl text/xml image/bmp application/java application/msword application/vnd.ms-fontobject application/x-msdownload image/x-icon image/webp application/json application/vnd.ms-access application/vnd.ms-project application/x-font-otf application/vnd.ms-opentype application/vnd.oasis.opendocument.database application/vnd.oasis.opendocument.chart application/vnd.oasis.opendocument.formula application/vnd.oasis.opendocument.graphics application/vnd.oasis.opendocument.presentation application/vnd.oasis.opendocument.spreadsheet application/vnd.oasis.opendocument.text audio/ogg application/pdf application/vnd.ms-powerpoint image/svg+xml application/x-shockwave-flash image/tiff application/x-font-ttf application/vnd.ms-opentype audio/wav application/vnd.ms-write application/font-woff application/font-woff2 application/vnd.ms-excel

# DEFLATE by extension
AddOutputFilter DEFLATE js css htm html xml




Header set X-Powered-By "W3 Total Cache/0.9.5.2"




Header append Vary User-Agent env=!dont-vary
Header set X-Powered-By "W3 Total Cache/0.9.5.2"




Header set X-Powered-By "W3 Total Cache/0.9.5.2"




Header unset Last-Modified


# END W3TC Browser Cache
# BEGIN W3TC Page Cache core

RewriteEngine On
RewriteBase /
RewriteCond %{HTTPS} =on
RewriteRule .* - [E=W3TC_SSL:_ssl]
RewriteCond %{SERVER_PORT} =443
RewriteRule .* - [E=W3TC_SSL:_ssl]
RewriteCond %{HTTP:Accept-Encoding} gzip
RewriteRule .* - [E=W3TC_ENC:_gzip]
RewriteCond %{HTTP_COOKIE} w3tc_preview [NC]
RewriteRule .* - [E=W3TC_PREVIEW:_preview]
RewriteCond %{REQUEST_METHOD} !=POST
RewriteCond %{QUERY_STRING} =""
RewriteCond %{REQUEST_URI} \/$
RewriteCond %{HTTP_COOKIE} !(comment_author|wp\-postpass|w3tc_logged_out|wordpress_logged_in|wptouch_switch_toggle) [NC]
RewriteCond "%{DOCUMENT_ROOT}/wp/wp-content/cache/page_enhanced/%{HTTP_HOST}/%{REQUEST_URI}/_index%{ENV:W3TC_SSL}%{ENV:W3TC_PREVIEW}.html%{ENV:W3TC_ENC}" -f
RewriteRule .* "/wp/wp-content/cache/page_enhanced/%{HTTP_HOST}/%{REQUEST_URI}/_index%{ENV:W3TC_SSL}%{ENV:W3TC_PREVIEW}.html%{ENV:W3TC_ENC}" [L]

# END W3TC Page Cache core


il faut cependant savoir que dans le fichier .htaccess j'ai aussi (avant les rajouts de W3TC), des instructions que j'avais rajouté qui viennent peut être en conflit:

ce que moi j'avais rajouté de base:

##### Headers Expires

ExpiresActive On
ExpiresDefault "access plus 2 days"
ExpiresByType image/jpg "access plus 1 year"
ExpiresByType image/jpeg "access plus 1 year"
ExpiresByType image/png "access plus 1 year"
ExpiresByType image/gif "access plus 1 year"
AddType image/x-icon .ico
ExpiresByType image/ico "access plus 1 year"
ExpiresByType image/icon "access plus 1 year"
ExpiresByType image/x-icon "access plus 1 year"
ExpiresByType text/css "access plus 1 year"

ExpiresByType text/html "access plus 2 days"
ExpiresByType application/xhtml+xml "access plus 2 days"

ExpiresByType text/javascript "access plus 1 month"
ExpiresByType application/javascript A2592000
ExpiresByType application/x-javascript "access plus 1 month"
ExpiresByType application/x-shockwave-flash "access plus 2592000 seconds"



# FRO BEGIN Cache-Control Headers http://www.samaxes.com/2011/05/improving-web-performance-with-apache-and-htaccess/ + enable keep-alive

Header set Connection keep-alive

Header set Cache-Control "max-age=29030400, public"


Header set Cache-Control "max-age=29030400, public"


Header set Cache-Control "max-age=2592000, private"


Header set Cache-Control "private, must-revalidate"


# END FRO Cache-Control Headers ```

D'ailleurs, je pose la question pour le plugin W3TC mais il me semble que le problème de mise en cache des librairies JS et CSS que remontent GTMetrix pourrait être amélioré si je parvenais également à configurer le plugin BWPMinifier de wordpress pour qu'il utilise lui aussi le CDN OVH.
On me demande à ce niveau les éléments suivants:
CDN hostname (primary)
Use either hostnames provided by your CDN or custom ones. Please do NOT include the scheme (i.e. http://or https://). Good examples are: yourzone.yourcdn.com, cdn.yourdomain.com, etc.
CDN hostname for JS files
CDN hostname for CSS files

Idem je ne sais pas ce que je dois renseigner (et si on le peut).

Sans l'URL et sans les Résultats de Gtmetrix sur la mise en cache des fichiers par les navigateurs difficile de savoir..

J'ai transmis les résultats de GTMetrix dans le post précédent ... L'URL vous servirait à quoi ? (je n'ai pas envie de la diffuser sur un forum, même si c'est déjà à moitié fait également)


voici en pièce jointe le résultat GT metrix par ailleurs à la racine du site[Envoi en cours…]. On dirait que les images sont bien en cache oui, il m'alerte plus sur des fichiers js ou css.


Je ne les vois pas.
où sont ils ?


L'URL vous servirait à quoi ?


à charger la page, analyser les headers envoyés avec les images/CSS/JS et voir si ils sont bien mis en cache..

ah visiblement il y a eu une erreur lors de l'attachement de la pièce jointe, je les remets ici:

Sur l'impr écran, on voit bien que les Javascript sont "minifiés" / réduits.
Ils sont une date de mise en cache qui est de l'ordre de 1 Jour. Je trouve personnellement que çà fait peu mais tout les plugins marchent. (par défaut c'est 15 minutes)

Le pire reste quand même les images "rescaled" par CSS, il vaut mieux les réduire avant.

GTmetrix semble anormalement long sur le temps de chargement total du site.
Depuis mon propre PC, en 1ere visite j'obtiens des résultats plus proches de ceux fournis par https://www.dareboost.com (6 à 8 sec pour le chargement total)

oui je ne regarde pas trop le temps global, sachant que j'ai pas mal de js qui sont différés ... Je pourrais effectivement mettre plus de 1j (ce doit être une configuration de BWPMinifier, car je ne crois pas que c'est la config du .htaccess)


Le pire reste quand même les images "rescaled" par CSS, il vaut mieux les réduire avant.


pour cela j'utilise un plugin wp-smush qui est sensé changer la taille à la base.

il n'a pas l'air de marcher ... Puis attention trop de plugin alourdit le traitement php des pages et conduit à l'effet inverse ..

Si il marche, mais je l'avais désactivé, il est possible que certaines images n'aient pas été réduites, et puis cela dépend aussi des configurations écran je suppose. Il est sans effet sur les perfs du site normalement, uniquement en mode admin (c'est un plugin d'admin).

Heu non, çà ne dépend pas des tailles d'écran. Comme tu peux le voir sur ton screenshot de gtmetrix dans l'onglet "serve scaled images", certaines de tes images sont "réduites" par CSS. Ce n'est clairement pas génial.

et donc que faudrait-il mettre en place côté wordpress pour que ce soit évité ? reprendre le thème c'est ça ?

Par exemple, il y a ce message sous Gtmetrix



https://ndd.Fr/wp/wp-content/uploads/2017/02/Elle.jpg is resized in HTML or CSS from 1000x617 to 474x292. Serving a scaled image could save 66.5KiB (77% reduction).

Ça veut dire qu'en taille réelle ton image fait 1000 par 617 et que tu la réduis en 474 292 par des attributs CSS. Tu télécharges donc une image pleine de détails et après tu demandes au pc client de la réduire en 474 x 292. Ça ralentit donc le chargement.

Le mieux est donc de récupérer cette image et de la redimensionner aux bonnes dimensions (474 x 292)

Tu peux faire ça avec paint, gimp, etc.. Ou en ligne via des sites pour.

ok merci, ce que je trouve étonnant, c'est que je soupçonne que ce soit le comportement standard de wordpress ...

Antworten sind derzeit für diese Frage deaktiviert.