aboutsummaryrefslogtreecommitdiff
path: root/files/fr/tools/memory/dom_allocation_example
diff options
context:
space:
mode:
authorFlorian Merz <me@fiji-flo.de>2021-02-11 12:36:08 +0100
committerFlorian Merz <me@fiji-flo.de>2021-02-11 12:36:08 +0100
commit39f2114f9797eb51994966c6bb8ff1814c9a4da8 (patch)
tree66dbd9c921f56e440f8816ed29ac23682a1ac4ef /files/fr/tools/memory/dom_allocation_example
parent8260a606c143e6b55a467edf017a56bdcd6cba7e (diff)
downloadtranslated-content-39f2114f9797eb51994966c6bb8ff1814c9a4da8.tar.gz
translated-content-39f2114f9797eb51994966c6bb8ff1814c9a4da8.tar.bz2
translated-content-39f2114f9797eb51994966c6bb8ff1814c9a4da8.zip
unslug fr: move
Diffstat (limited to 'files/fr/tools/memory/dom_allocation_example')
-rw-r--r--files/fr/tools/memory/dom_allocation_example/index.html54
1 files changed, 54 insertions, 0 deletions
diff --git a/files/fr/tools/memory/dom_allocation_example/index.html b/files/fr/tools/memory/dom_allocation_example/index.html
new file mode 100644
index 0000000000..0f3a4b04d6
--- /dev/null
+++ b/files/fr/tools/memory/dom_allocation_example/index.html
@@ -0,0 +1,54 @@
+---
+title: Exemple d'allocation DOM
+slug: Outils/Memory/DOM_allocation_example
+translation_of: Tools/Memory/DOM_allocation_example
+---
+<div>{{ToolsSidebar}}</div><p>Cet article décrit une page web très simple qui sera utilisée pour illustrer certaines fonctionnalités de l'outil Mémoire.</p>
+
+<p>Il est possible de visiter le site à l'adresse : <a href="https://mdn.github.io/performance-scenarios/dom-allocs/alloc.html">https://mdn.github.io/performance-scenarios/dom-allocs/alloc.html</a>.</p>
+
+<p>Cette page contient simplement un script qui crée un grand nombre de noeuds DOM :</p>
+
+<pre class="brush: js">var toolbarButtonCount = 20;
+var toolbarCount = 200;
+
+function getRandomInt(min, max) {
+ return Math.floor(Math.random() * (max - min + 1)) + min;
+}
+
+function createToolbarButton() {
+ var toolbarButton = document.createElement("span");
+ toolbarButton.classList.add("toolbarbutton");
+ // empêche Spidermonkey de partager les instances
+ toolbarButton[getRandomInt(0,5000)] = "foo";
+ return toolbarButton;
+}
+
+function createToolbar() {
+ var toolbar = document.createElement("div");
+ // empêche Spidermonkey de partager les instances
+ toolbar[getRandomInt(0,5000)] = "foo";
+ for (var i = 0; i &lt; toolbarButtonCount; i++) {
+ var toolbarButton = createToolbarButton();
+ toolbar.appendChild(toolbarButton);
+ }
+ return toolbar;
+}
+
+function createToolbars() {
+ var container = document.getElementById("container");
+ for (var i = 0; i &lt; toolbarCount; i++) {
+ var toolbar = createToolbar();
+ container.appendChild(toolbar);
+ }
+}
+
+createToolbars();</pre>
+
+<p>Voici une représentation en pseudo-code de ce que fait ce code :</p>
+
+<pre>createToolbars()
+ -&gt; createToolbar() // appelé 200 fois. Crée un élément DIV à chaque fois
+ -&gt; createToolbarButton() // appelé 20 fois par <em>toolbar</em>, crée un élément SPAN à chaque fois</pre>
+
+<p>Ainsi, au total ce code crée 200 objets <code><a href="/fr/docs/Web/API/HTMLDivElement">HTMLDivElement</a></code>, et 4000 objets <code><a href="/fr/docs/Web/API/HTMLSpanElement">HTMLSpanElement</a></code>.</p>