Afficher/faire défiler des tas d'images dans le navigateur

Question

Je veux être en mesure de parcourir des tas d'images dans le navigateur, rapide. La manière simple (il suffit de charger 2000 images et de faire défiler) ralentit beaucoup le défilement, supposément parce qu'il y a trop d'images à garder en mémoire. Je voudrais entendre des réflexions sur les stratégies pour pouvoir parcourir rapidement 10000 images (comme si vous étiez sur votre bureau) dans le navigateur. Quels seraient les goulots d'étranglement attendus? Comment les aborder? Comment truquer les choses pour que l'expérience utilisateur soit toujours bonne? Exemples dans la nature?

Answer 1

Vous voudrez utiliser AJAX pour charger dynamiquement les images pendant que vous faites défiler. Fondamentalement, vous chargez certaines images en fonction de la profondeur de défilement. N'oubliez pas de vider ceux qui sont hors de l'écran pour que le navigateur reste réactif.

Si vous voulez simplement feuilleter un grand nombre de photos une à la fois, vous pouvez précharger les images qui n'ont pas été affichées. Les albums Facebook préchargent l'image suivante pour que la prochaine image soit très rapide.

Answer 2

Je pense que RIA est votre meilleur pari ici. Des technologies telles que Flex et Silverlight ont été conçues spécifiquement pour fournir un comportement semblable à celui d'un ordinateur de bureau, tandis que HTML/JS n'ont jamais vraiment été conçus pour être utilisés avec autant d'images. En outre, si vous n'avez encore vu aucune démo de Pivot, ce sont de bons exemples sur la façon de maintenir un bon UX à grande échelle. Le meilleur lien que je peux trouver est en ce moment, malheureusement, la vidéo vente à pas sur le site officiel, mais il montre encore quelques interactions nettes:

http://www.getpivot.com/