préchargement images avant changement de page

[viddaa]

Bonjour,

J'ai eu beau cherché, je n'ai pas trouvé de topic qui corresponde à ma question.

Je crée en ce moment un tchat AJAX/PHP. Ma question ne porte pas sur le système d'un tel tchat, mais plutôt sur le préchargement des images AVANT l'affichage de ce tchat.

Je m'explique: pour y accéder, j'ai fais une page qui se charge de précharger les images avec une jolie barre de défilement, la classe et tout et tout. Ensuite seulement, quand la barre de chargement est remplie, on redirige le client vers le tchat proprement dit.
Mais là, avec l'outil de développement de google chrome, je constate que la page télécharge toutes images une seconde fois quand elles sont sollicitées.

Alors ma question est la suivante: comment faire en sorte de ne plus aller dans le dossier des images mais allez puiser directement ces images dans le cache?

Sinon, ma jolie barre de défilement ne sert à rien, si ce n'est de gadget pour faire joli. Auquel cas, je préchargerais les images directement en arrivant sur le tchat, mais en attendant, ça ne ferait pas très sérieux, on attendrait que le préchargement soit fini, ce qui rallongerait d'autant plus l'affichage ne serait-ce que de l'image en background. NUL...

Pour toute réponse, merci d'avance

[Willpower]

une solution est de définir le cache en .htaccess du genre :

Code :

1
2
3
4
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/png "access plus 60 days" 
</IfModule>

[NoSmoking]

Bonsoir,
perso je ne supporte pas les barres de chargement et il m'arrive parfois de quitter le site rapidement, alors si en plus c'est juste pour faire joli !!!!

[viddaa]

salut,

ah oui willpower, je ne connaissais pas mais ça m'a l'air pas mal comme solution. J'ai déjà un .htaccess, au moins il servira pour encore autre chose. Tant que ça n'interfère pas avec le rewrite...

Je suppose que je peux ajouter autant de ExpiresByType que de type MIME? J'ai du gif, du png et du jpeg.
Et avec ça, mon tchat sera en mesure de retrouver les fichiers directement dans le cache, alors? Comment puis je le contrôler? Firebug, par exemple?


Nosmoking, perso ce que je ne supporte pas, ce sont les réponses hors sujet qui ne font rien avancer. Sans vouloir t'offenser, bien sur

[Willpower]

j'avoue ne pas m'y connaitre en .htaccess, j'avais juste mis ça pour réduire la bande passante de mon site en évitant de recharger les images à chaque fois.

[NoSmoking]

Envoyé par viddaa

Nosmoking, perso ce que je ne supporte pas, ce sont les réponses hors sujet qui ne font rien avancer. Sans vouloir t'offenser, bien sur

Tout ceci était pour arriver à ce poser la question est ce que mon flux est bien "géré"?.

Il me semble qu'en ce qui compte dans un tchat, ce sont les écrits qui sont les plus importants, plus vite on y arrive plus vite on est satisfait.

Voir la page apparaître, et donc avoir déjà de l'information sur le contenu, pouvoir commencer à lire celui ci, quand les images n'apporte pas, ou peu, au contenu est et devrait resté le principal.

La question que l'on peut donc ce poser est celle de la justification et de la bonne utilisation des images dans une page.

Ô combien de fois a-t-on vu des images 1200x800 redimensionnée en 300x200, sans compter qu'il existe aussi la technique des sprites.

Quant à la question que tu te poses peut être trouveras tu une réponse sur Module Apache mod_expires.

[viddaa]

Il me semble qu'en ce qui compte dans un tchat, ce sont les écrits qui sont les plus importants, plus vite on y arrive plus vite on est satisfait.

Voir la page apparaître, et donc avoir déjà de l'information sur le contenu, pouvoir commencer à lire celui ci, quand les images n'apporte pas, ou peu, au contenu est et devrait resté le principal.

Alors dans ce cas, je n'ai plus qu'à faire un tchat en noir sur fond blanc, puisque, de toute façon, le design est très secondaire. Je ne partage pas ton avis.

La barre de chargement n'est que fioriture, en effet. Je peux la supprimer mais cela n'a absolument aucun rapport.
Cela dit, la nécessite de précharger les images permet un affichage direct du design et laisser toutes les performances du navigateur au service de la bonne communication client/serveur tout en proposant aux utilisateurs une interface plus conviviale.
En effet, qui resterait sur un tchat qui fonctionne mais dont la présentation n'est pas travaillée. Comme dans dans n'importe quel site, d'ailleurs.

