Merge remote-tracking branch 'upstream/master' into fix-sql-timing-al…

…ignment
MiniProfiler · Feb 10, 2025 · e7c65c6 · e7c65c6
2 parents 5ce4a49 + aa0480f
commit e7c65c6
Show file tree

Hide file tree

Showing 14 changed files with 123 additions and 61 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -6,6 +6,8 @@
 - [FIX] alignment of SQL query start times. [#627](https://github.com/MiniProfiler/rack-mini-profiler/pull/627)
 - [FIX] Truncate long profiler name in profiler popup. [#634](https://github.com/MiniProfiler/rack-mini-profiler/pull/634)
 - [FIX] `flamegraph_mode` query param having no effect. [#635](https://github.com/MiniProfiler/rack-mini-profiler/pull/635)
+- [FEATURE] Show record type and count in SQL query UI. [#638](https://github.com/MiniProfiler/rack-mini-profiler/pull/638)
+- [FEATURE] Show Active Record QueryCache hits in UI. [#640](https://github.com/MiniProfiler/rack-mini-profiler/pull/640)
 
 ## 3.3.1 - 2024-02-15
 - [FEATURE] Support dynamic `config.content_security_policy_nonce` [#609](https://github.com/MiniProfiler/rack-mini-profiler/pull/609)

diff --git a/lib/html/includes.css b/lib/html/includes.css
@@ -135,19 +135,21 @@
   .profiler-result .profiler-timings .profiler-queries-duration {
     padding-left: 6px; }
   .profiler-result .profiler-timings .profiler-percent-in-sql {
-    white-space: nowrap;
-    text-align: right; }
-  .profiler-result .profiler-timings tfoot td {
-    padding-top: 10px;
+    white-space: nowrap; }
+  .profiler-result .profiler-timings tfoot tr td:last-child {
     text-align: right; }
-    .profiler-result .profiler-timings tfoot td a {
+  .profiler-result .profiler-timings-summary {
+    display: flex;
+    justify-content: space-between;
+    padding-top: 10px; }
+    .profiler-result .profiler-timings-summary a {
       font-size: 95%;
       display: inline-block;
       margin-left: 12px; }
-      .profiler-result .profiler-timings tfoot td a:first-child {
+      .profiler-result .profiler-timings-summary a:first-child {
         float: left;
         margin-left: 0px; }
-      .profiler-result .profiler-timings tfoot td a.profiler-custom-link {
+      .profiler-result .profiler-timings-summary a.profiler-custom-link {
         float: left; }
   .profiler-result .profiler-queries {
     font-family: Helvetica, Arial, sans-serif; }
@@ -165,6 +167,12 @@
       background-color: #fdd; }
     .profiler-result .profiler-queries tr.very-very-slow {
       background-color: #fcc; }
+    .profiler-result .profiler-queries tr.cached {
+      background-color: #f2f0ef; }
+    .profiler-result .profiler-queries span.cached {
+      color: #818589; }
+    .profiler-result .profiler-queries span.cached + pre {
+      display: inline; }
     .profiler-result .profiler-queries pre {
       font-family: Consolas, monospace, serif;
       white-space: pre-wrap; }

diff --git a/lib/html/includes.js b/lib/html/includes.js
@@ -1179,6 +1179,7 @@ var _MiniProfiler = (function() {
 
       reqs = 0;
       totalTime = 0;
+      totalSqlCount = 0;
       expandedResults = false;
       toArray(
         document.querySelectorAll(".profiler-results .profiler-result")
@@ -1288,6 +1289,10 @@ var _MiniProfiler = (function() {
 
               sqlTiming.parent_timing_name = timing.name;
 
+              if (sqlTiming.cached) {
+                sqlTiming.row_class = "cached";
+              }
+
               if (sqlTiming.duration_milliseconds > 50) {
                 sqlTiming.row_class = "slow";
               }

diff --git a/lib/html/includes.scss b/lib/html/includes.scss
@@ -150,27 +150,28 @@ $zindex: 2147483640; // near 32bit max 2147483647
     }
     .profiler-percent-in-sql {
       white-space: nowrap;
+    }
+    tfoot tr td:last-child {
       text-align: right;
     }
+  }
 
-    tfoot {
-      td {
-        padding-top: 10px;
-        text-align: right;
+  .profiler-timings-summary {
+    display: flex;
+    justify-content: space-between;
+    padding-top: 10px;
 
-        a {
-          font-size: 95%;
-          display: inline-block;
-          margin-left: 12px;
+    a {
+      font-size: 95%;
+      display: inline-block;
+      margin-left: 12px;
 
-          &:first-child {
-            float: left;
-            margin-left: 0px;
-          }
-          &.profiler-custom-link {
-            float: left;
-          }
-        }
+      &:first-child {
+        float: left;
+        margin-left: 0px;
+      }
+      &.profiler-custom-link {
+        float: left;
       }
     }
   }
@@ -205,6 +206,18 @@ $zindex: 2147483640; // near 32bit max 2147483647
       background-color: #fcc;
     }
 
+    tr.cached {
+      background-color: #f2f0ef;
+    }
+
+    span.cached {
+      color: #818589;
+    }
+
+    span.cached + pre {
+      display: inline;
+    }
+
     pre {
       font-family: $codeFonts;
       white-space: pre-wrap;

diff --git a/lib/html/includes.tmpl b/lib/html/includes.tmpl
@@ -45,33 +45,42 @@
           <tbody>
             {{= MiniProfiler.templates.timingTemplate({timing: it.root, page: it}) }}
           </tbody>
-          <tfoot>
-            <tr>
-              <td colspan="3">
-                {{? !it.client_timings}}
-                   {{= MiniProfiler.templates.linksTemplate({timing: it.root, page: it}) }}
-                {{?}}
-                <a class="profiler-toggle-duration-with-children" title="toggles column with aggregate child durations">show time with children</a>
-                <a
-                  class="profiler-snapshots-page-link"
-                  title="Go to snapshots page"
-                  href="{{= MiniProfiler.options.path }}snapshots">snapshots</a>
-              </td>
-              {{? it.has_sql_timings}}
-                <td colspan="2" class="profiler-number profiler-percent-in-sql" title="{{= MiniProfiler.getSqlTimingsCount(it.root) }} queries spent {{= MiniProfiler.formatDuration(it.duration_milliseconds_in_sql) }} ms of total request time">
-                  {{= MiniProfiler.formatDuration(it.duration_milliseconds_in_sql / it.duration_milliseconds * 100) }}
-                  <span class="profiler-unit">% in sql</span>
+          {{? it.has_sql_timings}}
+            <tfoot>
+              <tr>
+                <td colspan="1">
+                  SQL Summary:
                 </td>
-              {{?}}
-              {{~ it.custom_timing_names :value}}
-                <td colspan="2" class="profiler-number profiler-percentage-in-sql" title="{{= it.custom_timing_stats[value].count }} {{= value.toLowerCase() }} invocations spent {{= MiniProfiler.formatDuration(it.custom_timing_stats[value].duration) }} ms of total request time">
-                  {{= MiniProfiler.formatDuration(it.custom_timing_stats[value].duration / it.duration_milliseconds * 100) }}
-                  <span class="profiler-unit">% in {{= value.toLowerCase() }}</span>
+                <td colspan="5" title="percent of total request time spent in SQL">
+                  {{=it.sql_count}} {{? it.cached_sql_count > 0 }} ({{=it.cached_sql_count}} cached) {{?}}
+                  <span class="profiler-unit" title="percent of total request time spent in SQL"> -
+                  {{= MiniProfiler.formatDuration(it.duration_milliseconds_in_sql / it.duration_milliseconds * 100) }}% in sql
+                  </span>
                 </td>
-              {{~}}
-            </tr>
-          </tfoot>
+              </tr>
+            </tfoot>
+          {{?}}
         </table>
+
+        <div class="profiler-timings-summary">
+          <div>
+            {{? !it.client_timings}}
+                {{= MiniProfiler.templates.linksTemplate({timing: it.root, page: it}) }}
+            {{?}}
+            <a class="profiler-toggle-duration-with-children" title="toggles column with aggregate child durations">show time with children</a>
+            <a
+              class="profiler-snapshots-page-link"
+              title="Go to snapshots page"
+              href="{{= MiniProfiler.options.path }}snapshots">snapshots</a>
+          </div>
+          {{~ it.custom_timing_names :value}}
+            <div class="profiler-number profiler-percentage-in-sql" title="{{= it.custom_timing_stats[value].count }} {{= value.toLowerCase() }} invocations spent {{= MiniProfiler.formatDuration(it.custom_timing_stats[value].duration) }} ms of total request time">
+              {{= MiniProfiler.formatDuration(it.custom_timing_stats[value].duration / it.duration_milliseconds * 100) }}
+              <span class="profiler-unit">% in {{= value.toLowerCase() }}</span>
+            </div>
+          {{~}}
+        </div>
+
         {{? it.client_timings}}
           <table class="profiler-timings profiler-client-timings">
             <thead>
@@ -124,7 +133,7 @@
         <table>
         <thead>
           <tr>
-            <th class="ta-right">step<br />time from start<br />query type<br />duration</th>
+            <th class="ta-right">step<br />time from start<br />query type<br />duration<br />records</th>
             <th class="ta-left">call stack<br />query</th>
           </tr>
         </thead>
@@ -223,10 +232,16 @@
         {{= MiniProfiler.renderExecuteType(it.s.execute_type) }}
       </div>
       <div title="{{? it.s.execute_type == 3}}first result fetched: {{= it.s.first_fetch_duration_milliseconds }}ms{{?}}">{{= MiniProfiler.formatDuration(it.s.duration_milliseconds) }} <span class="profiler-unit">ms</span></div>
+      {{? it.s.row_count > 0  }}
+        <div title="number and type of records instantiated by query">{{= it.s.class_name }}: {{= it.s.row_count }}</div>
+      {{?}}
     </td>
     <td>
       <div class="query">
         <pre class="profiler-stack-trace">{{= it.s.stack_trace_snippet }}</pre>
+        {{? it.s.cached }}
+          <span class="cached"> [CACHE] </span>
+        {{?}}
         {{? it.s.formatted_command_string}}
           <pre class="prettyprint lang-sql"><code>{{= it.s.formatted_command_string }}; {{= MiniProfiler.formatParameters(it.s.parameters) }}</code></pre>
         {{??}}