Add examples in docs/

mgartner · Oct 24, 2019 · 2705720 · 2705720
1 parent 3dbe7b9
commit 2705720
Show file tree

Hide file tree

Showing 2 changed files with 292 additions and 0 deletions.
diff --git a/docs/flamegraph.html b/docs/flamegraph.html
@@ -0,0 +1,145 @@
+
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
+    <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/gh/spiermar/d3-flame-graph@2.0.3/dist/d3-flamegraph.css">
+
+    <style>
+      body {
+        padding-top: 20px;
+        padding-bottom: 20px;
+      }
+
+      .header {
+        padding-bottom: 20px;
+        padding-right: 15px;
+        padding-left: 15px;
+        border-bottom: 1px solid #e5e5e5;
+      }
+
+      .header .logo {
+        text-decoration: none;
+      }
+
+      .header h3 {
+        margin-top: 0;
+        margin-bottom: 0;
+        line-height: 40px;
+      }
+
+      .container {
+        max-width: 990px;
+      }
+
+      table {
+        font-family: monospace;
+      }
+
+      table th {
+        width: 250px;
+      }
+
+      span {
+        font-weight: 700;
+        font-family: monospace;
+      }
+    </style>
+
+    <title>pg_flame</title>
+
+
+
+  </head>
+  <body>
+    <div class="container">
+      <div class="header clearfix">
+        <nav>
+          <div class="pull-right">
+            <form class="form-inline" id="form">
+              <a class="btn" href="javascript: resetZoom();">Reset zoom</a>
+              <a class="btn" href="javascript: clear();">Clear</a>
+              <div class="form-group">
+                <input type="text" class="form-control" id="term">
+              </div>
+              <a class="btn btn-primary" href="javascript: search();">Search</a>
+            </form>
+          </div>
+        </nav>
+        <a class="logo" href="https://github.com/mgartner/pg_flame">
+          <h3 class="text-muted">pg_flame</h3>
+        </a>
+      </div>
+      <div id="chart">
+      </div>
+      <hr>
+      <div id="details">
+      </div>
+    </div>
+
+    <script src="https://d3js.org/d3.v4.min.js" charset="utf-8"></script>
+    <script type="text/javascript" src=https://cdnjs.cloudflare.com/ajax/libs/d3-tip/0.9.1/d3-tip.min.js></script>
+    <script type="text/javascript" src="https://cdn.jsdelivr.net/gh/spiermar/d3-flame-graph@2.1.3/dist/d3-flamegraph.min.js"></script>
+
+    <script type="text/javascript">
+    var flameGraph = d3.flamegraph()
+      .width(960)
+      .cellHeight(18)
+      .transitionDuration(750)
+      .minFrameSize(5)
+      .transitionEase(d3.easeCubic)
+      .sort(false)
+      .title("")
+      .differential(false)
+      .selfValue(false)
+      .setColorMapper(function(d, originalColor) {
+        return d.data.color || originalColor;
+      });
+
+    var tip = d3.tip()
+      .direction("s")
+      .offset([8, 0])
+      .attr('class', 'd3-flame-graph-tip')
+      .html(function(d) {
+        return d.data.name + " | " + d.data.time + "ms";
+      });
+    flameGraph.tooltip(tip);
+
+    var details = document.getElementById("details");
+    flameGraph.setDetailsElement(details);
+
+    var label = function(d) {
+      return d.data.detail;
+    }
+    flameGraph.label(label);
+
+    var data = {"name":"Total","value":71.37,"time":71.37,"detail":"\u003cspan\u003eIncludes planning and execution time\u003c/span\u003e","color":"","init_plan":false,"children":[{"name":"Query Planning","value":8.447,"time":8.447,"detail":"\u003cspan\u003eTime to generate the query plan\u003c/span\u003e","color":"#00C05A","init_plan":false,"children":null},{"name":"Aggregate","value":62.923,"time":62.923,"detail":"\n\u003ctable class=\"table table-striped table-bordered\"\u003e\n  \u003ctbody\u003e\n    \n      \u003ctr\u003e\n        \u003cth\u003eFilter\u003c/th\u003e\n        \u003ctd\u003e(count(*) \u0026gt; 1)\u003c/td\u003e\n      \u003c/tr\u003e\n    \n    \n    \n    \n    \n    \n    \n      \u003ctr\u003e\n        \u003cth\u003eBuffers Shared Hit\u003c/th\u003e\n        \u003ctd\u003e2\u003c/td\u003e\n      \u003c/tr\u003e\n    \n    \n      \u003ctr\u003e\n        \u003cth\u003eBuffers Shared Read\u003c/th\u003e\n        \u003ctd\u003e813\u003c/td\u003e\n      \u003c/tr\u003e\n    \n    \n    \n    \n  \u003c/tbody\u003e\n\u003c/table\u003e\n","color":"","init_plan":false,"children":[{"name":"Hash Join","value":60.106,"time":60.106,"detail":"\n\u003ctable class=\"table table-striped table-bordered\"\u003e\n  \u003ctbody\u003e\n    \n    \n      \u003ctr\u003e\n        \u003cth\u003eParent Relationship\u003c/th\u003e\n        \u003ctd\u003eOuter\u003c/td\u003e\n      \u003c/tr\u003e\n    \n    \n    \n      \u003ctr\u003e\n        \u003cth\u003eHash Cond\u003c/th\u003e\n        \u003ctd\u003e(u.id = posts.user_id)\u003c/td\u003e\n      \u003c/tr\u003e\n    \n    \n    \n    \n      \u003ctr\u003e\n        \u003cth\u003eBuffers Shared Hit\u003c/th\u003e\n        \u003ctd\u003e2\u003c/td\u003e\n      \u003c/tr\u003e\n    \n    \n      \u003ctr\u003e\n        \u003cth\u003eBuffers Shared Read\u003c/th\u003e\n        \u003ctd\u003e813\u003c/td\u003e\n      \u003c/tr\u003e\n    \n    \n    \n    \n  \u003c/tbody\u003e\n\u003c/table\u003e\n","color":"","init_plan":false,"children":[{"name":"Seq Scan on users","value":24.358,"time":24.358,"detail":"\n\u003ctable class=\"table table-striped table-bordered\"\u003e\n  \u003ctbody\u003e\n    \n    \n      \u003ctr\u003e\n        \u003cth\u003eParent Relationship\u003c/th\u003e\n        \u003ctd\u003eOuter\u003c/td\u003e\n      \u003c/tr\u003e\n    \n    \n    \n    \n    \n    \n      \u003ctr\u003e\n        \u003cth\u003eBuffers Shared Hit\u003c/th\u003e\n        \u003ctd\u003e2\u003c/td\u003e\n      \u003c/tr\u003e\n    \n    \n      \u003ctr\u003e\n        \u003cth\u003eBuffers Shared Read\u003c/th\u003e\n        \u003ctd\u003e729\u003c/td\u003e\n      \u003c/tr\u003e\n    \n    \n    \n    \n  \u003c/tbody\u003e\n\u003c/table\u003e\n","color":"","init_plan":false,"children":null},{"name":"Hash","value":19.902,"time":19.902,"detail":"\n\u003ctable class=\"table table-striped table-bordered\"\u003e\n  \u003ctbody\u003e\n    \n    \n      \u003ctr\u003e\n        \u003cth\u003eParent Relationship\u003c/th\u003e\n        \u003ctd\u003eInner\u003c/td\u003e\n      \u003c/tr\u003e\n    \n    \n    \n    \n    \n    \n    \n      \u003ctr\u003e\n        \u003cth\u003eBuffers Shared Read\u003c/th\u003e\n        \u003ctd\u003e84\u003c/td\u003e\n      \u003c/tr\u003e\n    \n    \n      \u003ctr\u003e\n        \u003cth\u003eHash Buckets\u003c/th\u003e\n        \u003ctd\u003e8192\u003c/td\u003e\n      \u003c/tr\u003e\n    \n    \n      \u003ctr\u003e\n        \u003cth\u003eHash Batches\u003c/th\u003e\n        \u003ctd\u003e1\u003c/td\u003e\n      \u003c/tr\u003e\n    \n    \n      \u003ctr\u003e\n        \u003cth\u003eMemory Usage\u003c/th\u003e\n        \u003ctd\u003e239 kB\u003c/td\u003e\n      \u003c/tr\u003e\n    \n  \u003c/tbody\u003e\n\u003c/table\u003e\n","color":"","init_plan":false,"children":[{"name":"Seq Scan on posts","value":18.66,"time":18.66,"detail":"\n\u003ctable class=\"table table-striped table-bordered\"\u003e\n  \u003ctbody\u003e\n    \n      \u003ctr\u003e\n        \u003cth\u003eFilter\u003c/th\u003e\n        \u003ctd\u003e((title)::text ~ \u0026#39;.*sql.*\u0026#39;::text)\u003c/td\u003e\n      \u003c/tr\u003e\n    \n    \n      \u003ctr\u003e\n        \u003cth\u003eParent Relationship\u003c/th\u003e\n        \u003ctd\u003eOuter\u003c/td\u003e\n      \u003c/tr\u003e\n    \n    \n    \n    \n    \n    \n    \n      \u003ctr\u003e\n        \u003cth\u003eBuffers Shared Read\u003c/th\u003e\n        \u003ctd\u003e84\u003c/td\u003e\n      \u003c/tr\u003e\n    \n    \n    \n    \n  \u003c/tbody\u003e\n\u003c/table\u003e\n","color":"","init_plan":false,"children":null}]}]}]}]};
+
+    d3.select("#chart")
+      .datum(data)
+      .call(flameGraph);
+
+    document.getElementById("form").addEventListener("submit", function(event){
+      event.preventDefault();
+      search();
+    });
+
+    function search() {
+      var term = document.getElementById("term").value;
+      flameGraph.search(term);
+    }
+
+    function clear() {
+      document.getElementById('term').value = '';
+      flameGraph.clear();
+    }
+
+    function resetZoom() {
+      flameGraph.resetZoom();
+    }
+    </script>
+  </body>
+</html>
diff --git a/docs/plan.json b/docs/plan.json
@@ -0,0 +1,147 @@
+[
+  {
+    "Plan": {
+      "Node Type": "Aggregate",
+      "Strategy": "Hashed",
+      "Partial Mode": "Simple",
+      "Parallel Aware": false,
+      "Startup Cost": 2714.13,
+      "Total Cost": 2776.27,
+      "Plan Rows": 1657,
+      "Plan Width": 33,
+      "Actual Startup Time": 62.412,
+      "Actual Total Time": 62.923,
+      "Actual Rows": 106,
+      "Actual Loops": 1,
+      "Group Key": ["u.id"],
+      "Filter": "(count(*) > 1)",
+      "Rows Removed by Filter": 4758,
+      "Shared Hit Blocks": 2,
+      "Shared Read Blocks": 813,
+      "Shared Dirtied Blocks": 0,
+      "Shared Written Blocks": 0,
+      "Local Hit Blocks": 0,
+      "Local Read Blocks": 0,
+      "Local Dirtied Blocks": 0,
+      "Local Written Blocks": 0,
+      "Temp Read Blocks": 0,
+      "Temp Written Blocks": 0,
+      "Plans": [
+        {
+          "Node Type": "Hash Join",
+          "Parent Relationship": "Outer",
+          "Parallel Aware": false,
+          "Join Type": "Inner",
+          "Startup Cost": 271.14,
+          "Total Cost": 2676.85,
+          "Plan Rows": 4971,
+          "Plan Width": 25,
+          "Actual Startup Time": 19.974,
+          "Actual Total Time": 60.106,
+          "Actual Rows": 4971,
+          "Actual Loops": 1,
+          "Inner Unique": false,
+          "Hash Cond": "(u.id = posts.user_id)",
+          "Shared Hit Blocks": 2,
+          "Shared Read Blocks": 813,
+          "Shared Dirtied Blocks": 0,
+          "Shared Written Blocks": 0,
+          "Local Hit Blocks": 0,
+          "Local Read Blocks": 0,
+          "Local Dirtied Blocks": 0,
+          "Local Written Blocks": 0,
+          "Temp Read Blocks": 0,
+          "Temp Written Blocks": 0,
+          "Plans": [
+            {
+              "Node Type": "Seq Scan",
+              "Parent Relationship": "Outer",
+              "Parallel Aware": false,
+              "Relation Name": "users",
+              "Alias": "u",
+              "Startup Cost": 0.00,
+              "Total Cost": 1731.00,
+              "Plan Rows": 100000,
+              "Plan Width": 25,
+              "Actual Startup Time": 0.007,
+              "Actual Total Time": 24.358,
+              "Actual Rows": 100000,
+              "Actual Loops": 1,
+              "Shared Hit Blocks": 2,
+              "Shared Read Blocks": 729,
+              "Shared Dirtied Blocks": 0,
+              "Shared Written Blocks": 0,
+              "Local Hit Blocks": 0,
+              "Local Read Blocks": 0,
+              "Local Dirtied Blocks": 0,
+              "Local Written Blocks": 0,
+              "Temp Read Blocks": 0,
+              "Temp Written Blocks": 0
+            },
+            {
+              "Node Type": "Hash",
+              "Parent Relationship": "Inner",
+              "Parallel Aware": false,
+              "Startup Cost": 209.00,
+              "Total Cost": 209.00,
+              "Plan Rows": 4971,
+              "Plan Width": 4,
+              "Actual Startup Time": 19.902,
+              "Actual Total Time": 19.902,
+              "Actual Rows": 4971,
+              "Actual Loops": 1,
+              "Hash Buckets": 8192,
+              "Original Hash Buckets": 8192,
+              "Hash Batches": 1,
+              "Original Hash Batches": 1,
+              "Peak Memory Usage": 239,
+              "Shared Hit Blocks": 0,
+              "Shared Read Blocks": 84,
+              "Shared Dirtied Blocks": 0,
+              "Shared Written Blocks": 0,
+              "Local Hit Blocks": 0,
+              "Local Read Blocks": 0,
+              "Local Dirtied Blocks": 0,
+              "Local Written Blocks": 0,
+              "Temp Read Blocks": 0,
+              "Temp Written Blocks": 0,
+              "Plans": [
+                {
+                  "Node Type": "Seq Scan",
+                  "Parent Relationship": "Outer",
+                  "Parallel Aware": false,
+                  "Relation Name": "posts",
+                  "Alias": "posts",
+                  "Startup Cost": 0.00,
+                  "Total Cost": 209.00,
+                  "Plan Rows": 4971,
+                  "Plan Width": 4,
+                  "Actual Startup Time": 0.289,
+                  "Actual Total Time": 18.660,
+                  "Actual Rows": 4971,
+                  "Actual Loops": 1,
+                  "Filter": "((title)::text ~ '.*sql.*'::text)",
+                  "Rows Removed by Filter": 5029,
+                  "Shared Hit Blocks": 0,
+                  "Shared Read Blocks": 84,
+                  "Shared Dirtied Blocks": 0,
+                  "Shared Written Blocks": 0,
+                  "Local Hit Blocks": 0,
+                  "Local Read Blocks": 0,
+                  "Local Dirtied Blocks": 0,
+                  "Local Written Blocks": 0,
+                  "Temp Read Blocks": 0,
+                  "Temp Written Blocks": 0
+                }
+              ]
+            }
+          ]
+        }
+      ]
+    },
+    "Planning Time": 8.447,
+    "Triggers": [
+    ],
+    "Execution Time": 63.181
+  }
+]