Bonjour,
Je ne sais pas dans quelle catégorie je suis, alors je poste ici
Je prépare un panneau d'affichage piloté par un Raspberry Pi 3 (RPi), il s'agit juste de mettre en ligne un gros slide avec des grosses images (1920 x 1080) et du texte… le tout en boucle
.
Le RPi est bracnhé sur une TV fullHD, Chromium marche très bien MAIS rien n'est fluide à la moindre animation CSS3, transform + opacity, on chute autour de 12 FPS voir moins.
Actuellement, le slide tourne avec GSAP, mais je teste un simpe JS + class en css pour voir si on gagne un peu de fluidité…
Sans animation (en cut) le passage d'une slide à l'autre n'est vraiment pas claire. Avec amour, gloire et autres, ça ne me dérange pas de réécrire mon code pour le rendre plus performant.
J'ai plein de tests à faire, mais je me demande si je ne dois pas améliorer ma méthodologie pour être plus pertinent, si vous avez des conseils
Comment savoir ou prévoir le résultat sans passer par le RPi (comme Rendering dans l'inspecteur de Chrome mais en mieux), même si à l'œil on voit que ce n'est pas fluide, un chiffre de performance serait mieux ?
Le transform sur SVG me semble plus performant que sur une div, ça vaut le cout de faire le slide en SVG ?
Faut-il mettre du flex ou grid ou position:absolute ?
Si je veux faire un overlay en dégradé, j'utilise :after ou un box-shadow inset ?
Peut-on changer le FPS de Chromium ou du RAF sur les transition ou animation CSS ?
Je ne sais pas dans quelle catégorie je suis, alors je poste ici
Je prépare un panneau d'affichage piloté par un Raspberry Pi 3 (RPi), il s'agit juste de mettre en ligne un gros slide avec des grosses images (1920 x 1080) et du texte… le tout en boucle
.Le RPi est bracnhé sur une TV fullHD, Chromium marche très bien MAIS rien n'est fluide à la moindre animation CSS3, transform + opacity, on chute autour de 12 FPS voir moins.
Actuellement, le slide tourne avec GSAP, mais je teste un simpe JS + class en css pour voir si on gagne un peu de fluidité…
Sans animation (en cut) le passage d'une slide à l'autre n'est vraiment pas claire. Avec amour, gloire et autres, ça ne me dérange pas de réécrire mon code pour le rendre plus performant.
J'ai plein de tests à faire, mais je me demande si je ne dois pas améliorer ma méthodologie pour être plus pertinent, si vous avez des conseils
Comment savoir ou prévoir le résultat sans passer par le RPi (comme Rendering dans l'inspecteur de Chrome mais en mieux), même si à l'œil on voit que ce n'est pas fluide, un chiffre de performance serait mieux ?
Le transform sur SVG me semble plus performant que sur une div, ça vaut le cout de faire le slide en SVG ?
Faut-il mettre du flex ou grid ou position:absolute ?
Si je veux faire un overlay en dégradé, j'utilise :after ou un box-shadow inset ?
Peut-on changer le FPS de Chromium ou du RAF sur les transition ou animation CSS ?