https://dev-eole.ac-dijon.fr/https://dev-eole.ac-dijon.fr/favicon.ico2018-10-10T17:14:42ZEnsemble Ouvert Libre Évolutifeole-dispatcher - Anomalie #25517: Lenteur de chargment du bureau avec Firefoxhttps://dev-eole.ac-dijon.fr/issues/25517?journal_id=1227382018-10-10T17:14:42ZChristophe LEONchristophe.leon@ac-reunion.fr
<ul><li><strong>Statut</strong> changé de <i>Nouveau</i> à <i>En attente d'informations</i></li></ul><p>Peux tu préciser la version de FF ?</p>
<p>Chez moi sous chrome </p>
<pre><code><code> +11ms => 11ms : STARTING<br />21:05:06.827 VM1325:31 +1ms => 12ms : window.WebComponents already charged<br />21:05:06.827 VM1325:31 +1ms => 13ms : Polymer already charged<br />21:05:06.985 VM1325:31 +157ms => 170ms : polymer version master<br /></code></code></pre>
<p>Sous FF 61.0.2 (64 bits) =================</p>
<pre><code><code> +5ms => 5ms : STARTING import.js:31:3<br /> +2ms => 7ms : window.WebComponents already charged import.js:31:3<br /> +542ms => 549ms : polymer version master</code></code></pre>
<p>entre la ligne STARTING et la ligne polymer version master c'est le chargement de polymer qui est réalisé <br />a voir s'il y a une version compatible plus récente de polymer pour FF ou si des plugins particulier ralenti le chargement<br />peut être voir coté onglet network que tout polymer est bien en cache sur le navigateur</p> eole-dispatcher - Anomalie #25517: Lenteur de chargment du bureau avec Firefoxhttps://dev-eole.ac-dijon.fr/issues/25517?journal_id=1227462018-10-11T07:00:19ZRenaud Dussolrdussol@ac-nice.fr
<ul></ul><p>Chez moi : FF 62.0.3</p>
<p>Mais le phénomène se produit depuis longtemps</p>
<p>La piste du plugin est intéressante : peut-être un adblocker ou un truc comme ça, je vais vérifier</p>
<p>Auquel cas cela expliquerait pourquoi les personnes se plaignant sont plutôt en général des utilisateurs "avancés"</p>
<p>Sur polymer, effectivement j'ai vu quelques trucs hier soir, notamment des API Phantom qui ne seraient pas otpimisées pour FF, mais j'ai survolé</p>
<p>Je regarde tout ça</p> eole-dispatcher - Anomalie #25517: Lenteur de chargment du bureau avec Firefoxhttps://dev-eole.ac-dijon.fr/issues/25517?journal_id=1227712018-10-11T07:42:14ZRenaud Dussolrdussol@ac-nice.fr
<ul></ul><p>Rien de mieux en désactivant les extensions</p>
<p>Par contre fais plusieurs essais avec FF car les temps sont très aléatoires : je viens d'avoir un chargement de polymer à 450 ms, un autre à 1533ms, un autre à 520ms et un autre à 2148ms... (par contre j'avais "disable cache" coché</p>
<p>Je fais quelques essais sur la prod (hier c'était sur le serveur de test) en décochant bien "disable cache" cette fois : <br />Chrome à gauche du slash, FF à droite, les essais sont séparés par des |</p>
<p>polymer version master : 188ms / 3831ms | 402ms / 3275ms | 194ms / 2856ms<br />RECIEVE REMOTE CACHE : 383ms / 1757ms | 847ms / 1732ms | 462ms / 2063ms<br />Waiting for Ressources... : 1900ms / 2731ms | 1631ms / 3867ms | 1991ms / 3806ms<br />[STEP2 FEDE] : écart non significatif sur les 2 premiers essais... 3eme essai : 147ms / 3258ms<br />[TOKEN] 0060087M : 574ms / 3271ms au premier essai, écart quasi nul sur les suivants <br />Récupération des messages : 251ms / 1150ms | 151ms / 3011ms | 212ms / 1476ms<br />A noter que j'ai actuellement 2 chargements des ressources PP et donc 2 appels à la récupération des messages : il s'agit ici du 2eme, le premier ne montre pas d'écart signiificatif, au contraire souvent FF est plus rapide que Chrome dans ce cas...</p>
<p>A chaque fois, globalement on a un bureau chargé :</p>
<p>- Sous chrome : en 7-8s après le 1er chargement PP, 11-12 s après le 2eme, et 15-16s lors de l'event "CACHE USED" qui semble marquer la fin de tout<br />- Sous FF : en 12-13 s après le 1er chargement PP, 18-19 s apres le 2eme, et 21-22 s à CACHE USED</p> eole-dispatcher - Anomalie #25517: Lenteur de chargment du bureau avec Firefoxhttps://dev-eole.ac-dijon.fr/issues/25517?journal_id=1228112018-10-11T13:39:26ZRenaud Dussolrdussol@ac-nice.fr
<ul></ul><p>Tester avec le X3 pour voir si notre template n'aggrave pas l'écart entre les 2 navigateurs<br />Car à la Réunion l'écart n'est pas aussi important que chez nous</p> eole-dispatcher - Anomalie #25517: Lenteur de chargment du bureau avec Firefoxhttps://dev-eole.ac-dijon.fr/issues/25517?journal_id=1228362018-10-11T14:40:41ZRenaud Dussolrdussol@ac-nice.fr
<ul></ul><p>Aucune amélioration en utilisant le samples/x3, donc ce n'est pas lié au template</p>
<p>PAR CONTRE : maintenant que je commence à être habitué, je remarque quelques différences dans les outputs de chrome et firefox</p>
<p>1) une ligne que je vois systématiquement dans chrome et pas dans firefox :</p>
<pre><code>+0ms => 36ms : Polymer already charged</code></pre>
<p>et qui arrive juste avant "polymer version master"</p>
<p>2) Une erreur qui est bien présente dans les 2, mais qui arrive beaucoup plus tôt dans Chrome (presque au début) :</p>
<pre>
+1ms => 534ms : starts elements loading
DevTools failed to parse SourceMap: https://esterel.ac-nice.fr/edispatcher/ng/public/assets/js/md5.min.js.map
+855ms => 1389ms : RECIEVE REMOTE CACHE
</pre>
<p>Alors que dans firefox elle arrive complètement à la fin :</p>
<pre>
+1ms => 12525ms : => AJAX
Source map error: SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data
Resource URL: https://esterel.ac-nice.fr/edispatcher/ng/public/assets/js/v1.0+2-47
Source Map URL: md5.min.js.map[Learn More]
+4664ms => 17189ms : CACHE USED : 0.19 hour(s)
</pre>
<p>Bon déjà ce n'est peut-être pas normal que j'ai cette erreur (j'ai vérifié, elle est présente aussi sur METICE, donc ça ne doit pas être bien grave, mais peut-être faut-il corriger ?), mais le fait qu'elle soit traitée à des moments très différents m'interpelle...</p>
<p>Et d'autre part ce "Polymer already charged" indique clairement qu'un événement est détecté par chrome (présence de polymer en cache ?) et pas par FF</p> eole-dispatcher - Anomalie #25517: Lenteur de chargment du bureau avec Firefoxhttps://dev-eole.ac-dijon.fr/issues/25517?journal_id=1228372018-10-11T14:45:39ZRenaud Dussolrdussol@ac-nice.fr
<ul></ul><p>Correspond à :<br /><pre><code class="javascript syntaxhl"><span class="CodeRay">
<span class="keyword">if</span> (<span class="keyword">typeof</span> Polymer == <span class="string"><span class="delimiter">'</span><span class="content">undefined</span><span class="delimiter">'</span></span>) {
edispatcher_import(_EDISPATCHER+<span class="string"><span class="delimiter">"</span><span class="content">/ng/public/polymer</span><span class="delimiter">"</span></span>+_POLYMERVERSION+<span class="string"><span class="delimiter">"</span><span class="content">/polymer.html</span><span class="delimiter">"</span></span>);
} <span class="keyword">else</span> {
console.log(<span class="string"><span class="delimiter">"</span><span class="content">Polymer already charged</span><span class="delimiter">"</span></span>)
}
</span></code></pre></p>
<p>Dans import.js</p> eole-dispatcher - Anomalie #25517: Lenteur de chargment du bureau avec Firefoxhttps://dev-eole.ac-dijon.fr/issues/25517?journal_id=1228502018-10-11T16:03:09ZRenaud Dussolrdussol@ac-nice.fr
<ul></ul><p>En fait, en ajoutant plusieurs logs sur le typeof Polymer, je m'aperçois que dans Firefox, durant tout le import.js, typeof Polymer est à undefined</p>
<p>Ce qui a pour conséquence que la plupart des chargements ne se font pas...</p>
<pre><code>Polymer.Base.importHref( [_EDISPATCHER_ELEMENTS_PATH]) ne se fait pas<br /> timerPolymer=setInterval(function() {<br /> if (typeof Polymer 'undefined') return; > s'arrête ici</code></pre>
<p>De toutes façons Polymer n'étant pas reconnu à ce moment là, cela retournerait une erreur</p>
<p>A la fin du import.js, Polymer est toujous undefined</p>
<p>DONC en fait, dans firefox, import.js NE FAIT RIEN (enfin si il charge les css, bootstrap et les fonts)<br />Alors que dans Chrome , j'ai l'impression qu'une grosse partie du boulot a déjà été fait...</p>
<p>Alors qu'au début de elements.html, si j'ajoute un typeof Polymer dans la console : j'ai bien "function"</p>
<p>Qu'est-ce qui se passe entre import.js et elements.html ?</p>
<p>Qu'est-ce qui a fait que Polymer a été enfin reconnu ?</p>
<p>.......</p>
<p>J'ai l'impression que dans la timeline de FF, import.js est systématiquement chargé en premier (juste après le template)</p>
<p>et polymer.html arrive bien aprés</p>
<p>Alors que dans chrome, import.js arrive après les chargements de jquery, bootstrap, webcomponents et... polymer.html</p>
<p>Donc dans FF, quand import.js s'exécute, il n'a pas encore reçu polymer...</p>
<p>Je ne sais pas à quoi c'est dû... j'ai essayé de déplacer l'appel à import.js au début du body dans layout.twig.html, j'ai essayé d'enlever le random tag, pour voir si ça ne venait pas de là, mais rien à faire, import.js est systématiquement appelé en premier, en tout cas TOUJOURS avant polymer.html</p>
<p>Je pense que bcp de problèmes viennent de là</p> eole-dispatcher - Anomalie #25517: Lenteur de chargment du bureau avec Firefoxhttps://dev-eole.ac-dijon.fr/issues/25517?journal_id=1228512018-10-11T16:11:50ZRenaud Dussolrdussol@ac-nice.fr
<ul></ul><p>Comportement identique sur METICE, je viens de faire un test</p> eole-dispatcher - Anomalie #25517: Lenteur de chargment du bureau avec Firefoxhttps://dev-eole.ac-dijon.fr/issues/25517?journal_id=1228782018-10-12T09:18:41ZRenaud Dussolrdussol@ac-nice.fr
<ul></ul><p>Apparemment Chrome est le seul navigateur a bien gérer les HTML imports</p>
<p>Références (pour Firefox) : <br /><a class="external" href="https://developer.mozilla.org/en-US/docs/Web/Web_Components/HTML_Imports">https://developer.mozilla.org/en-US/docs/Web/Web_Components/HTML_Imports</a></p>
<p>Une solution qui semble donner satisfaction est d'ajouter un enventListener sur le chargement complet des ressources nécessaires au premier script utilisant un import, comme décrit ici :</p>
<p><a class="external" href="https://stackoverflow.com/questions/25819898/using-polymer-to-include-jquery-via-html-imports-not-working-in-safari-and-firef">https://stackoverflow.com/questions/25819898/using-polymer-to-include-jquery-via-html-imports-not-working-in-safari-and-firef</a></p>
<p>Si je modifie le import.js.twig en ajoutant un eventListener au chargement de Polymer, cela accélère nettement le chargement de Polymer et c'est globalement plus rapide</p>
<p>Sinon, autre piste (qui pourrait expliquer pourquoi chez toi cela met moins de temps ) :</p>
<p>Apparemment une option permet d'activer la gestion des imports HTML dans Firefox</p>
<p>dom.webcomponents.customelements.enabled<br />dom.webcomponents.shadowdom.enabled</p>
<p>Par défaut elles sont à FALSE, peux-tu vérifier si c'est le cas sur tes Firefox ?</p>
<p>Sources :</p>
<p><a class="external" href="https://stackoverflow.com/questions/33686393/link-rel-import-not-working-in-mozila-firefox">https://stackoverflow.com/questions/33686393/link-rel-import-not-working-in-mozila-firefox</a><br /><a class="external" href="https://caniuse.com/#feat=imports">https://caniuse.com/#feat=imports</a></p>
<p>Je vais tester sur ma prod (sans la modif de import.js) et sur le serveur de test avec cette valeur modifiée</p> eole-dispatcher - Anomalie #25517: Lenteur de chargment du bureau avec Firefoxhttps://dev-eole.ac-dijon.fr/issues/25517?journal_id=1229002018-10-12T11:59:31ZRenaud Dussolrdussol@ac-nice.fr
<ul></ul><p>Effectivement en activant ces options cela semble plus rapide</p>
<p>Toujours moins que Chrome mais globalement on gagne 2-3 s par rapport à avant</p>
<p>C'est encourageant, sachant que le FF est (je crois bien) déployé en établissement par des scripts donc on peut ajouter l'activation de cette option sur les déploiements (ou au moins au Rectorat)</p>
<p>La première astuce est finalement décevante : le eventListener fonctionne, mais il attend le chargement de polymer, qui prend autant de temps qu'avant... Donc on a bien "polymer already charged" mais il prend autant de temps à se charger...</p>
<p>Il faudrait voir s'il n'y a pas une alternative au HTML import</p> eole-dispatcher - Anomalie #25517: Lenteur de chargment du bureau avec Firefoxhttps://dev-eole.ac-dijon.fr/issues/25517?journal_id=1229362018-10-12T15:19:46ZRenaud Dussolrdussol@ac-nice.fr
<ul></ul><p>En fait je viens de comprendre :</p>
<p>Dans chrome tout est chargé par les imports HTML<br />On peut carrément supprimer le JS webcomponents, cela fonctionne</p>
<p>Dans Firefox, tout est géré par webcomponents.js, le HTML import ne fonctionne pas (enfin, il se met à fonctionner une fois que webcomponents a lancé ses listeners)</p>
<p>C'est un fonctionnement "dégradé", non optimisé, et c'est moins rapide</p>
<p>Je ne pense pas qu'il y ait de solution...</p>
<p>En fait la solution serait (si j'ai bien tout compris ) de passer sur Polymer 3 qui utilise ES6</p> eole-dispatcher - Anomalie #25517: Lenteur de chargment du bureau avec Firefoxhttps://dev-eole.ac-dijon.fr/issues/25517?journal_id=1229422018-10-12T15:28:23ZRenaud Dussolrdussol@ac-nice.fr
<ul></ul><p>Les options de about:config améliorent quand même le chargement</p>
<p>Malheureusement cela ne dispense pas de l'utilisation des webcomponents pour charger Polymer</p> eole-dispatcher - Anomalie #25517: Lenteur de chargment du bureau avec Firefoxhttps://dev-eole.ac-dijon.fr/issues/25517?journal_id=1229452018-10-15T05:36:53ZChristophe LEONchristophe.leon@ac-reunion.fr
<ul><li><strong>Fichier</strong> <a href="/attachments/download/2790/eDispatcher_FF.mov">eDispatcher_FF.mov</a> ajouté</li><li><strong>Fichier</strong> <a href="/attachments/download/2791/out-4.ogv">out-4.ogv</a> ajouté</li></ul><p>J'ai passé quelques optimisations, notamment</p>
<p>- :acf82738 , qui permet de générer une url d'import js de la forme <code>/edispatcher/ng/importjs/<id du user>/<version_ed>/<flags></code> au lieu de <code>/edispatcher/ng/import.js?<flags></code><br /> la suppression du passage des flags en paramètre de query permet au navigateur de cacher cette url. La version et le id du suer sont mis dans l'url pour garantir un cache de l'url par user et en fonction de la version de eDispatcher</p>
<p>- :c4e922df , la détection des zones arena n'était pas en cache un <code>&& false</code> traînait sur le test de la présence du cache</p>
<p>- :077f0244 , Cache-control directive pour /edispatcher/ng/public, permettant d'indiquer au navigateur de cacher tous les templates</p>
<p>En PJ une vidéo du chargement avec FF , chargement complet sur 3 sources ( Arena, Rectorat, eDispatcher acad ) en ~ 4s<br />correspond à la 8s sur la vidéo</p>
<p>Un constat intéressant , si je charge le bureau console de dev fermée et que je l'ouvre ensuite le temps de chargement de polymer est de l'ordre de 400ms<br />Sous FF console de dev fermé le bureau se charge en moins de 5s (cf pj out-4.ogv )</p> eole-dispatcher - Anomalie #25517: Lenteur de chargment du bureau avec Firefoxhttps://dev-eole.ac-dijon.fr/issues/25517?journal_id=1229632018-10-15T07:57:31ZRenaud Dussolrdussol@ac-nice.fr
<ul></ul><p>Je n'ai qu'un mot : génial !<br />Merci, je vais tester ces modifs sur notre serveur de test<br />J'ai fait quelques essais chez moi ce WE</p>
<p>Sur safari : HYPER rapide (presque mieux que Chrome), c'est d'autant plus étonnant que caniuse indique que Safari semble ne pas supporter les imports HTML non plus<br />Sur Firefox Windows : même comportement que mon FF linux du boulot, même en activant les options du about:config<br />Sur Edge : mêmes lenteurs que sous FF. On dirait qu'on est face au même problème</p>
<p>Il y a un truc qu'il faut que je creuse : ce sont tous les navigateurs alternatifs qui sont basés sur moteurs chromium, comme Brave par exemple, qui est très bien et que j'utilise personnellement de + en +<br />L'idée étant d'offrir une alternative aux utilisateurs qui seraient grincheux d'avoir à utiliser uniquement chrome</p> eole-dispatcher - Anomalie #25517: Lenteur de chargment du bureau avec Firefoxhttps://dev-eole.ac-dijon.fr/issues/25517?journal_id=1233662018-10-18T14:51:07ZRenaud Dussolrdussol@ac-nice.fr
<ul><li><strong>Statut</strong> changé de <i>En attente d'informations</i> à <i>Accepté</i></li><li><strong>% réalisé</strong> changé de <i>0</i> à <i>90</i></li></ul><p>Pour moi les fix semblent donner satisfaction concernant ce problème</p>
<p>Le plantage potentiel posé par le "async" sur le importjs semble avoir été réglé par le passage au "defer"</p>
<p>Je passe à 90%, on attend quelques temps et on pourra passer à résolu si pas de nouveau pb détecté...</p> eole-dispatcher - Anomalie #25517: Lenteur de chargment du bureau avec Firefoxhttps://dev-eole.ac-dijon.fr/issues/25517?journal_id=1235752018-10-23T05:13:44ZChristophe LEONchristophe.leon@ac-reunion.fr
<ul></ul><p>Pour infos firefox 63, qui vient de sortir, supporte les webcomponents.</p>
<p><a class="external" href="https://developer.mozilla.org/en-US/docs/Web/Web_Components">https://developer.mozilla.org/en-US/docs/Web/Web_Components</a></p> eole-dispatcher - Anomalie #25517: Lenteur de chargment du bureau avec Firefoxhttps://dev-eole.ac-dijon.fr/issues/25517?journal_id=1245622018-11-14T09:28:37ZChristophe LEONchristophe.leon@ac-reunion.fr
<ul><li><strong>Statut</strong> changé de <i>Accepté</i> à <i>Résolu</i></li><li><strong>Version cible</strong> mis à <i>Envole 5.12</i></li><li><strong>% réalisé</strong> changé de <i>90</i> à <i>100</i></li></ul> eole-dispatcher - Anomalie #25517: Lenteur de chargment du bureau avec Firefoxhttps://dev-eole.ac-dijon.fr/issues/25517?journal_id=1256462018-11-29T14:30:37ZArnaud FORNEROTafornerot@cadoles.com
<ul><li><strong>Statut</strong> changé de <i>Résolu</i> à <i>Fermé</i></li></ul>