Merge pull request #326 from joerick/html-features

HTML renderer upgrade
joerick · Oct 11, 2024 · 92464eb · 92464eb
2 parents 4b37f8c + a51f692
commit 92464eb
Show file tree

Hide file tree

Showing 86 changed files with 4,462 additions and 1,335 deletions.
diff --git a/.github/workflows/wheels.yml b/.github/workflows/wheels.yml
@@ -47,8 +47,9 @@ jobs:
           CIBW_ARCHS: ${{matrix.archs}}
           CIBW_ARCHS_MACOS: auto universal2
 
-      - uses: actions/upload-artifact@v2
+      - uses: actions/upload-artifact@v4
         with:
+          name: cibw-wheels-${{ matrix.os }}-${{ strategy.job-index }}
           path: ./wheelhouse/*.whl
 
   build_sdist:
@@ -68,8 +69,9 @@ jobs:
       - name: Build sdist
         run: python setup.py sdist
 
-      - uses: actions/upload-artifact@v2
+      - uses: actions/upload-artifact@v4
         with:
+          name: cibw-sdist
           path: dist/*.tar.gz
 
   upload_pypi:
@@ -85,9 +87,11 @@ jobs:
       attestations: write
 
     steps:
-      - uses: actions/download-artifact@v2
+      - uses: actions/download-artifact@v4
         with:
-          name: artifact
+          # unpacks all CIBW artifacts into dist/
+          pattern: cibw-*
           path: dist
+          merge-multiple: true
 
       - uses: pypa/gh-action-pypi-publish@release/v1
diff --git a/.pre-commit-config.yaml b/.pre-commit-config.yaml
@@ -23,7 +23,7 @@ repos:
     rev: v2.3.0
     hooks:
     -   id: codespell
-        exclude: "\\.(json)$"
+        exclude: "\\.(json)$|docs/_static/preview"
         args:
         -   --ignore-words-list=vas
 

diff --git a/bin/build_js_bundle.py b/bin/build_js_bundle.py
@@ -10,6 +10,8 @@
 JS_BUNDLE = "pyinstrument/renderers/html_resources/app.js"
 CSS_BUNDLE = "pyinstrument/renderers/html_resources/app.css"
 
+DOCS_PREVIEW_DIR = "docs/_static/preview"
+
 if __name__ == "__main__":
     # chdir to root of repo
     os.chdir(os.path.dirname(__file__))
@@ -45,3 +47,7 @@
 
     shutil.copyfile(HTML_RENDERER_DIR + "/dist/pyinstrument-html.iife.js", JS_BUNDLE)
     shutil.copyfile(HTML_RENDERER_DIR + "/dist/style.css", CSS_BUNDLE)
+
+    subprocess.check_call("npm run build -- --mode preview", cwd=HTML_RENDERER_DIR, shell=True)
+    shutil.rmtree(DOCS_PREVIEW_DIR, ignore_errors=True)
+    shutil.copytree(HTML_RENDERER_DIR + "/dist", DOCS_PREVIEW_DIR)
diff --git a/bin/create_demo_data.py b/bin/create_demo_data.py
@@ -0,0 +1,19 @@
+#!/usr/bin/env python3
+
+import os
+import subprocess
+import sys
+from glob import glob
+from pathlib import Path
+
+ROOT_DIR = Path(__file__).parent.parent
+
+
+def main():
+    os.chdir(ROOT_DIR)
+    for script in glob(str("examples/demo_scripts/*.py")):
+        subprocess.run([sys.executable, "bin/create_sample_json.py", script], check=True)
+
+
+if __name__ == "__main__":
+    main()
diff --git a/bin/create_sample_json.py b/bin/create_sample_json.py
@@ -0,0 +1,36 @@
+#!/usr/bin/env python3
+import argparse
+import subprocess
+import sys
+from pathlib import Path
+
+ROOT_DIR = Path(__file__).parent.parent
+OUTPUT_DIR = ROOT_DIR / "html_renderer" / "demo-data"
+
+
+def main():
+    parser = argparse.ArgumentParser()
+    parser.add_argument("SCRIPT", help="The script to run to produce the sample", type=Path)
+    args = parser.parse_args()
+    script_file: Path = args.SCRIPT
+    output_file = (OUTPUT_DIR / script_file.with_suffix("").name).with_suffix(".json")
+
+    result = subprocess.run(
+        [
+            "pyinstrument",
+            "-o",
+            str(output_file),
+            "-r",
+            "pyinstrument.renderers.html.JSONForHTMLRenderer",
+            script_file,
+        ]
+    )
+
+    if result.returncode != 0:
+        return result.returncode
+
+    print(f"Sample JSON written to {output_file}")
+
+
+if __name__ == "__main__":
+    sys.exit(main())
diff --git a/docs/_static/preview/assets/django_template_render-CIkNzFIy.js b/docs/_static/preview/assets/django_template_render-CIkNzFIy.js
diff --git a/docs/_static/preview/assets/index-DhaBtkCM.js b/docs/_static/preview/assets/index-DhaBtkCM.js
diff --git a/docs/_static/preview/assets/index-paBu1EOJ.css b/docs/_static/preview/assets/index-paBu1EOJ.css
diff --git a/docs/_static/preview/assets/sympy_calculation-B9Pn_4RL.js b/docs/_static/preview/assets/sympy_calculation-B9Pn_4RL.js
diff --git a/docs/_static/preview/assets/wikipedia_article_word_count-CGt_pvsZ.js b/docs/_static/preview/assets/wikipedia_article_word_count-CGt_pvsZ.js
diff --git a/docs/_static/preview/index.html b/docs/_static/preview/index.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Pyinstrument Demo</title>
+    <script type="module" crossorigin src="./assets/index-DhaBtkCM.js"></script>
+    <link rel="stylesheet" crossorigin href="./assets/index-paBu1EOJ.css">
+  </head>
+  <body>
+    <div id="app"></div>
+  </body>
+</html>
diff --git a/docs/img/screenshot.jpg b/docs/img/screenshot.jpg
diff --git a/examples/django_example/.gitignore → ...es/demo_scripts/django_example/.gitignore b/examples/django_example/.gitignore → ...es/demo_scripts/django_example/.gitignore
diff --git a/examples/django_example/README.md → ...les/demo_scripts/django_example/README.md b/examples/django_example/README.md → ...les/demo_scripts/django_example/README.md
diff --git a/...django_example/django_example/__init__.py → ...django_example/django_example/__init__.py b/...django_example/django_example/__init__.py → ...django_example/django_example/__init__.py
diff --git a/...django_example/django_example/settings.py → ...django_example/django_example/settings.py b/...django_example/django_example/settings.py → ...django_example/django_example/settings.py
diff --git a/...le/django_example/templates/template.html → ...le/django_example/templates/template.html b/...le/django_example/templates/template.html → ...le/django_example/templates/template.html
diff --git a/...ango_example/templates/template_base.html → ...ango_example/templates/template_base.html b/...ango_example/templates/template_base.html → ...ango_example/templates/template_base.html
diff --git a/...les/django_example/django_example/urls.py → ...pts/django_example/django_example/urls.py b/...les/django_example/django_example/urls.py → ...pts/django_example/django_example/urls.py
diff --git a/...es/django_example/django_example/views.py → ...ts/django_example/django_example/views.py b/...es/django_example/django_example/views.py → ...ts/django_example/django_example/views.py
diff --git a/examples/django_example/manage.py → ...les/demo_scripts/django_example/manage.py b/examples/django_example/manage.py → ...les/demo_scripts/django_example/manage.py
diff --git a/examples/django_template_render.py → ...es/demo_scripts/django_template_render.py b/examples/django_template_render.py → ...es/demo_scripts/django_template_render.py
@@ -21,7 +21,7 @@ def main():
         action="store",
         type="int",
         help="number of template render calls to make",
-        default=100,
+        default=200,
     )
     options, _ = parser.parse_args()
 
@@ -38,7 +38,11 @@ def main():
     )
     django.setup()
 
-    for _ in range(0, options.iterations):
+    render_templates(options.iterations)
+
+
+def render_templates(iterations: int):
+    for _ in range(0, iterations):
         django.template.loader.render_to_string("template.html")
 
 

diff --git a/examples/sympy_perf.py → examples/demo_scripts/sympy_calculation.py b/examples/sympy_perf.py → examples/demo_scripts/sympy_calculation.py
diff --git a/examples/wikipedia_article_word_count.py → ...o_scripts/wikipedia_article_word_count.py b/examples/wikipedia_article_word_count.py → ...o_scripts/wikipedia_article_word_count.py
diff --git a/html_renderer/demo-data/django_template_render.json b/html_renderer/demo-data/django_template_render.json
diff --git a/html_renderer/demo-data/sympy_calculation.json b/html_renderer/demo-data/sympy_calculation.json
diff --git a/html_renderer/demo-data/wikipedia_article_word_count.json b/html_renderer/demo-data/wikipedia_article_word_count.json
diff --git a/html_renderer/demo-src/DemoApp.svelte b/html_renderer/demo-src/DemoApp.svelte
@@ -0,0 +1,111 @@
+<script lang="ts">
+  import pyinstrumentHTMLRenderer from "../src/main";
+
+  const fileURLs = import.meta.glob("../demo-data/*.json", {import: "default"})
+
+  const files = Object.entries(fileURLs).map(([srcURL, promiseFn]) => {
+    const filename = srcURL.split("/").pop()!;
+    const stem = filename.split(".").slice(0, -1).join(".");
+    return { name: stem, promiseFn };
+  });
+
+  let file = files[0];
+
+  let data: any = null;
+  let error: Error | null = null;
+  let loading = false;
+  $: {
+    loading = true;
+    error = null;
+    data = null;
+    file.promiseFn()
+      .then((json) => {
+        data = json;
+        error = null;
+      })
+      .catch((e) => {
+        error = e;
+      })
+      .finally(() => {
+        loading = false;
+      });
+  }
+
+  let appComponent: ReturnType<
+    (typeof pyinstrumentHTMLRenderer)["render"]
+  > | null = null;
+  let resultElement: HTMLElement | undefined;
+
+  $: if (resultElement && data) {
+    if (appComponent) {
+      appComponent.$destroy();
+    }
+    appComponent = pyinstrumentHTMLRenderer.render(resultElement, data);
+  }
+</script>
+
+<div class="demo-app">
+  <div class="header">
+    <div class="left"></div>
+    <div class="right">
+      Choose a demo profile:
+      <select bind:value={file}>
+        {#each files as optionFile}
+          <option value={optionFile}>{optionFile.name}</option>
+        {/each}
+      </select>
+    </div>
+  </div>
+  <div class="body">
+    {#if loading}
+      <div>Loading...</div>
+    {:else if error}
+      <div>Error loading file: {error.message}</div>
+    {/if}
+
+    <div class="result-element" style={!data ? 'display: none' : ''} bind:this={resultElement}></div>
+  </div>
+</div>
+
+<style lang="scss">
+  .demo-app {
+    background-color: #111;
+    color: white;
+    font-size: 11px;
+    font-family:
+      system-ui,
+      -apple-system,
+      BlinkMacSystemFont,
+      "Segoe UI",
+      Roboto,
+      Oxygen,
+      Ubuntu,
+      Cantarell,
+      "Open Sans",
+      "Helvetica Neue",
+      sans-serif;
+
+    display: flex;
+    flex-direction: column;
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+  }
+  .header {
+    // background: #292f32;
+    // font-size: 14px;
+    padding: 5px 10px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  }
+  .body {
+    position: relative;
+    flex: 1;
+  }
+  select {
+    font: inherit;
+  }
+</style>
diff --git a/html_renderer/demo-src/main.ts b/html_renderer/demo-src/main.ts
@@ -0,0 +1,5 @@
+import DemoApp from "./DemoApp.svelte";
+
+new DemoApp({
+    target: document.body,
+});
diff --git a/html_renderer/index.html b/html_renderer/index.html
@@ -4,22 +4,10 @@
     <meta charset="UTF-8" />
     <link rel="icon" type="image/svg+xml" href="/vite.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Pyinstrument</title>
+    <title>Pyinstrument Demo</title>
   </head>
   <body>
     <div id="app"></div>
-    <script type="module" src="/src/main.ts"></script>
-    <script type="module">
-      import pyinstrumentHTMLRenderer from "/src/main.ts";
-
-      fetch('/sample.json')
-        .then(response => response.json())
-        .then(data => {
-            pyinstrumentHTMLRenderer.render(
-                document.getElementById('app'),
-                data,
-            )
-        });
-    </script>
+    <script type="module" src="demo-src/main.ts"></script>
   </body>
 </html>