web-dev-qa-db-fra.com

Changement de feuille de style et mise en cache

J'implémente un site qui permet aux utilisateurs de changer de feuille de style (pour montrer une version à contraste élevé pour les personnes malvoyantes). Le sélecteur modifie simplement le <link>ref en fonction de la feuille de style appropriée.

Cependant, je viens de me rendre compte que cela poserait des problèmes lors de l'activation de la mise en cache (soit en utilisant WP Supercache ou W3 Total Cache), car une seule version de la page sera mise en cache et affichée à l'utilisateur.

Des idées sur les solutions possibles?

stylesheetcacheaccessibility
3
anu

Il s'avère que la réponse est assez simple (au moins pour WP Supercache).

  1. Utilisez soit PHP, soit la mise en cache héritée (c'est-à-dire pas mod_rewrite)
  2. Activer l'initialisation tardive (depuis l'interface utilisateur - recommandé, ou en définissant $wp_super_cache_late_init = 1; dans wp-content/wp-cache-config.php
  3. Utilisez la directive <!--dynamic-cached-content--> pour envelopper le contenu qui doit rester dynamique.

Un exemple:

<!--dynamic-cached-content--><?php
    display_high_contrast_link();
?><!--
   display_high_contrast_link();
--><!--/dynamic-cached-content-->

Comme vous pouvez le constater, le contenu dynamique a été ajouté deux fois - à partir de la FAQ de WP Supercache

Le premier code est exécuté lorsque la page est mise en cache, tandis que le second bloc de code est exécuté lorsque la page mise en cache est présentée au visiteur suivant.

2
anu

J'utilise W3TC, ce sont donc des approches que je peux trouver pour cela:

  1. La mise en cache fragmentée pour exclure cette partie de la page réduira l'efficacité globale du cache.

  2. Identifiez la page avec une feuille de style commutée par argument de requête, désactivez la mise en cache de telles pages.

  3. Identifiez la page avec le point de terminaison de la feuille de style commutée par URL, désactivez la mise en cache de ce type par masque.

  4. Implémentez le commutateur de feuille de style via JavaScript (pas vraiment spécifique à W3TC).

2
Rarst

Idée: Si vous mettez les styles en file d'attente, utilisez filemtime() pour la variable version. Si des modifications sont apportées à votre feuille de style précédente, la mise en cache est empêchée et une nouvelle feuille de style est chargée.

2
kaiser