[Résolu] Gestionnaire de médias qui rame et saturé, trop de dossiers

Deevad · novembre 2018

Bonjour,

Ça fait un sacré bout de temps que j'utilise PluXML et au fil du temps; mon répertoire médias commence à avoir une arborescence qui fait pâlir le gestionnaire de médias. 8o C'est surtout le sélectionneur de dossier qui peine. Pour régénérer la liste; ça rame longuement avant le chargement. Sur mon autre blog où l'arborescence est comme ça https://www.peppercarrot.com/0_sources/, je n'y accède même plus; ça m'immobiliserai tout PluXML pendant trente secondes et la liste serait inutilisable car j'ai beaucoup de sous dossiers...

J'aimerai donc savoir si il y a une manipulation à faire pour remplacer la navigation de dossier par une alternative car pour l'instant tout ajout d'images pour moi est devenu pénible. J'ai essayé plusieurs après midi de bricoler core/admin/medias.php et core/lib/class.plx.medias.php, mais je me suis emmêler entre plxMedias, contentFolder, _getAllDirs et le tout n'est clairement pas une modification à la porté d'artiste illustrateur bidouilleur de Php comme moi. Merci si il y a des bricoleurs chevronné de PluXML !

Je joins un *.gif capture du menu en question:

bazooka07 · novembre 2018

Il faut re-écrire les méthodes PlxMedias::_getAllDirs(...) et PlxMedias::_getDirFiles().
Il y a beaucoup d'erreurs de méthodes qui font perdre du temps au serveur.
Sur un petit site, cela peut passer inaperçu. Dans ton cas, cela commence à apparaitre.

Normalement il faudrait faire un pull-request pour mettre à jour la prochaine version de PluXml mais mes propositions pour améliorer PluXml ont de plus en plus de mal à passer.
On m'a bloqué un pull-request pour des histoires de majuscules et de sauts à la ligne.

Eventuellement je peux te faire passer le fichier core/lib/class.plx.medias.php avec les corrections si tu te sens capable de remplacer le fichier dans PluXml. A priori oui, tu sembles utiliser Ubuntu. Quelle version ?

Il faudrait m'indiquer la version de PluXml que tu utilises. 5.6 ou 5.7 (Github)

Dans le lien que tu donnes, je ne vois pas de dossier .thumb. On est à la racine du dossier de medias ?

Deevad · novembre 2018

Merci Bazooka07 pour ton diagnostique, l'offre de coup de main et les pistes d'investigations! Je peux tester un core/lib/class.plx.medias.php modifié avec plaisir; je suis sur Kubuntu 18.04.1 et mon PluXML est un 5.5 avec des backport sécurité fait par cherry-pick; je ne suis pas passé à 5.6 car je craignais des problèmes de compatibilité avec des plugins bricolé maison comme j'en ai connu dans les mise-à-jours précédentes. Mais il faudra bien que je mette à jour à un moment, sans doute ce mois-ci. Pour .thumbs ; j'ai bien le dossier, mais je viens de tester et les dossiers cachés commençant par un point sont non répertoriés par le gestionnaire de média de mon côté. Je pense que mon class.plx.medias.php est de 5.5 d'origine ( lien: https://framagit.org/peppercarrot/website/blob/master/core/lib/class.plx.medias.php ).

bazooka07 · novembre 2018

Depuis la version 5.4 de PluXml, qui date de quelques années, il existe cette portion de code dans le fichier core/lib/class.plx.medias.php :

[== PHP ==]
	public function contentFolder() {

		$str  = "\n".'<select class="folder" id="folder" size="1" name="folder">'."\n";
		$selected = (empty($this->dir)?'selected="selected" ':'');
		$str .= '<option '.$selected.'value=".">('.L_PLXMEDIAS_ROOT.') &nbsp; </option>'."\n";
		# Dir non vide
		if(!empty($this->aDirs)) {
			foreach($this->aDirs as $k => $v) {
				$i = 0;
				while($i < $v['level']) {
					$i++;
				}
				$selected = ($v['path']==$this->dir?'selected="selected" ':'');
				$str .= '<option class="level_'.$v['level'].'" '.$selected.'value="'.$v['path'].'">/'.$v['path'].'</option>'."\n";
			}
		}
		$str  .= '</select>'."\n";
		# On retourne la chaine
		return $str;
	}

