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 !

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 '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 OMG, Eliot. No need to thank neither in double!

just teasing ya. I did the double reply too the other day :blobpats:

@eliotberriot J'ai pas tout suivi et c'est un peu HS mais Funkwhale procure des descriptions oembed ?

@nicod_ je suis en train de bosser dessus, mais oui j'ai implémenté de l'open graph basique, oembed et là je suis en train de travailler sur le widget proprement dit :)

@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... youtube.com/watch?v=aV8DEJ8ydJ

@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

@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 :/

@eliotberriot
Tu peux adapter selon la largeur disponible : logo seul ou logo + typo si y'a la place
@Troll

@eliotberriot c'est très joli !!

(et la musique de la horde du contrevent, hihi :3 )

@eliotberriot (tu as pas oublié sur ton mot tu dis que tu me dédies la prochaine release :"D )

Sign in to participate in the conversation
Mastodon.eliotberriot.com

mastodon.eliotberriot.com is one server in the network