close
  • chevron_right

    Debian Stretch sur BTRFS compressé sur HDD vs XFS sur HDD (et également Debian Buster sur SSD)

    Adrien Dorsaz – Friday, 8 November - 20:38 edit

Sur le même PC, j'ai 3 installations de Debian. Elles ne sont pas tout à fait équivalentes: Debian Buster est mon installation que j'utilise tous les jours, les deux installations de Stretch sont pour développer LinuxFr.

Bien sûr, pour LinuxFr, seul une installation suffit, mais sebsauvage a diffusé une très bonne idée: troquer la lenteur de mon disque dur contre un peu de puissance du CPU (j'ai un i7 sur un Thinkpad T420s de 2011).

Déjà, ça m'a permis de découvrir que le mode expert de Debian est vraiment chouette, tu peux faire tout ce que tu veux entre 2 étapes. Merci beaucoup à Debian-Facile pour ce sujet avancé sur l'installation avec sous-volumes de Debian (je ne l'ai pas tout à fait suivi, mais il m'a bien aidé) !

Debian Buster sur SSD avec partition XFS et GNOME:

Startup finished in 8.458s (kernel) + 29.377s (userspace) = 37.836s 
graphical.target reached after 29.138s in userspace

Debian Stretch sur HD avec partition XFS et GNOME (environ 15Go de disque):

Startup finished in 9.566s (kernel) + 1min 9.430s (userspace) = 1min 18.997s 
graphical.target reached after 1min 9.386s in userspace

Debian Stretch sur le même HD avec partition BTRFS compressée et GNOME (environ 9Go de disque):

Startup finished in 9.362s (kernel) + 34.590s (userspace) = 43.953s 
graphical.target reached after 34.534s in userspace

Le SSD est donc toujours très utile, car il m'évite d'utiliser mon CPU pour décompresser les fichiers et sa Debian a certainement plus d'outils qui y sont installés.

Par contre, BTRFS compressé me fait gagner pas mal de place pour une install quasi équivalente et surtout le temps de démarrage est bien plus rapide ! J'imagine que ça doit aussi améliorer les perfs du serveur web local, mais je ne vais pas trop tester.

J'aime bien: je perd certainement un peu plus de temps pendant les installations et mises à jour, mais grâce à ça le reste des opérations est plus rapide :-)

  • chevron_right

    Adrien Dorsaz – Saturday, 5 October - 08:57 edit

    This mail exactly describes my issue with Vala and Gdk Event. Sadly, it was sent 9 years ago and didn't received any response DISAPPOINTED FACE
    Update: I've found the solution, see comments SMILING FACE WITH SMILING EYES

  • chevron_right

    Contact publication

    Adrien Dorsaz – Tuesday, 1 October - 20:22

La vitesse de la lumière: je connaissais le temps pour faire "soleil → terre" (~8 minutes), mais je ne me suis jamais dis que "la lumière peut faire 7.5 tours ennemis de la terre en 1 seconde". C'est tellement rapide, sur les 40'000 KM de la terre que c'est vraiment presque "instantané", alors que c'est très "lent" en comparaison des distances des galaxies !
  • chevron_right

    Nouveau design pour l'espace de rédaction pour LinuxFr

    Adrien Dorsaz – Saturday, 8 June, 2019 - 20:01

J'ai proposé récemment la fusion des modifications de LinuxFr qui permettent la mise en place du début du nouveau design proposé par mjourdan.

Ajouter des images d'en-tête aux dépêches

Ici, l'idée semble assez simple à être mise en place, puisque LinuxFr utilise déjà CarrierWave et ImageMagick pour gérer l'envoi des avatars utilisateurs.

C'est donc le premier point que j'ai voulu traiter et, finalement, c'est celui qui m'a pris le plus de temps.

Tout d'abord, il m'a fallu me former aux concepts de Ruby on Rails (leur tutoriel est vraiment bien fait !).

Ensuite, j'ai débuté l'ajout de l'image aux dépêches, mais ça ne marchait pas. Pourtant, ce n'est pas bien compliqué, CarrierWave est vraiment simple à mettre en place !

J'ai donc repris le tutoriel, pas à pas, pour bien apprendre toutes les étapes de création de Model, Vues et Controlleurs et les formulaires pour la transmission des données.

Les tutoriels pour CarrierWave disponibles étaient assez simples aussi, mais je n'y arrivais toujours pas. J'ai donc recommencé de zéro un projet avec Ruby on Rails, suivi le tutoriel de démarrage pour mettre en place un petit projet. Ensuite, j'ai suivi un tutoriel pour ajouter des images avec CarrierWave et tout a fonctionné sans problème.

Je reprends le code de LinuxFr, je vérifie à nouveau que tout est bien fait comme dans l'autre projet. Mais aucune image n'arrive sur le serveur. J'étais prêt à baisser les bras, jusqu'à ce que je me rende compte que l'espace de rédaction utilise ajax pour envoyer les modifications au serveur. Je commence à lire le code CoffeeScript (c'est sympa, comme langage, je ne connaissais pas non plus !) et ce que je vois semble correct. Je regarde les requêtes réseaux et aucune image n'est transmise avec mon formulaire.

A force de chercher, je tombe sur des forums qui expliquent que JavaScript est incapable de lire les fichiers stockés sur disque. C'est bien dommage, parce qu'ajax est bien pratique dans l'espace de rédaction pour éditer les textes. Heureusement, je vois qu'ajax a eu des mises à jour avec HTML5 et qu'il est maintenant capable d'envoyer des fichiers avec l'API FormData. Je vérifie la compatiblité des navigateurs et, heureusement, la plupart des navigateurs sont aujourd'hui compatibles.