Quelqu'un peut m'expliquer l'intérêt de la variable $i ? :mad: :mad: :mad:
Vous m'étonnez que cela rame !

Stéphane · novembre 2018

@bazooka07

Visiblement c'est un résidu de code de la 5.3.1


	/**
	 * Méthode qui formate l'affichage de la liste déroulante des dossiers
	 *
	 * @return	string	chaine formatée à afficher
	 * @author	Stephane F, Danielsan
	 **/
	public function contentFolder() {

		$str  = "\n".'<select class="folder" id="folder" size="1" name="folder">'."\n";
		$selected = (empty($this->dir)?'selected="selected" ':'');
		$str .= '<option '.$selected.'value=".">|. ('.L_PLXMEDIAS_ROOT.') &nbsp; </option>'."\n";
		# Dir non vide
		if(!empty($this->aDirs)) {
			foreach($this->aDirs as $k => $v) {
				$prefixe = '|&nbsp;&nbsp;';
				$i = 0;
				while($i < $v['level']) {
					$prefixe .= '&nbsp;&nbsp;';
					$i++;
				}
				$selected = ($v['path']==$this->dir?'selected="selected" ':'');
				$str .= '<option class="level_'.$v['level'].'" '.$selected.'value="'.$v['path'].'">'.$prefixe.$v['name'].'</option>'."\n";
			}
		}
		$str  .= '</select>'."\n";
		# On retourne la chaine
		return $str;
	}

bazooka07 · novembre 2018

Dans le cas de tes plugins maison, je te conseille de faire une installation neuve de PluXml en version 5.6.
Teste tes plugins avec et corrige les éventuels bugs.
Si ok, crée quelques articles pendant quelques semaines
Si c'est toujours bon copie ton dossier de données dans la nouvelle installation. PluXml fera automatiquement l'upgrade de tes données

Selon ton niveau de compétences, tu peux utiliser git et cloner le dépôt de PluXml. Je travaille partiellement avec cela.
En partie seulement, car j'utilise une version plus avancée (ré-écriture d'urls plus propre, éditorial ou articles épinglés, génération robots.txt, diaporama dans le gestionnaire de médias, ...)

D'après les modifs que j'ai faites dans la journée cela améliore beaucoup la vitesse de rendu du gestionnaire de médias.
J'ai relevé pas mal d'erreurs de méthodes qui sont pénalisantes.

Je suis parti de la version actuelle disponible sur Github ( dernier commit en date du 25/11/18 )
les modifs portent en grosse partie sur le fichier core/lib/class.plx/medias.php.

Je vais détailler cela dans mon prochain billet. Je ne pense pas qu'il y a beaucoup de différence dans la gestion des médias entre la dernière version publiée (5.6) et la version disponible sur Github

Si vous maitrisez git, vous pouvez utiliser la branche plxmedias-1811 sur mon dépôt Github :

[== bash ==]
git clone https://github.com/bazooka07/PluXml.git -b plxmedias-1811

Deevad · novembre 2018

Merci Bazooka7 pour https://github.com/bazooka07/PluXml/commit/dac0e0d44722bd90462cf8678f373e9c2c7855ed !

Je vais intégrer ça et je reviendrai en dire des nouvelles sur une arborescence complexe.

Stéphane: Ha oui, je me souviens maintenant de ça. 5.1.3 et avant: les dossiers rangés dans le menu select en forme d'arbre ASCII avec des pipes pour voir la relation dossier/sous-dossier. Je me souviens aussi d'un gestionnaire de média bien avant l'époque Git; du temps de Skyline (si je me souviens du pseudo). Avec des médias en grille, plus comme un explorateur de fichier classique.

bazooka07 · novembre 2018

Vous trouverez tous les détails des modifications apportées sur la page suivante de mon blog :
https://kazimentou.fr/article25/ameliorer-gestionnaire-medias

bazooka07 · novembre 2018

