Bon le widget d'embed commence à ressembler à quelque chose !
le widget en lui même fait 5 appels HTTP pour un total d'un peu moins de 300Kb (non gzippé). C'est purement statique, donc en cache côté client après le premier chargement. Il faut rajouter à ça un ou deux appels API (si on loade un album), un appel pour charger la cover de l'album et un appel pour l'audio proprement dit.
À côté de ça, le widget de Soundcloud fait 29 requêtes HTTP pour un poid total de 1.5Mb, et celui de deezer 29 requêtes pour 5Mb !
Pour l'app Funkwhale, on en est malheureusement pas à ce niveau de performance (déjà parce que l'app fait beaucoup plus de choses), mais je prends les choses très à coeur pour le widget, car il est destiné à être inclut sur des sites tiers, son potentiel de nuisance est donc beaucoup, beaucoup plus élevé
Second iteration of #Funkwhale's embed widget today, with:
- Multi tracks mode (as seen on first video)
- Better color palette thanks to @Troll
- Better accessibility (the whole think is now usable from keyboard only)
- Embed wizard inside Funkwhale to generate embed code, with preview (first video)
- Tweaks to have a responsive widget on really small widths
- Tests on my personnal website (second video)
- Other styling tweaks
I'm so happy to have this included in the next release!
@eliotberriot il a pas besoin de changer de taille
@Thib oui il se redimensionne très bien, c'est assez cool !
@eliotberriot Alors, je comprends pas grand chose, mais je realise que si j'avais essayé d'uutiliser un hypothétique soundcloud pour écouter une musique, a l'époque de ma connexion internet de quand j'étais enfant, le loading d'un seul morceau m'aurait pris 1h... https://www.youtube.com/watch?v=aV8DEJ8ydJQ
@soza en fait quand tu visite une page qui contient un widget comme celui sur lequel je travaille (ou le player youtube, par exemple, c'est pareil), c'est comme si ton navigateur chargeait deux pages en même temps:
- La page que tu visite qui elle-même fait appel à
- La page qui contient le widget
Et chaque page web appelle généralement d'autres ressources (images, styles, scripts, polices…)
Du coup, ça peut très, très vite faire beaucoup d'allers-retours sur le réseau
@eliotberriot merci :) okay je comprends le principe je pense. Du coup avec ton widget, l'appel pour commencer a charger le son est moins demandant en resosurce que celui de ces autres plate-forme que tu cite
@soza voilà, c'est exactement ça :)
@eliotberriot
c'est pour l'intégrer a des sites web ? ou c'est pour l'intégration dans la fediverse ?
@Troll potentiellement les deux (j'ai pas trop creusé la façon dont les embed sont gérés dans Mastodon / Pleroma pour le moment)
@eliotberriot
c'est un petit détail mais si tu tiens a conserver la typo "funkwhale" je verrais mieux le logo et typo en haut a droite pour gagner de l'espace et réduire la taille en largeur.
@Troll j'ai tenté, mais ça peut poser un problème quand le titre est un peu long et le widget un peu étroit :/
@Troll après on peut aussi retirer la typo et laisser que le logo
@eliotberriot @Troll That is super awesome :-)
@eliotberriot c'est très joli !!
(et la musique de la horde du contrevent, hihi :3 )
@Nausicaa merci, je suis content que ça te plaise :3
@eliotberriot Ahhhhh Marduuuuub !!! 😍 @Nausicaa
@eliotberriot (tu as pas oublié sur ton mot tu dis que tu me dédies la prochaine release :"D )
@Nausicaa Faudrait des noms de version avec des pseudos du Fediverse @eliotberriot
@Nausicaa c'est dans ma todo list :D
@eliotberriot fort bien, fort bien
c'est la première fois que je dois concevoir un bout d'interface qui va potentiellement être inclut dans beaucoup, beaucoup de sites différents, c'est un challenge intéressant !