Créer un système d'onglet pour afficher la tribune, les détails et les informations

Maintenant que je comprends bien comment LinuxFr est construit, je m'attèle au deuxième challenge: ajouter un système d'onglet sur l'espace de rédaction pour éviter d'afficher trop d'informations en même temps aux rédacteurs.

Là, je remercie fortement le Hollandais Volant pour avoir écrit ses articles qui expliquent bien la puissance de CSS et comment bien l'utiliser avec JavaScript.

Après avoir fait ça, je me dis que c'est dommage que l'aide Markdown n'est plus affichée pour les premiers utilisateurs. Et là, je me rends compte que mjourdan avait déjà prévu ça dans son design :) L'idée est simple: quand l'utilisateur commence l'édition d'un paragraphe, on active l'onglet d'aide à l'édition. Ensuite, à la fin de l'édition, on affiche à nouveau la tribune.

Comme je m'étais déjà pris la tête avec les requêtes ajax, j'ai trouvé très rapidement comment appliquer ce comportement :)

Rendre le design utilisable sur les téléphones mobiles

Le nouveau design utilise une structure à 3 colonnes. C'est sympa pour les grands écrans, mais ça ne marche pas bien pour les écrans plus petits comme ceux des tablettes ou les smartphones. Quand j'avais ajouté les icônes de téléchargement sur les boutons Markdown et Epub, j'ai appris qu'il ne fallait pas utiliser les CSS Grid, car la technologie est encore un peu trop récente.

Heureusement, CSS avait déjà une autre solution plus simple, c'est les FlexBox. J'ai suivi ce guide assez complet et les pages de Mozilla pour mettre en place tout ceci. Au début, je me suis trompé et j'ai utilisé Flex à l'ancienne, comme si j'avais à faire à des div avec l'affichage réglé par des float. Finalement, j'ai réussi à utiliser correctement Flex pour lui décrire ce que je voulais faire avec mes 3 colonnes et ça marche plutôt bien :)

Un autre point qui est intéressant pour les mobiles est de leur faire éviter de télécharger une image immense pour lui faire un rendu en petit. J'ai découvert que les navigateurs assez récents peuvent utiliser l'attribut srcset pour choisir automatiquement quelle image est la plus intéressante à télécharger pour son écran. Ce qui est chouette, c'est que c'est un nouvel attribut, alors même si votre navigateur ne le connaît pas, il sera toujours capable d'afficher l'image disponible dans l'attribut src.

Essayer d'être compatible avec IE

Internet Explorer est encore présent et je voulais voir si c'était possible de garder l'espace de rédaction plus ou moins compatible avec lui. Heureusement pour moi, FormData et Flex sont plus ou moins disponibles dans IE :)

Mon système d'onglet avec CSS + JavaScript fonctionne sur les nouvelles dépêches, mais est inutilisable sur d'autres... bizarre. Je regarde la console JavaScript disponible sur IE et je me rends compte qu'il y a un bug sur la tribune quand un message est disponible !

IE 10 n'est en fait pas compatible avec la propriété dataset des éléments DOM et du coup, on ne peut pas utiliser JavaScript pour ajouter directement des données dans les éléments <time> de la tribune. Je n'avais pas vu que le problème était simplement ça, il y a peut-être un moyen d'écrire un code compatible avec IE10.

Pour l'instant, j'ai juste évité de faire bugger complètement JavaScript sous IE avec le contrôle if(x.dataset) avant de l'utiliser. Maintenant, IE n'a plus ce bug JavaScript et donc la rédaction fonctionne à nouveau correctement :)

Garder l'espace de modération compatible avec l'affichage actuel aux utilisateurs

Pour l'espace de modération, j'ai essayé de faire converger les deux mondes: utiliser les nouveaux panneaux de l'espace de rédaction, mais garder le rendu de la dépêche tel qu'il sera fait après publication. Je me suis dit que ça aiderait les modérateurs.

Différences avec le design

Je me suis arrêté là, ça faisait déjà pas mal de changements :) Il reste encore quelques différences avec le design:

  • Par simplicité, j'ai mis les boutons de publications sur le panneau de gauche avec le sommaire et les liens
  • Dans la tribune, quand un message est posté, il est affiché sans avatars
  • L'historique dans les détails est complètement caché par défaut. Le design prévoyait d'afficher les 5 derniers et de mettre un bouton "tout afficher".
  • Dans l'onglet détail, on ne peut pas directement éditer le titre, la catégorie et la licence.
  • Dans l'onglet détail, on ne peut pas ajouter de Tags (ce n'était déjà pas disponible et je n'ai pas trouvé de moyen rapide de le faire).

Conclusion

Tout n'est pas parfait, mais je pense que je suis arrivé à un point où c'est déjà utilisable pour la plupart des rédacteurs :-)

J'espère que cet article vous plaît et que vous serez motivé à également mettre à jour LinuxFr !

En plus des points ci-dessus, on a encore du pain sur la planche :-)

Les nimages

L'espace de rédaction d'une dépêche sans image d'entête: L

L'espace de rédaction d'une dépêche avec image d'entête: L

L'espace hybride de modération: L

Les images dans l'accueil: L

  • favorite

    1 Like

    Timothée Jaussoin