Curseur de chargement horizontal

Ça a l’air bien !

Cliquez sur les liens de ce menu (en dehors des menus déroulants) affiche toujours le spinner :

1 « J'aime »

Actuellement, c’est réglé sur 2px, mais si vous utilisez un écran HiDPI avec mise à l’échelle (par exemple un MacBook Retina), cela pourrait se rapprocher de 1px sur votre écran. Je vais l’augmenter à 3px aujourd’hui.

Vous avez raison, l’expérience utilisateur est un peu incohérente pour le moment. C’est un défi d’un point de vue technique. Le curseur de chargement est actuellement connecté au routeur Ember, il n’apparaît donc que lors des transitions de route Ember. Certains états de « chargement » dans l’interface ne correspondent pas réellement à des transitions de route Ember… il faudra réfléchir à la manière de rendre cela plus cohérent.

9 « J'aime »

J’attends avec beaucoup d’enthousiasme le support des hautes résolutions (DPI). Peut-être donner aux administrateurs du site le choix entre le curseur de chargement et une roue de chargement rénovée (tousse tousses :wink:) ?

1 « J'aime »

Cela a été augmenté à 3 px, donc cela devrait être un peu plus visible.

Les administrateurs peuvent tout personnaliser via un composant de thème, donc si les sites souhaitent conserver un indicateur de chargement en rotation, cela sera possible :slight_smile:

12 « J'aime »

@meghna a publié Custom Loading Spinner Component, ce qui est une excellente façon d’exploiter les icônes SVG FontAwesome, qui fonctionnent à tous les niveaux de DPI.

7 « J'aime »

J’adore absolument ça et je suis d’accord avec @codinghorror pour dire que cela devrait être intégré au cœur du système par défaut.

20 « J'aime »

Je pense avoir résolu ce problème : le spinner de chargement ne devrait plus apparaître dans toutes les vues de la liste des sujets.

9 « J'aime »

Sur l’iPad, le curseur de chargement ne s’affiche pas du tout. (iPad 5e génération… je crois. iOS 14, application DiscourseHub)

image

Voir la GIF ^

5 « J'aime »

Bonne détection, merci @CaptainZac. J’ai apporté quelques ajustements afin que cela fonctionne désormais dans la vue PWA/DiscourseHub sur iPad.

J’ai également ajouté la valeur top de 1 px nécessaire pour DiscourseHub sur iPhone. La hauteur complète de 3 px est maintenant visible dans l’application et semble correspondre de manière raisonnable au curseur propre à DiscourseHub.

7 « J'aime »

J’aime beaucoup :+1: Très bon travail ! :slightly_smiling_face:

2 « J'aime »

Il semble que le curseur de chargement ne s’active pas à la place du chargeur en forme de roue crantée sur la page d’accueil lors du clic sur le logo.

Enregistrement d'écran 2021-02-04 à 21.32.58|vidéo

4 « J'aime »

Parfait, commencez à l’utiliser – merci !

2 « J'aime »

Cela devrait être résolu maintenant, merci !

7 « J'aime »

Le problème avec les diaporamas, c’est qu’ils peuvent en réalité sembler plus lents (même si la page se charge plus rapidement).

La raison en est que rien ne se passe pour le contenu principal de la page tant que celle-ci n’a pas fini de se charger – contrairement à la version avec l’indicateur de chargement, où la page devient blanche immédiatement après le clic. Autrement dit, quelque chose de significatif se produit immédiatement, par opposition à un événement significatif qui se produit après un délai.

6 « J'aime »

Oui, c’est vrai, et c’est aussi quelque chose dont nous discutons en interne. Garder tout l’ancien contenu à l’écran signifie qu’il n’y a aucun retour immédiat après avoir cliqué sur un lien. Je viens de pousser une modification qui (partiellement) estompe le contenu de la page pendant le chargement. (cc @awesomerobot)

Au départ, je l’avais fait disparaître complètement, mais nous nous retrouvions alors avec une page blanche. Je pense qu’un opacité de 20 % pourrait être un bon compromis. Assez de retour, mais pas trop choquant ? :thinking:

Pour l’instant, cela estompe tout l’élément #main-outlet. Malheureusement, je ne pense pas qu’il y ait un moyen de cibler le {{outlet}} de la route qui est en cours de chargement… mais j’aimerais bien être contredit. Je pense que la seule solution serait de remplacer tous les {{outlet}} dans notre code par un composant wrapper personnalisé…

18 « J'aime »

De mieux en mieux… :sunglasses:

7 « J'aime »

Niveau de jeu supérieur : enregistrez la durée moyenne des requêtes et faites en sorte que l’animation de fondu dure le même temps :rofl:

14 « J'aime »

Super. Ça semble beaucoup mieux. :100::+1:

3 « J'aime »

C’est mieux, David… mais cela semble toujours plus lent. Je ne suis pas sûr que cela change, sauf si l’effet est aussi frappant qu’avec le spinner, à vrai dire. Cela peut aussi être une caractéristique du curseur, surtout s’il se termine toujours. En effet, la page aura fini de charger (ou semblera avoir fini de charger) avant que le curseur ne termine… pourtant, c’est le curseur qui servira d’indicateur de chargement de la page et non la page elle-même, car il est très visible.

6 « J'aime »

https://meta.discourse.org/u/golaxo/summary
Si nous cliquons depuis une vue de profil sur le logo Discourse, la partie supérieure disparaît, ce qui paraît étrange.

3 « J'aime »