diff options
Diffstat (limited to 'files/fr/outils/frise_chronologique/index.html')
| -rw-r--r-- | files/fr/outils/frise_chronologique/index.html | 24 |
1 files changed, 24 insertions, 0 deletions
diff --git a/files/fr/outils/frise_chronologique/index.html b/files/fr/outils/frise_chronologique/index.html new file mode 100644 index 0000000000..6fd67b4022 --- /dev/null +++ b/files/fr/outils/frise_chronologique/index.html @@ -0,0 +1,24 @@ +--- +title: Frise chronologique +slug: Outils/Frise_chronologique +tags: + - Gecko + - Guide + - Tools +translation_of: Tools/Performance/Waterfall +--- +<div>{{ToolsSidebar}}</div><p>La frise chronologique suit à la trace les opérations réalisées par Gecko, le moteur du navigateur.Il faut aller dans les <a href="/en-US/docs/Tools/Tools_Toolbox#Settings_2">the devtools options des outils de developemment</a> pour activer la frise chronologique.</p> + +<p>Pour le moment, la frise chronologique couvre les éléments suivants :</p> + +<ul> + <li><em>reflows</em> (aussi appelés <em>Layout</em>) : Le moteur a calculé la géométrie d'un ou plusieurs nœuds.</li> + <li><em>restyle </em>: le style a été recalculé.</li> + <li><em>paint </em>: une partie de la page a été redessinée.</li> + <li><em>console </em>: appels à la fonction <code>console.time(label)</code> et/ou <code>console.timeEnd(label)</code>;</li> + <li><a href="/fr/docs/Web/Events"><em>Éènements DOM</em></a> : les évènements tel que "click", "input", "keydown" etc...</li> +</ul> + +<p>Les opérations reflows, restyle et paint ont lieu dans le "thread" principal et peut retarder ou être retardé à cause des opérations lentes (reflows, exécution de script, beaucoup de restyle, etc...).</p> + +<p><img alt="Timeline Screenshot" src="https://mdn.mozillademos.org/files/8883/timeline.png" style="height: 728px; width: 879px;"></p> |