Meilleure pratique de génération de vignettes?

Question

Je crée un réseau social où les utilisateurs téléchargent leur image de profil.

Cette image sera utilisée dans leur page de profil dans une dimension 150/150 px.

Dans la page d'accueil, c'est-à-dire le flux d'activité utilisateur, j'ai besoin que la même image soit dans 75/75 px.

Quelle serait la meilleure pratique pour faire cela

1. Redimensionner l'image sur la mouche (Timthumb).
2. Redimensionner et enregistrer l'image dans le serveur.

Answer 1

Lors du téléchargement d'une photo, créez un ensemble obligatoire de miniatures et enregistrez-vous en tant que [Image_namepoucesize_name] .jpg environ:

uploaded: file.jpg
medium: file_thumb_150x150.jpg
small: file_thumb_75x75.jpg

La convention de dénomination dépend de vous, mais d'une manière rapide, vous obtenez un accès facile aux données dont vous avez besoin. Pas besoin d'utiliser le serveur pour le générer à la volée ou l'échelle dans un navigateur.

Answer 2

Je travaille sur ce problème depuis un petit moment et j'ai rencontré 3 façons principales de procéder:

1. Générez des images miniatures au point de téléchargement en tant que processus d'arrière-plan.
2. Générer des images à la demande via l'application principale
3. Générer des images à la demande en utilisant l'URL comme API

Chaque approche a ses avantages et ses inconvénients.

1. Cette approche est la plus restrictive, vous devez connaître toutes les utilisations et tailles de vignettes à l'avant afin que vous puissiez les générer immédiatement après le téléchargement. Le principal avantage est que les images peuvent être servi efficacement à l'aide d'un serveur comme Nginx et sont comme toutes les autres ressources statiques.
2. Django possède une bibliothèque appelée Sorl-Thumbnail qui fournit une balise de modèle pour générer des miniatures de toutes sortes au fur et à mesure qu'elles sont nécessaires. Il utilise un magasin de clés / valeur rapide pour garder une trace de ce que les miniatures ont été générées, et invalide automatiquement les images générées si elle détecte l'image source a été modifiée. La balise de modèle renvoie ensuite l'URL pour l'image générée, qui peut être servie directement à partir de Nginx sans passer par une couche de script. Plus flexible que 1, mais vous ne pouvez pas (par exemple) générer une URL d'image à l'aide de JavaScript et vous attendre à ce qu'elle existe, elle doit être effectuée par le code ou les modèles du site Web.
3. Entièrement dynamique et flexible, vous pouvez obtenir la version de l'image que vous souhaitez simplement peaufiner l'URL, Amazon utilise cette méthode comme le font tous ces sites Web de génération d'images d'images. Peut générer des URL en JavaScript et faire les choses de fantaisie que vous voulez. Le site Web lui-même n'a pas besoin de connaissance de la couche de pouce à trois de peut-être quelques méthodes d'assistance pour générer les URL pour vous. Mais, c'est évidemment le moyen le plus à forte intensité de ressources de faire les choses et vous devez vous assurer que votre architecture peut gérer la charge. Vous devez utiliser chaque astuce du livre pour invalider les caches en temps opportun, éviter les coups inutiles sur le script de redimensionnement, etc.

Je suis un grand fan de la 3e façon de faire les choses, j'aime que la génération d'images soit complètement isolée de la fonctionnalité principale de mon site Web et j'aime la flexibilité considérable, mais vous devez savoir ce que vous faites lorsqu'il s'agit de configurer votre serveurs pour le gérer.

Answer 3

Je vous dis ce que je fais. Je stockage toujours l'image en taille réelle, mais je le renommage en utilisant l'ID DB avec des zéros de premier plan. Lors de la première utilisation, je crée la vignette et le stockez dans un autre dossier, en l'utilisant dans les prochains appels.

Answer 4

Si l'espace du serveur et la bande passante sont un problème, vous devriez envisager d'utiliser un CDN.

Amazon a un bon service,