Bonjour,
J’ai un dashboard avec des widgets pour gérer l’arrosage de la maison. ça fonctionne très bien seulement j’ai un clignotement à chaque rafraichissement de la base de données. Ce phénomène est souvent plus accentué si je me connecte à distance à travers un VPN.
Auriez vous une explication ?
Bonjour,
tout d’abord je vous félicite pour ces widgets riches, compacts et fonctionnels. 
Le code source pourrait intéresser certains utilisateurs de la communauté.
Dissociez la déclaration des variables et des datasources dans un widget isolé, utilisez des variables globales qui seront alors appelées dans les widgets HTML.
bonne journée
Merci @fgtoul , je me suis servi des exemples trouvés sur le forum ( dont les tiens 
) et en tâtonnant je suis arrivé à ça.
Par contre,
Dissociez la déclaration des variables et des datasources dans un widget isolé, utilisez des variables globales qui seront alors appelées dans les widgets HTML.
Pourrais tu me préciser un peu ? je ne parle pas le html ni autre langage, même sous la torture ! 
Cordialement
peux-tu publier le code d’un widget ?
Voici :
var SVa="0";
var SVb="29";
var SVc="30";
var SVd="19";
var RLa="0";
var titre1="P 1 à 4";
var titre2="Fréq :4J";
var titre3="Durée :1H30";
var titre4="Heure : 3H00";
var titre5="Prochain arrosage dans ";
var titre6="jour(s) ";
var Compteur = datasources["IPX800_V4_N2"]["response"]["cpt0"]
return `
<span style="margin-left:15px;color:#13ff00;font-size: 15px;">${titre1}</span>
<input type="button" id="bouton2" class="bouton2 vout${SVa} btnV4vout${SVa}" style="margin-left:30px;margin-top: 15px;width: 80px;" name="Interdit|Autorisé" onclick="newAJAXCommand('io.cgi?vout=${SVa}');" value="off">
<input type="button" id="bouton2" class="bouton2 led${RLa} btnV4led${RLa}" style="margin-left:3px;margin-top: 15px;width: 90px;" name="Arrêt|En cours" onclick="newAJAXCommand('io.cgi?rly=${RLa}');" value="off">
<span style="margin-left:10px;color:#ffffff;">${titre2}</span>
<span style="margin-left:28px;color:#ffffff;">${titre3}</span>
<span style="margin-left:15px;color:#ffffff;">${titre4}</span>
<input type="button" id="bouton2" class="bouton2 vout${SVd} btnV4vout${SVd}" style="margin-left:7px;margin-top: 15px;width: 80px;" name="Forçage|Forçage" onclick="newAJAXCommand('io.cgi?vout=${SVd}');" value="off">
<input type="button" id="bouton2" class="bouton2 vout${SVb} btnV4vout${SVb}" style="margin-left:5px;margin-top: 15px;width: 80px;" name="+1 jour|+1 jour" onclick="newAJAXCommand('io.cgi?vout=${SVb}');" value="off">
<input type="button" id="bouton2" class="bouton2 vout${SVc} btnV4vout${SVc}" style="margin-left:5px;margin-top: 15px;width: 80px;" name="-1 jour|-1 jour" onclick="newAJAXCommand('io.cgi?vout=${SVc}');" value="off">
<span style="margin-left:20px;color:#fcd774;">${titre5}</span>
<span style="margin-left:15px;color:#fcd774;">${Compteur}</span>
<span style="margin-left:15px;color:#fcd774;">${titre6}</span>
`;
en fait ce qui fait clignoter le widget, c’est le texte des boutons 1 et 2 qui change en fonction de l’état des sorties virtuelles correspondantes.
Les 3 derniers boutons, ayant un texte identique quel que soit leur état, ne sont pas concernés.
Dans le code ci-dessous, j’ai ajouté 2 variables txtBtn1 et txtBtn2 qui initialiseront correctement les boutons.
var SVa="0";
var SVb="29";
var SVc="30";
var SVd="19";
var RLa="0";
var titre1="P 1 à 4";
var titre2="Fréq :4J";
var titre3="Durée :1H30";
var titre4="Heure : 3H00";
var titre5="Prochain arrosage dans ";
var titre6="jour(s) ";
var Compteur = datasources["IPX800_V4_N2"]["response"]["cpt0"];
txtBtn1=((datasources["IPX800_V4_N2"]["response"]["vout"+SVa]==0) ? "Interdit":"Autorisé");
txtBtn2=((datasources["IPX800_V4_N2"]["response"]["led"+RLa]==0) ? "Arrêt":"En cours");
return `
<span style="margin-left:15px;color:#13ff00;font-size: 15px;">${titre1}</span>
<input type="button" id="bouton2" class="bouton2 vout${SVa} btnV4vout${SVa}" style="margin-left:30px;margin-top: 15px;width: 80px;" name="Interdit|Autorisé" onclick="newAJAXCommand('io.cgi?vout=${SVa}');" value="${txtBtn1}">
<input type="button" id="bouton2" class="bouton2 led${RLa} btnV4led${RLa}" style="margin-left:3px;margin-top: 15px;width: 90px;" name="Arrêt|En cours" onclick="newAJAXCommand('io.cgi?rly=${RLa}');" value="${txtBtn2}">
<span style="margin-left:10px;color:#ffffff;">${titre2}</span>
<span style="margin-left:28px;color:#ffffff;">${titre3}</span>
<span style="margin-left:15px;color:#ffffff;">${titre4}</span>
<input type="button" id="bouton2" class="bouton2 vout${SVd} btnV4vout${SVd}" style="margin-left:7px;margin-top: 15px;width: 80px;" name="Forçage|Forçage" onclick="newAJAXCommand('io.cgi?vout=${SVd}');" value="Forçage">
<input type="button" id="bouton2" class="bouton2 vout${SVb} btnV4vout${SVb}" style="margin-left:5px;margin-top: 15px;width: 80px;" name="+1 jour|+1 jour" onclick="newAJAXCommand('io.cgi?vout=${SVb}');" value="+1 jour">
<input type="button" id="bouton2" class="bouton2 vout${SVc} btnV4vout${SVc}" style="margin-left:5px;margin-top: 15px;width: 80px;" name="-1 jour|-1 jour" onclick="newAJAXCommand('io.cgi?vout=${SVc}');" value="-1 jour">
<span style="margin-left:20px;color:#fcd774;">${titre5}</span>
<span style="margin-left:15px;color:#fcd774;">${Compteur}</span>
<span style="margin-left:15px;color:#fcd774;">${titre6}</span>
`;