On peut aussi activer le cache du navigateur, ainsi que ceux des proxies qui parsèment le chemin jusqu'à ton serveur.

IL suffit de rajouter les lignes suivantes au fichier .htaccess situé à la racine du site :

[== Apache ==]
<IfModule mod_expires.c> 
        ExpiresActive On 
        ExpiresByType image/* "access 8 hours" 
        ExpiresByType application/javascript "access 8 hours" 
        ExpiresByType text/css "access 8 hours" 
</IfModule>

En clair, on dit au navigateur que les fichiers image, Javascript ou CSS sont valables pendant 8 heures et qu'il est inutile d'interroger le serveur pendant cette période.

Il y a l'équivalent sur le wiki pour un serveur NGinX. Voir lignes après le commentaire "#cache control" dans le lien ci-dessous :
https://wiki.pluxml.org/installer/nginx/

Deevad · novembre 2018

Wow. Merci @Bazooka07 pour la documentation. J'ai donc fait une première intégration manuelle sur mon 5.5modifié:

https://framagit.org/peppercarrot/website/commit/138109983b5ae4275e238e7effbb7cb9599d8b89
https://framagit.org/peppercarrot/website/commit/c85a7962e6417ec98cbcacf8758fad54ad13dc93

Et ce qui prenait bien une trentaine de seconde à apparaître est quasi instantané à présent. Belle optimisation et un grand merci!

J’espère sincèrement que ce code rejoindra 5.7. De mon côté, je vais faire le nécessaire à la petite semaine pour aménager mes blogs et les rendre plus facile à mettre à jour quand PluXML sort une nouvelle version et marqué ce sujet comme résolu.

Stéphane · novembre 2018

@bazooka07: super d'avoir optimiser la procédure d'affichage du gestionnaire de médias.
@Deevad: vu le retour et la confirmation de l'optimisation que tu fais que je suis que P3ter l'intègrera

Haruka · novembre 2018

Stéphane a écrit:

@Deevad: vu le retour et la confirmation de l'optimisation que tu fais que je suis que P3ter l'intègrera

C'est fait ;-)

J'ai fait l'intégration sur la base des modifications proposées par bazooka07 (https://kazimentou.fr/article25/ameliorer-gestionnaire-medias). Deevad, est-ce que tu pourrais faire un test sur le version de PluXml en cours de dev (https://github.com/pluxml/PluXml), stp ?

bazooka07 · novembre 2018

@Deevad
Good news !!

J'ai continué mes investigations dans le code.
J'ai apporté d'autres corrections, essentiellement dans le fichier core/admin/medias.php. Suppression du genre :
- plxUtils::strCheck() sur des noms de fichiers (ben si on ne peut plus avoir confiance en Linux pour les noms de fichiers, on va-t-on... )
- utilisation de Javascript pour renseigner l'attribut target dans les balise <a>
- ....

Le dossier de médias est un fourre-tout. S'il contient des images (jpe?g|png|gif), il peut contenir d'autres formats d'images (svg) et d'autres types de fichiers json, csv, kmz (icones, texte, parcours à placer sur une carte), mp3, tableur), parfois mélangés aux photos.
Pour éviter de briser l'harmonie du tableau de medias, j'ai récupéré des icones pour ces fichiers qui s'affichent à la place des images. Cela fait plus pro.

Il y a d'autres corrections dans la feuille de style "core/admin/theme/theme.css". C'est mineur mais cela corrige des erreurs supplémentaires.
Pour voir toutes ces dernières modifs, le plus sûr est de cloner avec git la branche plxmedias-1811 depuis mon dépôt Github et de voir le ou les derniers commits
avec un outil comme Gitk ou d'éditer un patch.

En février, j'avais posté un push-request pour modifier l'overlay (quand on clique sur les vignettes) de façon à avoir un diaporama des vignettes et à centrer l'image.
C'est la branche medias-modalbox-1802 sur mon dépôt Github
J'ai tenté ce soir un "git rebase" sur le dernier commit de PluXml en date du 25/11 mais il n'est pas passé en automatique. Je vais devoir une nouvelle fois le faire à la main. Je vais regarder les corrections que demande Git et éventuellement faire un git merge dans la branch plxmedias-1811.

Attention : il y a des commits qui sont faits avec les fichiers core/admin/theme/{plucss,theme}.min.css. Cela n'a pas lieu d'être. Ces fichiers sont générés à partir de core/admin/theme/{plucss,theme}.css et peuvent être désynchroniser par rapport aux sources. Hélas, ils ne sont pas indexés dans le fichier .gitignore.

Pour l'instant, je continue mes développements sur le commit en date du 25/11 de PluXml.
Il est plus prudent pour l'instant d'en rester à cette version.
Ma branche principale echecs a beaucoup d'améliorations par rapport à la version actuelle de PluXml. La dernière fois que j'ai fait un "git rebase" sur cette branche après un "git pull upstream master", j'ai passé un temps fou à tout reprendre à la main et je n'ai pas tout vérifié. Je n'ai osé faire un "git pull origin master" de peur de perdre une branche stable en production.

bazooka07 · novembre 2018

Stéphane a écrit:

@bazooka07: super d'avoir optimiser la procédure d'affichage du gestionnaire de médias.
@Deevad: vu le retour et la confirmation de l'optimisation que tu fais que je suis que P3ter l'intègrera

Merci pour ton attention.

Comme tu le vois notre bête à plumes reprend des couleurs

Après une longue période de silence ( vacances ? ) les gens semblent se souvenir qu'il existe encore un forum.
Twitter s'en mêle aussi avec un tweet le 27/11/18. J'espère que tu l'as vu. Au cas où, il y a 2 sites à visiter :
https://blog.withachristianwife.com/2018/08/04/pluxml/
www.footfoot.tokyo/article7/pluxml-review
Si tu as des soucis pour visiter le site, n'hésites pas à demander de l'aide à Google (http://translate.google.fr)

Tu sais le nombre de pull-requests que j'ai posté ( https://github.com/pluxml/PluXml/network )
Je passe beaucoup de temps à maintenir ma branche de production echecs synchronisée avec la version actuelle de PluXml. les "git rebase" ne passent pas toujours automatiquement. Je pense que je vais être obligé de publier une version en parallèle en attendant que le retard soit rattrapé.

Avant de passer la main, je pense qu'il aurait été bien de publier la version 5.7 de PluXml. Après un an et demi de silence, cela aurait rassuré les utilsateurs. Et il y avait des évolutions intéressantes. Je ne maîtrise pas assez Git pour savoir s'il est possible de publier une release depuis ton dernier commit. Si tu peux réparer cet oubli ...

Je te souhaite bonne chance dans ta nouvelle vie et dans ta nouvelle région. J'y ai passé 4 ans et demi les gens y sont sympas et on s'habitue vite à leur accent. Et les montagnes ne sont pas loin. Certes les pentes y sont un peu raide.

Il y a une question qui me tourne dans la tête depuis un petit moment : PlxAdmin et PlxFeed sont dérivés de PlxMotor. Ce n'est pas le cas pour PlxShow.
Y a-t-il une raison particulière à cela ? En terme de sécurité, je ne vois aucune contrainte particulière.

Haruka · novembre 2018

bazooka07 a écrit:

Avant de passer la main, je pense qu'il aurait été bien de publier la version 5.7 de PluXml. Après un an et demi de silence, cela aurait rassuré les utilsateurs. Et il y avait des évolutions intéressantes. Je ne maîtrise pas assez Git pour savoir s'il est possible de publier une release depuis ton dernier commit. Si tu peux réparer cet oubli ...

Oui c'est possible grâce à la gestion des tags, c'est probablement ce que je vais faire pour essayer de sortir la 5.7 avant 2019.

bazooka07 · novembre 2018

[list=*]
[*]Stéphane est assez précautionneux pour valider un pull-request. On n'a pas trop de souci à se faire sur son aval[/*]
[*]Avant qu'il ne passe le témoin, il y a eu peu de gros commits pendant des mois [/*]
[*]je pense qu'il y a eu beaucoup de "béta-testeurs sauvages" qui ont discrètement testés la version disponible sur Github [/*]
[*]Cela fait plus d'un an et demi qu'il n'y a pas eu de publication[/*]
[*]il risque d'y avoir de gros changements dans les prochaines versions (gestionnaire de medias, robots.txt, editorial ?????, theme par defaut ?, install.php, urlrewriting, ...)[/*]
[/list]

Dans ces conditions, je pense qu'il n'est pas nécessaire d'attendre l'arrivée du Père Noêl pour publier la version 5.7 basé sur le dernier commit de Stéphane.

bazooka07 · novembre 2018

J'ai rebasé la branche medias-modalbox-1802, publlé en février, sur le commit du 25/11 de PluXml.
Vu les retards accumulés le "git rebase master" n'est pas totalement passé en automatique. Beaucoup d'interventions manuelles pour corriger des bouts de code. Cela a été comme un parcours de combattant avec lâcher de grenades. Mais on y arrive. C'est juste énormément chronophage. Pour les experts :

[== bash ==]
git [url]https://github.com/bazooka07/PluXml.git[/url] -b medias-modalbox-1802

Plus qu'un long discours, voilà à quoi ressemble la fenêtre modale quand on clique sur une vignette dans le gestionnaire de médias :

C'est quasiment un diaporama sans JQuery. Manque juste le défilement automatique et le "lazy loading"

bazooka07 · novembre 2018

J'ai publié une mise à jour de ma branche plxmedias-1811 sur mon dépôt Github.
J'ai mergé la branche medias-modalbox-1802 avec. Il y a encore fallu faire des interventions manuelles. Mais cela passe.
J'ai poursuivi dans medias.php en reprenant le code Javascript. Cela commence à être clean.
Dans le tableau des médias, j'utilise la "iconic font" Otello. Le hic est qu'il manque des icônes dans cette font.
Je vais créer une nouvelle branche pour faire une mise à jour du dossier medias-modalbox-1802. De plus il manque la licence et la page de démo.

Je découvre un autre bug Quand on veut trier les images en clliquant sur les titres des colonnes, on renvoie une requête sur le serveur ( délai de réponse 30secondes ?) alors qu'on a déjà tous les éléments dans la page HTML Il suffit qu'un bout de routine en javascript pour faire le tri.

Si vous avez du temps, h'hésitez pas à tester. Vu que tout cela est basé sur la version 5.6 de PluXml vos données ne seront pas modifiés. De toute façon, vous avez l'habitude de faire des sauvegardes

:

[== bash ==]
git clone https://github.com/bazooka07/PluXml.git -b plxmedias-1811

jack31 · novembre 2018

Hola Jean-Pierre

[del]Il semble q'uil manque des fichiers dans data/configuration etc...[/del]

[== Indéfini ==]
✗ ./ n'est pas accessible en écriture ou n'existe pas
✗ ./data/configuration/ n'est pas accessible en écriture ou n'existe pas
✗ ./data/configuration/plugins/ n'est pas accessible en écriture ou n'existe pas
✗ ./data/articles/ n'est pas accessible en écriture ou n'existe pas
✗ ./data/commentaires/ n'est pas accessible en écriture ou n'existe pas
✗ ./data/statiques/ n'est pas accessible en écriture ou n'existe pas
✗ ./data/medias/ n'est pas accessible en écriture ou n'existe pas
✗ ./plugins/ n'est pas accessible en écriture ou n'existe pas
✗ ./themes/ n'est pas accessible en écriture ou n'existe pas
✔ Module apache de réécriture d'url mod_rewrite disponible
✔ Bibliothèque GD installée
✔ Bibliothèque XML installée
✔ Fonction d'envoi de mail disponible

https://github.com/bazooka07/PluXml/tree/master/data

jack31 · novembre 2018

@bazooka07

Houps ! Je n'ai rien dis.

Sur mon serveur, ça fonctionne. C'était sans doute un problème de droit que je n'ai pas su gérer en local.

Désolé. :8

bazooka07 · novembre 2018

Je viens de publier une nouvelle mise à jour (commit) de ma branche de développement :
Grosse optimisation de la fonction recherche dans le tableau des médias

Avant j'ai fait une mise à jour des icônes fournies par la police icônique Fontello. il anquait en autre les icônes suivante : email, copier-coller, accueil, ...
Pour faciliter la mise à jour des icônes, j'ai modifié l'emplacement des fichiers. Maintenant, il suffit de récupérer l'archive ZIP sur http://fontello.com, de la dézipper dans le dossier core/admin/theme et de renommer le nouveau dossier en fontello. Pour employer ces icônes, voir ce qu'a fait Stéphane dans le fichier core/admin/auth.php ou moi-même dans le fichier core/admin/medias.php.

Pour récupérer la mise à jour si vous avez un "git clone" avant :
git pull origin plxmedias-1811

bazooka07 · décembre 2018

Oups, petit oubli à propos de la police icônique Fontello :
Pour voir les icônes disponibles, afficher la page suivante sur votre serveur :

[== Indéfini ==]
core/admin/theme/fontello/demo.html

Je parle bien sûr de la branche plxmedias-1811 que je vous propose.

Si vous souhaitez ajouter des iĉones à cette police, bien respecter l'ordre dans le quel vous cliquez les icônes. Regardez le fichier suivant pour cela

[== Indéfini ==]
core/admin/theme/fontello/css/fontello.css

bazooka07 · décembre 2018

Nouvelle mise à jour :
Le tableau de medias est trié directement dans le navigateur avec la librairie Javascript tableSort pour éviter des aller-retours avec le serveur et surtout éviter de repasser une nouvelle fois en revue la liste de dossiers de datas/medias pour trouver des fichiers (image, pdf, csv, , ...) :
http://tristen.ca/tablesort/demo/
Petit bonus : on peut maintenant trier sur la taille et l'extension des fichiers

Comme d'hab. : git clone ... ou git pull...

bazooka07 · décembre 2018

Nouvelle mise à jour :

Elle concerne principalement le tri initial des médias en PHP
Quand on recherche des médias dans un dossier, on retourne une liste triée selon le dernier $_POST qui n'est pas forcément le tri alphabétique.
On peut trier selon le nom, la taille ou la date du fichier en secondes. Auparavant le tri sur les dates se faisait sur le jour affiché dans le tableau.

Comme d'hab. : git clone ... ou git pull...

bazooka07 · décembre 2018

Nouveau commit avec les modifs suivantes pour optimiser de l'envoi d'un lot de fichiers

- Fix l'attribut multiple et ajout attribut accept dans <input type="file" /> ( avant : multiple="multiple" n'est pas légal )
- Révision de plxUtils::makeThumb() : plus clair, plus efficace
- création de la fonction plxMedias::uploadMultiFiles() et plxMedias::__move_uploaded_image() pour optimiser la réception d'un lot de fichier
- A réception des fichiers : vérification du mimetype au lieu de l'extension des noms de fichiers
- Contrôle avant envoi des fichiers (taille individuelle, du lot, ..)
- Aperçu des fichiers avant envoi.
- A réception de nouveaux fichiers, le tri des médias est par date décroissante

Il me reste encore à essayer d'ajouter une barre de progression pendant l'envoi des fichiers et j'aurai fini le tour des problèmes avec les médias

bazooka07 · décembre 2018

Je viens de publier un nouveau commit sur Github avec la gestion d'une barre de progression pendant l'envoi des fichiers sur le serveur.
J'utilise une variable de session "Session Upload Progress" comme expliqué sur le site de PHP :
http://php.net/manual/en/session.upload-progress.php
Il y a également différentes corrections mineures.

Pour tester, choisir une des solutions ci-dessous :
- avec Git : git clone https://github.com/bazooka07/PluXml.git -b plxmedias-1811"
- en téléchargeant l'archive PluXml-plxmedias-1811.zip sur mon site :
https://kazimentou.fr/static8/download (page de téléchargement)
https://kazimentou.fr/download/ZG93bmxvYWQvUGx1WG1sLXBseG1lZGlhcy0xODExLnppcCo2YTY4YjI, (lien direct)

[Résolu] Gestionnaire de médias qui rame et saturé, trop de dossiers

Réponses