De plus, un tchat utilise des avatars, des smileys, plusieurs feuilles de style à choisir selon ses préférences. Il ne faudrait tout de même pas qu'en plus de la charge AJAX, on leste encore la réception de données avec des images qui auraient pu être chargées au préalable.

Quant à la question que tu te poses peut être trouveras tu une réponse sur Module Apache mod_expires.

Nous voici donc dans le vif du sujet. Et là je te remercie beaucoup pour ce lien. Je n'ai pas eu le temps de m'en occuper aujourd'hui et de l'avoir sous la main me rendra une fière chandelle, gain de temps dans la mesure ou il faut encore éplucher tout ces sites qui proposent tant de smileys.

Je ne regrette pas mon POST, merci à vous deux.

[Willpower]

Je vais quand même te donner mon point de vue qui rejoint celui de noSmoking, même si sa première façon de le formuler n'était pas très délicate : "ton truc ne sert à rien".


Perso, le seul site où j'ai déjà vu un belle barre de chargement dans cette idée là, c'est le jeu par navigateur d'ubisoft "heroes kingdom" et même là, je "skippais" le chargement autant que possible. Il n'y a rien de plus impatient qu'un visiteur donc si c'est pour charger du cache et puis recharger une page où ton navigateur prendra aussi du temps à initialiser le DOM et le javascript. Le chargement total de la page sera presque aussi long que s'il n'avait pas les images en cache. Le chargement des 2 pages cumulées (chargement + vraie page) sera au total plus long. Aussi après la première visite la première page ne servira plus à rien puisque tout sera dans le cache, mais si tu ne mets pas de conditions il y aura de nouveau double emploi de 2 DOMs (et 2 javascript à charger pour tester le onload de la page).

Au final, je pense qu'un popup de chargement peut être "joli" dans le cas d'une page ajax par exemple (c'est à dire que si l'utilisateur le ferme, la page derrière est déjà là et ça ne relance pas une nouvelle page). Avec en plus une option pour empecher ce popup pour les utilisateurs capricieux comme ******

Bref, évidement, je ne te dis pas comment tu dois faire, et au final c'est bien sûr toi qui choisira, mais penses-y ou repenses-y avant de te lancer là dedans.

Bonne chance.

[viddaa]

Oui, je te suis, en effet.

Cette barre de chargement, au fond, ne servait qu'à informer le visiteur qu'une action est en cours plutôt que de le laisser sur un page vide le temps que ça se fasse pour éviter qu'il croit qu'aucune action ne se fait.

J'ai fini par décider d'enlever cette barre de chargement parce que finalement, le temps de préchargement des images est assez cours, donc temps négligeable par rapport à une animation relative.

Le préchargement des images, pour un site web, est parfaitement inutile,je te l'accorde.
Seulement dans le cas d'un tchat, certains messages arrivent avec des smileys. Ne pas précharger les images correspondantes provoquerait un retard de l'affichage de ces smileys, ce qui est plutôt dommage. En effet un smiley qui s'affiche après le message correspondant, ça craint.

En plus des smileys, l'utilisateur a la possibilité de choisir des feuilles de styles différentes ainsi que des avatars.
En cas de changement de ceux ci, l'utilisateur ne devrait pas constater de latence non plus sur l'affichage de l'image demandée (si ce n'est les temps de réponse AJAX), latence qui entrainerait l'affichage de "l'image cassée" le temps que le fichier soit téléchargé.
Gardons à l'esprit que l’échange client/serveur est constant et assez gourmand en ce qui concerne un tchat en AJAX/PHP. Ajouter encore des requêtes "ordinaires" pour des choses si futiles serait dommageable pour la principale fonction de la chose, à savoir la discussion proprement dite, ce qui va parfaitement dans le sens de ce que disait NoSmoking.

C'est la première fois que je développe un projet de cette envergure et je tiens absolument à éviter les petits problèmes que le manque de discernement pourrait provoquer. Je pense vraiment pour ma part que de les précharger en cache AVANT l'arrivée sur le tchat est crucial, à condition de pouvoir les retrouver une fois arrivé en discussion. Dans le cas contraire, en effet, le préchargement serait en effet bien inutile.

En tout cas merci de vos réponses rapides et de ce débat qui n'est peut-être pas fini

[Willpower]

hom3 - YouTube

hom3 - YouTube

(un jeu ubisoft)

dans la première partie, je clique sur le lien vers la page de préchargement.

dans la seconde après avoir vidé le cache, je tape directement la page du jeu dans la barre d'adresse.