2009-09-15 7 views
0

J'ai utilisé cette méthode: CSS Throwdown - Précharger des images sans JavaScript Jeff Starr - http://perishablepress.com/press/2007/07/22/css-throwdown-preload-images-without-javascript/comment pré-charger des images pour site Web mobile (par exemple http://m.youtube.com/, http://m.zoosk.com/)

Cela fonctionne très bien quand je l'affiche dans le navigateur Web, mais sur le mobile, il ne semble pas avoir d'effet, les icônes .png prend encore trop de temps à charger.

Répondre

1

Le préchargement ne rend pas tout plus magique - cela signifie simplement que des requêtes sont parfois émises avant que les données ne soient requises. Le préchargement est-il en train de se produire? Peut-être que les choses sont simplement lentes parce que la connexion mobile n'est pas géniale.

Cette méthode de préchargement des images me semble comme ça va fonctionner correctement sur les navigateurs mobiles - je doute fortement que les navigateurs mobiles "optimiser" en ne récupérant pas les images ne sont pas visibles.

+0

Merci Dominic. Ce n'est probablement pas une excellente connexion mobile. Non, le préchargement ne semble pas du tout se produire. Je n'utilise que des icônes sur la page de destination, ce qui prend beaucoup de temps à charger, même si j'ai spécifié la largeur et la hauteur que l'icône finira par charger après que tout soit chargé. J'ai regardé quelques sites de référence avec plus/plus grandes images, qui charge presque instantanément à partir du même téléphone. J'ai regardé leur code source et je ne peux pas trouver de script de préchargement ou de css. Je suis un peu perplexe, d'où la question s'il y a peut-être un autre moyen que je ne connais pas. Merci encore pour la réponse. –

+0

Salut Chris - la seule chose que je peux penser est que peut-être la connexion de votre serveur n'est pas aussi bonne que celle de YouTube, mais ce serait aussi lent dans un navigateur normal aussi. Quel navigateur mobile utilisez-vous? Avez-vous essayé d'autres techniques de préchargement? –

+0

Hey Dominic Je suis en train de tester le navigateur par défaut d'un certain nombre de téléphones, mais j'utilise aussi Opera mini de temps en temps. Je n'ai pas essayé les techniques de préchargement qui nécessitent javascript - mon dossier ne me permet pas d'utiliser javascript pour ce site. Je suis en train de remplacer des icônes avec une solution d'image-objet CSS pour voir comment cela affecte les temps de chargement des pages - moins de requêtes HTTP et une taille de fichier totale plus petite à charger. Pourriez-vous recommander des techniques alternatives de préchargement par hasard? Cordialement Chris –

0

Si le navigateur mobile ne prend pas en charge javascript (ou ne prend pas suffisamment en charge javascript), le préchargement de cette manière peut ne pas fonctionner.

Je suppose qu'il est également unlikley que le préchargement avec javascript fonctionnerait sur n'importe quel navigateur ou proxy qui utilise le transcodage ou le pré-rendu sur le serveur. Avez-vous essayé l'approche old school (90's) de préchargement qui devait inclure l'image sur la page d'accueil (ou même sur chaque page) mais dimensionnée à 1px par 1px (peut-être aussi essayer 0x0). Cela peut signifier que l'utilisateur paie pour télécharger plus de contenu que nécessaire. Quel est un problème à considérer.

La première chose à faire est: assurez-vous que vous avez vraiment besoin de l'image; le rendre aussi petit que possible (taille physique & compression d'encodage d'image); et [gzip] compresse le fichier tel qu'il est envoyé via HTTP. Assurez-vous également que vous faites tout ce que vous pouvez pour permettre au navigateur utilisateur/client de mettre correctement en cache les images.

+0

Avez-vous réellement lu l'article lié? Il décrit à peu près votre chemin, et n'utilise pas JavaScript. –

+0

oui j'ai, merci Konrad. Dans la question que j'ai mentionnée, c'est aussi la méthode que j'ai utilisée sur le site, mais elle semblait un peu lente sur la charge initiale. Avec une combinaison d'ajustement de la compression, la méthode de préchargement CSS et le cache du navigateur semblent convenir à ce projet, du moins pour l'instant. Cordialement –

+0

Konrad - Oui, j'ai mal lu la question initiale et juste fait quelques commentaires généraux sur le préchargement sur mobile. D'autres éléments généraux à prendre en compte seraient les transcodeurs et les navigateurs pouvant atteindre la taille spécifiée, puis avoir à rediffuser l'image à la taille réelle souhaitée. Chris - avez-vous vérifié que la demande d'image est faite au serveur, lors de la tentative de préchargement? –

0

Si votre site est destiné aux mobiles, et pas seulement à celui que vous testez, vous pourriez avoir des difficultés à trouver une solution universelle qui fonctionne sur tous les navigateurs mobiles. Si vous voulez améliorer le temps de téléchargement de l'image, peut-être pourriez-vous envisager d'ajuster la compression de l'image pour en réduire la taille?

+0

merci, a finalement ajusté la compression avec le préchargement CSS et il semble bien fonctionner pour l'instant, charge initiale un peu lent mais à partir de là, le navigateur met également en cache des icônes qui aide. –

Questions connexes