8 points par xguru 2020-02-21 | 3 commentaires | Partager sur WhatsApp
  • Lit une image, lui applique un flou, puis la convertit en un code de hachage de 20 à 30 caractères

  • Sur le web/dans les apps, avant de charger l’image, il suffit de recevoir le code de hachage pour afficher d’abord une image floutée, puis de récupérer l’image via le réseau pour l’afficher.

  • Code fourni en C/Swift/Kotlin/Python/Typescript

  • Des implémentations tierces existent en Go/PHP/Java/Clojure/Rust/WASM

3 commentaires

 
xguru 2020-02-21

C’est de loin la meilleure façon de gérer les placeholders d’image que j’aie vue jusqu’à présent. Le rendu est joli aussi.

Je me suis dit que, dans l’outil d’administration, on pourrait peut-être utiliser un code de hachage comme nom de fichier à chaque téléversement d’image, mais l’encodage base83 me fait un peu hésiter.

 
nemorize 2025-08-28

J’ai vu ce commentaire, je me suis dit « il faudra que je l’applique un jour ~ », et finalement je l’ai mis en place 5 ans plus tard.
Le B83 contient des caractères spéciaux comme ? / # =, donc j’ai simplement réencodé le B83 en B64-urlsafe haha ;

Même en encodant en B64 la valeur de hachage 43 du réglage de composant par défaut, on reste autour de 40 caractères, donc la charge est moins importante que prévu,
et selon le contexte, si on réduit à du 3
3 voire du 3*2, c’est moins joli mais on peut descendre à environ 25 caractères.

 
sduck4 2020-02-21

Oh... donc on pourrait afficher un placeholder à partir du seul nom de l’image ! Excellente idée. :)