Home >Documents >Industrialiser la gestion des fichiers multimedia #dcparis13

Industrialiser la gestion des fichiers multimedia #dcparis13

Date post:26-Jun-2015
Category:
View:466 times
Download:0 times
Share this document with a friend
Transcript:
  • 1. Aurlien NavarreIndustrialiser la gestiondes chiers multimdia

2. Qui suis-je ?EMEA Support Team Lead - Acquia Support et expertise Drupal Hbergement, audit, conseil... Tutoriels vidos Drupal 7+ en franais 600 visites par jour / 1500 membres 1500 abonns YouTube / 400k vueswww.drupalfacile.org / @[email protected] 3. Pourquoi cette session ? Drupal est dcri pour sa gestion lectronique de documents. Info ou intox ? La plupart des problmes de performances proviennent du frontend Manque de publicit des bonnes pratiques dindustrialisation multimdia Rectier sa stratgie de gestion de chiers est souvent complexe et risqu Intgrateur, dveloppeur ou admin systme : vous jouez tous un rle ! 4. Posez-vous les bonnes questions Quel nom de chier donner un lment multimdia ? Quelle est la taille / rsolution laquelle va tre afch mon mdia ? Devrais-je crer des formats compatibles HTML 5 ? Faut-il utiliser un service SaaS/PaaS pour externaliser la gestion mdia ? Est-ce que ma stratgie multimdia fonctionnera encore dans 5 ans ? 5. Industrialisation locale des fichiersPour les graphistes, maquettistes et intgrateurs 6. Quel format dimage choisir ? JPEG (progressif) pour une image avec des millions de couleurs, GIFou PNG pour une image avec 256 couleurs maximum Aplatissez vos images enregistres pour le web (canal Alpha RVBA) Pour le web, ne dpassez jamais une rsolution de 72 dpi 7. Le preprocess dimage la source Utilisez un diteur dimage tel que Photoshop, The Gimp ou Pixelmator Un preprocess efcace ncessite de bien dnir ses besoins mtier Optimisez la source pour viter des traitements superus plus tard 8. Redimensionnement Pixelmator*Fichier originalNouveau chier(export web)DimensionsTaille1984x1984 px 80x80 px360 kb 2.6 kb* Rglages par dfaut de lapplication. Des rglages afns pourront donner de meilleurs rsultats 9. Redimensionnement The Gimp*Fichier originalNouveau chier(export normal)DimensionsTaille1984x1984 px 80x80 px360 kb 8 kb* Rglages par dfaut de lapplication. Des rglages afns pourront donner de meilleurs rsultats 10. Exporter pour le web avec The GimpPlug-in multi-plateformes Save For Web GIMP Extensions Pack 11. Redimensionnement Photoshop*Fichier originalNouveau chier(export web)DimensionsTaille1984x1984 px 80x80 px360 kb 3.6 kb* Rglages par dfaut de lapplication. Des rglages afns pourront donner de meilleurs rsultats 12. Les bons tuyaux PhotoshopDRUPALCAMP Scriptez vos traitement dimages Usez et abusez des traitements par lot Utilisez les droplets Photoshop 13. Connaissez-vous ImageOptim ? Dtermine la meilleure compression Supprime les prols couleur et infos EXIF Gre le JPEG, PNG et GIF Utilise des moteurs doptimisation populairesVous tes sur Linux ?Testez TrimageVous tes sous Windows ?Testez FileOptimizer 14. Utiliser ImageOptim Dragndrop des chiers multimdia Traitement automatis immdiat Rapport dtaill chier par chier$ imageOptim --directory /filesProcessing 57 images... Finished in 54 secondsAutomatisation via ImageOptim-CLI......ou par des actions Automator ! 15. Tirez parti des Sprites CSS Etape cruciale pour un site performant Limite les requtes HTTP Permet de se passer de JavaScript Attention la taille des chiers CSS ! 16. Ne ngligez pas le traffic mobile En 2012 +101.4% de ventes via mobile ! 14,62% de parts de march en mai 2013 Les performances mobiles sont crucialespour les sites marchands Une bonne page devrait charger en 2-3secondes et peser ~50KB Analysez vos statistiques de conversionExemple : Ofce Depot 244 KB non optimis. 6.38 sec de chargement depage (contre 6.06 sec avant) Succs dachat en chutelibre de 99.68% 98.35% 17. Industrialisation de fichiers sous DrupalPour les site builders et dveloppeurs 18. Bote outils image Qualit JPEG dnie 75% Module Image Style Quality pourune granularit par style dimage 19. Styles et traitements dimagePensez Drupal contrib : ImageCache Actions ImageField Focus Imagecache External Image javascript crop Image Optimize 20. Aller plus loin avec les images Retina Images Retina servies selon le priphrique utilis Utilisez le module Drupal Retina ImagesAVECSANS 21. Scurisation du systme de fichier priv Non accessible par le serveur web Permissions dnies 750 avec sticky bit(drwxr-s---) .htaccess automatiquement gnr :Deny from allOptions NoneOptions +FollowSymLinks Attention aux problmes de performance ! 22. Rglages du champ Fields API imageImplementation des garde-fou :Dimensions minimalesDimensions maximalesTaille maximum de chierBalises Alt et/ou Title pour le SEO 23. Core ou module contrib ? La gestion des chiers multimdia via Drupal core est trs limite Optez pour un module avec des fonctions avances (Media, Scald ou Asset) Page de comparaison de ces modules dans la base de connaissance Acquiahttp://drupal.org/project/media http://drupal.org/project/scald http://drupal.org/project/asset 24. Stratgie dorganisation de fichiers Etape cruciale de votre industralisation de chiers multimdia Question principale : o sera stocke mon image ou ma vido ? Ni Drupal core, ni les modules contrib nimplmentent de stratgie prenne Les systmes de chier rseau exacerberont une mauvaise stratgie 25. Organisation des fichiers par dfaut Chaque type de contenu est paramtrable Utilisez les tokens Organisation YYYY/MM/DD prfrableComment va ragir lesystme de chiersavec 1M de chiers ? 26. Les tokens la rescousse Explorez les nombreux tokens disponibles Lesquels rpondent au mieux vos besoins ? Pas satisfait ? Crez votre propre token ! 27. A propos des field tokens Intgr CCK, manquant dans Fields API Issue Field tokens sur drupal.org Manque les tokens imbriqus Modules contrib pour palier au problme :Media Path TokensFile (Field) PathFile Entity Path 28. Exemple dorganisation des fichiersAnne Mois JourIdalement, ne dpassez pas 1000 chiers par rpertoire 29. Toujours pas convaincu ?$ time ls -l | wc -l50399real 5m27.311suser 0m2.250ssys 0m3.080s$ time find "." -maxdepth 1 -type f |wc -l50357real 1m32.570suser 0m0.230ssys 0m1.590s$ ls -l abbey-carpet.jpg-rw-rw-r-- 1 site www-data 61088 2012-11-02 08:31abbey-carpet.jpg 30. Toujours pas convaincu ?$ time ls -i | wc -l50398real 0m3.770suser 0m0.240ssys 0m0.030s$ ls -i abbey-carpet.jpg134367796 abbey-carpet.jpg On peut optimiser le listing de chiers sous Linux Un le browser (Media, Scald, Asset, IMCE,CKnder...) subira de plein fouet les lenteurs 31. Attention aux fichiers orphelins Tout chier qui nest pas rfrencdans la BDD sera orphelin Rglez les incohrences entre ledossier les et la base de donnes Un chier devrait toujours tre ajout,modi et supprim via Drupal Media 2.x permet limport de chiersmassif/mnt/drupal/files# ls -i | wc -l50398mysql> SELECT COUNT(*)FROM file_managed;+----------+| COUNT(*) |+----------+| 48467 |+----------+1 row in set (0.01 sec) 32. Batch dimport de fichiers via Media 2.x Pas de slash de n au dossier les Wildcards souples et efcaces Attention au sufxe _0 ajoutautomatiquementmysql> SELECT uri FROM file_managed WHERE uri LIKE %camp%+--------------------------------------------------------+| uri |+--------------------------------------------------------+| public://2013/04/26/drupalcamp_0.jpg |+--------------------------------------------------------+ 33. Passez la vitesse suprieurePour les dveloppeurs et admin systme / rseau 34. Grer les chunks de fichiers En environnement HA mez-vous du round-robin. Plupload et les modules qui grent les chunksduploads sont impacts Utilisez Acquia Cloud Enterprise Sticky Session ou :$temp_directory = variable_get(plupload_temporary_uri,temporary://);$ drush @site.env vset plupload_temporary_uri/mnt/gfs/sitename/tmp 35. Outsourcing de mdias 36. Outsourcing de mdias via un CDN Servir des chiers rapidement, et ce partout dans le monde Se protger considrablement plus des attaques DOS et DDoS Augmenter les performances en processing et diffusion multimdia Optimiser la bande passante et amliorer le SEO (Page Speed) 37. Les CDN, oui mais...Principaux modules Drupalhttps://drupal.org/project/cdnhttps://drupal.org/project/akamaihttps://drupal.org/project/cloudfronthttps://drupal.org/project/edgecast CDN de caching ou de streaming ? Les deux ? Origin pull ou push (via le conveyor) ? 38. Quelques astuces de terrain Identication priodique par bash script :$ identify drupal7.png |grep -o"[[:digit:]]*x[[:digit:]]*" | tail -181x101 Attention aux noms de chiers : College (New Technology / 40x40).pdfest un mauvais nom de chier college-new_technology-40x40.pdf estun nom de chier parfaitPensez au monitoring du stockage ! 39. Questions ? Retour dexprience ?

Popular Tags:
of 39/39
Aurélien Navarre Industrialiser la gestion des fichiers multimédia
Embed Size (px)
Recommended