11cb0ef41Sopenharmony_ci<!DOCTYPE html>
21cb0ef41Sopenharmony_ci<!-- Copyright 2020 the V8 project authors. All rights reserved.
31cb0ef41Sopenharmony_ciUse of this source code is governed by a BSD-style license that can be
41cb0ef41Sopenharmony_cifound in the LICENSE file. -->
51cb0ef41Sopenharmony_ci<html lang="en">
61cb0ef41Sopenharmony_ci<head>
71cb0ef41Sopenharmony_ci  <meta charset="UTF-8">
81cb0ef41Sopenharmony_ci  <title>Indicium</title>
91cb0ef41Sopenharmony_ci  <!-- <link rel="icon" type="image/png" href="/images/favicon.png"/> -->
101cb0ef41Sopenharmony_ci
111cb0ef41Sopenharmony_ci  <link rel="modulepreload" href="./helper.mjs" >
121cb0ef41Sopenharmony_ci  <link rel="modulepreload" href="./view/log-file-reader.mjs" >
131cb0ef41Sopenharmony_ci  <link rel="modulepreload" href="./view/helper.mjs" >
141cb0ef41Sopenharmony_ci  <link rel="preload" href="../js/log-file-reader-template.html" as="fetch" crossorigin="anonymous">
151cb0ef41Sopenharmony_ci  <script type="module">
161cb0ef41Sopenharmony_ci    // Force instatiating the log-reader before anything else.
171cb0ef41Sopenharmony_ci    import "./view/log-file-reader.mjs";
181cb0ef41Sopenharmony_ci    // Delay loading of the main App
191cb0ef41Sopenharmony_ci    (async function() {
201cb0ef41Sopenharmony_ci      let module = await import('./index.mjs');
211cb0ef41Sopenharmony_ci      globalThis.app = new module.App();
221cb0ef41Sopenharmony_ci    })();
231cb0ef41Sopenharmony_ci  </script>
241cb0ef41Sopenharmony_ci  <link rel="stylesheet" type="text/css" href="./index.css">
251cb0ef41Sopenharmony_ci  <style>
261cb0ef41Sopenharmony_ci    #container.initial {
271cb0ef41Sopenharmony_ci      display: none;
281cb0ef41Sopenharmony_ci    }
291cb0ef41Sopenharmony_ci
301cb0ef41Sopenharmony_ci    #timeline-panel {
311cb0ef41Sopenharmony_ci      width: 100%;
321cb0ef41Sopenharmony_ci    }
331cb0ef41Sopenharmony_ci
341cb0ef41Sopenharmony_ci    .panels {
351cb0ef41Sopenharmony_ci      display: grid;
361cb0ef41Sopenharmony_ci      align-content: center;
371cb0ef41Sopenharmony_ci      grid-template-columns: repeat(auto-fill, minmax(500px, 1fr));
381cb0ef41Sopenharmony_ci      grid-auto-flow: row dense;
391cb0ef41Sopenharmony_ci      grid-gap: 10px;
401cb0ef41Sopenharmony_ci      margin-top: 10px;
411cb0ef41Sopenharmony_ci    }
421cb0ef41Sopenharmony_ci
431cb0ef41Sopenharmony_ci    dt::after  {
441cb0ef41Sopenharmony_ci      content: ":";
451cb0ef41Sopenharmony_ci    }
461cb0ef41Sopenharmony_ci  </style>
471cb0ef41Sopenharmony_ci</head>
481cb0ef41Sopenharmony_ci
491cb0ef41Sopenharmony_ci<body>
501cb0ef41Sopenharmony_ci  <tool-tip id="tool-tip" style="will-change: transform"></tool-tip>
511cb0ef41Sopenharmony_ci
521cb0ef41Sopenharmony_ci  <section id="file-reader">
531cb0ef41Sopenharmony_ci    <log-file-reader id="log-file-reader"></log-file-reader>
541cb0ef41Sopenharmony_ci  </section>
551cb0ef41Sopenharmony_ci
561cb0ef41Sopenharmony_ci  <section id="container" class="initial">
571cb0ef41Sopenharmony_ci    <timeline-panel id="timeline-panel">
581cb0ef41Sopenharmony_ci      <timeline-track-tick id="tick-track" title="Samples"></timeline-track-tick>
591cb0ef41Sopenharmony_ci      <timeline-track-timer id="timer-track" title="Timers"></timeline-track-timer>
601cb0ef41Sopenharmony_ci      <timeline-track-map id="map-track" title="Map"></timeline-track-map>
611cb0ef41Sopenharmony_ci      <timeline-track id="ic-track" title="IC"></timeline-track>
621cb0ef41Sopenharmony_ci      <timeline-track id="deopt-track" title="Deopt"></timeline-track>
631cb0ef41Sopenharmony_ci      <timeline-track id="code-track" title="Code"></timeline-track>
641cb0ef41Sopenharmony_ci    </timeline-panel>
651cb0ef41Sopenharmony_ci
661cb0ef41Sopenharmony_ci    <div class="panels">
671cb0ef41Sopenharmony_ci      <script-panel id="script-panel"></script-panel>
681cb0ef41Sopenharmony_ci      <code-panel id="code-panel"></code-panel>
691cb0ef41Sopenharmony_ci      <map-panel id="map-panel"></map-panel>
701cb0ef41Sopenharmony_ci      <list-panel id="ic-list" title="IC List">
711cb0ef41Sopenharmony_ci        <div class="legend">
721cb0ef41Sopenharmony_ci          <h3>Legend</h3>
731cb0ef41Sopenharmony_ci          <dl>
741cb0ef41Sopenharmony_ci            <dt>0</dt>
751cb0ef41Sopenharmony_ci            <dd>uninitialized</dd>
761cb0ef41Sopenharmony_ci            <dt>X</dt>
771cb0ef41Sopenharmony_ci            <dd>no feedback</dd>
781cb0ef41Sopenharmony_ci            <dt>1</dt>
791cb0ef41Sopenharmony_ci            <dd>monomorphic</dd>
801cb0ef41Sopenharmony_ci            <dt>^</dt>
811cb0ef41Sopenharmony_ci            <dd>recompute handler</dd>
821cb0ef41Sopenharmony_ci            <dt>P</dt>
831cb0ef41Sopenharmony_ci            <dd>polymorphic</dd>
841cb0ef41Sopenharmony_ci            <dt>N</dt>
851cb0ef41Sopenharmony_ci            <dd>megamorphic</dd>
861cb0ef41Sopenharmony_ci            <dt>G</dt>
871cb0ef41Sopenharmony_ci            <dd>generic</dd>
881cb0ef41Sopenharmony_ci          </dl>
891cb0ef41Sopenharmony_ci        </div>
901cb0ef41Sopenharmony_ci      </list-panel>
911cb0ef41Sopenharmony_ci      <list-panel id="map-list" title="Map Events"></list-panel>
921cb0ef41Sopenharmony_ci      <list-panel id="deopt-list" title="Deopt Events"></list-panel>
931cb0ef41Sopenharmony_ci      <list-panel id="code-list" title="Code Events"></list-panel>
941cb0ef41Sopenharmony_ci    </div>
951cb0ef41Sopenharmony_ci  </section>
961cb0ef41Sopenharmony_ci
971cb0ef41Sopenharmony_ci  <div class="panels">
981cb0ef41Sopenharmony_ci    <section id="instructions" class="panel">
991cb0ef41Sopenharmony_ci      <h2>Instructions</h2>
1001cb0ef41Sopenharmony_ci      <div class="panelBody">
1011cb0ef41Sopenharmony_ci        <p>
1021cb0ef41Sopenharmony_ci          Unified web interface to analyse runtime information stored in the v8 log.
1031cb0ef41Sopenharmony_ci        </p>
1041cb0ef41Sopenharmony_ci        For generating a v8.log file from <a href="https://v8.dev/docs/build">d8</a>:
1051cb0ef41Sopenharmony_ci        <ul>
1061cb0ef41Sopenharmony_ci          <li>
1071cb0ef41Sopenharmony_ci            <code>/path/do/d8 $LOG_FLAGS $FILE</code>
1081cb0ef41Sopenharmony_ci          </li>
1091cb0ef41Sopenharmony_ci        </ul>
1101cb0ef41Sopenharmony_ci        For generating a v8.log file from Chrome:
1111cb0ef41Sopenharmony_ci        <ul>
1121cb0ef41Sopenharmony_ci          <li>
1131cb0ef41Sopenharmony_ci            <code>/path/to/chrome --user-data-dir=/var/tmp/chr$RANDOM --no-sandbox
1141cb0ef41Sopenharmony_ci            --js-flags='$LOG_FLAGS’
1151cb0ef41Sopenharmony_ci            $WEBSITE_URL</code>
1161cb0ef41Sopenharmony_ci          </li>
1171cb0ef41Sopenharmony_ci        </ul>
1181cb0ef41Sopenharmony_ci
1191cb0ef41Sopenharmony_ci        <h3><code>LOG_FLAGS</code>:</h3>
1201cb0ef41Sopenharmony_ci        <dl class="d8-options">
1211cb0ef41Sopenharmony_ci          <dt>
1221cb0ef41Sopenharmony_ci            <a href="https://source.chromium.org/search?q=FLAG_log_all">
1231cb0ef41Sopenharmony_ci              <code>--log-all</code>
1241cb0ef41Sopenharmony_ci            </a>
1251cb0ef41Sopenharmony_ci          </dt>
1261cb0ef41Sopenharmony_ci          <dd>Enable all V8 logging options.</dd>
1271cb0ef41Sopenharmony_ci          <dt>
1281cb0ef41Sopenharmony_ci            <a href="https://source.chromium.org/search?q=FLAG_trace_maps">
1291cb0ef41Sopenharmony_ci              <code>--log-maps</code>
1301cb0ef41Sopenharmony_ci            </a>
1311cb0ef41Sopenharmony_ci          </dt>
1321cb0ef41Sopenharmony_ci          <dd>
1331cb0ef41Sopenharmony_ci              Log <a href="https://v8.dev/blog/fast-properties">Maps</a>
1341cb0ef41Sopenharmony_ci          </dd>
1351cb0ef41Sopenharmony_ci          <dt>
1361cb0ef41Sopenharmony_ci            <a href="https://source.chromium.org/search?q=FLAG_log_ic">
1371cb0ef41Sopenharmony_ci              <code>--log-ic</code>
1381cb0ef41Sopenharmony_ci            </a>
1391cb0ef41Sopenharmony_ci          </dt>
1401cb0ef41Sopenharmony_ci          <dd>
1411cb0ef41Sopenharmony_ci            Log <a href="https://mathiasbynens.be/notes/shapes-ics">ICs</a>
1421cb0ef41Sopenharmony_ci          </dd>
1431cb0ef41Sopenharmony_ci          <dt>
1441cb0ef41Sopenharmony_ci            <a href="https://source.chromium.org/search?q=FLAG_log_source_code">
1451cb0ef41Sopenharmony_ci              <code>--log-source-code</code>
1461cb0ef41Sopenharmony_ci            </a>
1471cb0ef41Sopenharmony_ci          </dt>
1481cb0ef41Sopenharmony_ci          <dd>Log source code</dd>
1491cb0ef41Sopenharmony_ci          <dt>
1501cb0ef41Sopenharmony_ci            <a href="https://source.chromium.org/search?q=FLAG_log_code_disassemble">
1511cb0ef41Sopenharmony_ci              <code>--log-code-disassemble</code>
1521cb0ef41Sopenharmony_ci            </a>
1531cb0ef41Sopenharmony_ci          </dt>
1541cb0ef41Sopenharmony_ci          <dd>Log detailed generated generated code</dd>
1551cb0ef41Sopenharmony_ci          <dt>
1561cb0ef41Sopenharmony_ci            <a href="https://source.chromium.org/search?q=FLAG_log_code">
1571cb0ef41Sopenharmony_ci              <code>--log-code</code>
1581cb0ef41Sopenharmony_ci            </a>
1591cb0ef41Sopenharmony_ci          </dt>
1601cb0ef41Sopenharmony_ci          <dd>Log details about deoptimized code</dd>
1611cb0ef41Sopenharmony_ci          <dt>
1621cb0ef41Sopenharmony_ci            <a href="https://source.chromium.org/search?q=FLAG_log_deopt">
1631cb0ef41Sopenharmony_ci              <code>--log-deopt</code>
1641cb0ef41Sopenharmony_ci            </a>
1651cb0ef41Sopenharmony_ci          </dt>
1661cb0ef41Sopenharmony_ci          <dd>Log various API uses.</dd>
1671cb0ef41Sopenharmony_ci          <dt>
1681cb0ef41Sopenharmony_ci            <a href="https://source.chromium.org/search?q=FLAG_prof">
1691cb0ef41Sopenharmony_ci              <code>--prof</code>
1701cb0ef41Sopenharmony_ci            </a>
1711cb0ef41Sopenharmony_ci          </dt>
1721cb0ef41Sopenharmony_ci          <dd>Log ticks from the sampling profiler.</dd>
1731cb0ef41Sopenharmony_ci        </dl>
1741cb0ef41Sopenharmony_ci
1751cb0ef41Sopenharmony_ci        <h3>Keyboard Shortcuts for Navigation</h3>
1761cb0ef41Sopenharmony_ci        <dl>
1771cb0ef41Sopenharmony_ci          <dt><kbd>A</kbd></dt>
1781cb0ef41Sopenharmony_ci          <dd>Scroll left</dd>
1791cb0ef41Sopenharmony_ci
1801cb0ef41Sopenharmony_ci          <dt><kbd>D</kbd></dt>
1811cb0ef41Sopenharmony_ci          <dd>Sroll right</dd>
1821cb0ef41Sopenharmony_ci
1831cb0ef41Sopenharmony_ci          <dt><kbd>SHIFT</kbd> + <kbd>Arrow Up</kbd></dt>
1841cb0ef41Sopenharmony_ci          <dd>Follow Map transition forward (first child)</dd>
1851cb0ef41Sopenharmony_ci
1861cb0ef41Sopenharmony_ci          <dt><kbd>SHIFT</kbd> + <kbd>Arrow Down</kbd></dt>
1871cb0ef41Sopenharmony_ci          <dd>Follow Map transition backwards</dd>
1881cb0ef41Sopenharmony_ci
1891cb0ef41Sopenharmony_ci          <dt><kbd>Arrow Up</kbd></dt>
1901cb0ef41Sopenharmony_ci          <dd>Go to previous Map chunk</dd>
1911cb0ef41Sopenharmony_ci
1921cb0ef41Sopenharmony_ci          <dt><kbd>Arrow Down</kbd></dt>
1931cb0ef41Sopenharmony_ci          <dd>Go to next Map in chunk</dd>
1941cb0ef41Sopenharmony_ci
1951cb0ef41Sopenharmony_ci          <dt><kbd>Arrow Left</kbd></dt>
1961cb0ef41Sopenharmony_ci          <dd>Go to previous chunk</dd>
1971cb0ef41Sopenharmony_ci
1981cb0ef41Sopenharmony_ci          <dt><kbd>Arrow Right</kbd></dt>
1991cb0ef41Sopenharmony_ci          <dd>Go to next chunk</dd>
2001cb0ef41Sopenharmony_ci
2011cb0ef41Sopenharmony_ci          <dt><kbd>+</kbd></dt>
2021cb0ef41Sopenharmony_ci          <dd>Timeline zoom in</dd>
2031cb0ef41Sopenharmony_ci
2041cb0ef41Sopenharmony_ci          <dt><kbd>-</kbd></dt>
2051cb0ef41Sopenharmony_ci          <dd>Timeline zoom out</dd>
2061cb0ef41Sopenharmony_ci        </dl>
2071cb0ef41Sopenharmony_ci      </div>
2081cb0ef41Sopenharmony_ci    </section>
2091cb0ef41Sopenharmony_ci  </div>
2101cb0ef41Sopenharmony_ci</body>
2111cb0ef41Sopenharmony_ci</html>
212