summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--app/assets/javascripts/peek.js27
-rw-r--r--app/assets/javascripts/shortcuts.js5
-rw-r--r--changelogs/unreleased/29010-perf-bar.yml2
-rw-r--r--config/initializers/peek.rb6
-rw-r--r--lib/gitlab/performance_bar/peek_query_tracker.rb3
-rw-r--r--lib/peek/rblineprof/custom_controller_helpers.rb30
-rw-r--r--vendor/assets/javascripts/peek.js30
-rw-r--r--vendor/assets/stylesheets/peek.scss13
8 files changed, 53 insertions, 63 deletions
diff --git a/app/assets/javascripts/peek.js b/app/assets/javascripts/peek.js
index 06a07c19e09..60f8bdd14c0 100644
--- a/app/assets/javascripts/peek.js
+++ b/app/assets/javascripts/peek.js
@@ -1,19 +1,16 @@
import 'vendor/peek';
import 'vendor/peek.performance_bar';
-(function() {
- $(document).on('click', '#peek-show-queries', function(e) {
- var $modal;
- $('.peek-rblineprof-modal').hide();
- $modal = $('#modal-peek-pg-queries');
- if ($modal.length) {
- $modal.modal('toggle');
- }
- return e.preventDefault();
- });
+$(document).on('click', '#peek-show-queries', function(e) {
+ e.preventDefault();
+ $('.peek-rblineprof-modal').hide();
+ let $modal = $('#modal-peek-pg-queries');
+ if ($modal.length) {
+ $modal.modal('toggle');
+ }
+});
- $(document).on('click', '.js-lineprof-file', function(e) {
- $(this).parents('.heading').next('div').toggle();
- return e.preventDefault();
- });
-}).call(window);
+$(document).on('click', '.js-lineprof-file', function(e) {
+ e.preventDefault();
+ $(this).parents('.heading').next('div').toggle();
+});
diff --git a/app/assets/javascripts/shortcuts.js b/app/assets/javascripts/shortcuts.js
index 2c7698eb174..09cb914e884 100644
--- a/app/assets/javascripts/shortcuts.js
+++ b/app/assets/javascripts/shortcuts.js
@@ -60,11 +60,10 @@ import findAndFollowLink from './shortcuts_dashboard_navigation';
e.preventDefault();
if (Cookies.get('perf_bar_enabled') === 'true') {
Cookies.remove('perf_bar_enabled', { path: '/' });
- }
- else {
+ } else {
Cookies.set('perf_bar_enabled', true, { path: '/' });
}
- return gl.utils.refreshCurrentPage();
+ gl.utils.refreshCurrentPage();
};
Shortcuts.prototype.toggleMarkdownPreview = function(e) {
diff --git a/changelogs/unreleased/29010-perf-bar.yml b/changelogs/unreleased/29010-perf-bar.yml
index 920b57ed130..f4167e5562f 100644
--- a/changelogs/unreleased/29010-perf-bar.yml
+++ b/changelogs/unreleased/29010-perf-bar.yml
@@ -1,4 +1,4 @@
---
-title: Allow to enable a performance bar with the keyboard shortcut
+title: Add an optional performance bar to view performance metrics for the current page
merge_request: 11439
author:
diff --git a/config/initializers/peek.rb b/config/initializers/peek.rb
index 429960b7c3e..c88ae4b62d2 100644
--- a/config/initializers/peek.rb
+++ b/config/initializers/peek.rb
@@ -3,16 +3,15 @@ Rails.application.config.peek.adapter = :redis, { client: ::Redis.new(Gitlab::Re
Peek.into Peek::Views::Host
Peek.into Peek::Views::PerformanceBar
if Gitlab::Database.mysql?
- require 'peek-mysql'
+ require 'peek-mysql2'
PEEK_DB_CLIENT = ::Mysql2::Client
PEEK_DB_VIEW = Peek::Views::Mysql2
- Peek.into PEEK_DB_VIEW
else
require 'peek-pg'
PEEK_DB_CLIENT = ::PG::Connection
PEEK_DB_VIEW = Peek::Views::PG
- Peek.into PEEK_DB_VIEW
end
+Peek.into PEEK_DB_VIEW
Peek.into Peek::Views::Redis
Peek.into Peek::Views::Sidekiq
Peek.into Peek::Views::Rblineprof
@@ -25,4 +24,5 @@ class PEEK_DB_CLIENT
self.query_details = Concurrent::Array.new
end
+# rubocop:disable Style/ClassAndModuleCamelCase
PEEK_DB_VIEW.prepend ::Gitlab::PerformanceBar::PeekQueryTracker
diff --git a/lib/gitlab/performance_bar/peek_query_tracker.rb b/lib/gitlab/performance_bar/peek_query_tracker.rb
index 479396f6664..7ab80f5ee0f 100644
--- a/lib/gitlab/performance_bar/peek_query_tracker.rb
+++ b/lib/gitlab/performance_bar/peek_query_tracker.rb
@@ -30,7 +30,8 @@ module Gitlab
def track_query(raw_query, bindings, start, finish)
query = Gitlab::Sherlock::Query.new(raw_query, start, finish)
- query_info = { duration: query.duration.round(4), sql: query.formatted_query }
+ query_info = { duration: '%.3f' % query.duration, sql: query.formatted_query }
+
PEEK_DB_CLIENT.query_details << query_info
end
end
diff --git a/lib/peek/rblineprof/custom_controller_helpers.rb b/lib/peek/rblineprof/custom_controller_helpers.rb
index 796420971b5..2ecda58c669 100644
--- a/lib/peek/rblineprof/custom_controller_helpers.rb
+++ b/lib/peek/rblineprof/custom_controller_helpers.rb
@@ -11,6 +11,7 @@ module Peek
end
end
+ # rubocop:disable Metrics/AbcSize
def inject_rblineprof
ret = nil
profile = lineprof(rblineprof_profiler_regex) do
@@ -25,32 +26,43 @@ module Peek
# Sort each file by the longest calculated time
per_file = profile.map do |file, lines|
- total, child, excl, total_cpu, child_cpu, excl_cpu = lines[0]
+ total, _child, excl, total_cpu, _child_cpu, excl_cpu = lines[0]
wall = summary == 'exclusive' ? excl : total
cpu = summary == 'exclusive' ? excl_cpu : total_cpu
idle = summary == 'exclusive' ? (excl - excl_cpu) : (total - total_cpu)
+ sort_method =
+ case sort
+ when 'idle'
+ idle
+ when 'cpu'
+ cpu
+ else
+ wall
+ end
+
[
file, lines,
wall, cpu, idle,
- sort == 'idle' ? idle : sort == 'cpu' ? cpu : wall
+ sort_method
]
- end.sort_by{ |a,b,c,d,e,f| -f }
+ end
+ per_file = per_file.sort_by { |_a, _b, _c, _d, _e, f| -f }
output = ''
per_file.each do |file_name, lines, file_wall, file_cpu, file_idle, file_sort|
-
output << "<div class='peek-rblineprof-file'><div class='heading'>"
show_src = file_sort > min
tmpl = show_src ? "<a href='#' class='js-lineprof-file'>%s</a>" : "%s"
- if mode == 'cpu'
- output << sprintf("<span class='duration'>% 8.1fms + % 8.1fms</span> #{tmpl}", file_cpu / 1000.0, file_idle / 1000.0, file_name.sub(Rails.root.to_s + '/', ''))
- else
- output << sprintf("<span class='duration'>% 8.1fms</span> #{tmpl}", file_wall/1000.0, file_name.sub(Rails.root.to_s + '/', ''))
- end
+ output <<
+ if mode == 'cpu'
+ sprintf("<span class='duration'>% 8.1fms + % 8.1fms</span> #{tmpl}", file_cpu / 1000.0, file_idle / 1000.0, file_name.sub(Rails.root.to_s + '/', ''))
+ else
+ sprintf("<span class='duration'>% 8.1fms</span> #{tmpl}", file_wall / 1000.0, file_name.sub(Rails.root.to_s + '/', ''))
+ end
output << "</div>" # .heading
diff --git a/vendor/assets/javascripts/peek.js b/vendor/assets/javascripts/peek.js
index 0aec31ee2cb..4db076d259a 100644
--- a/vendor/assets/javascripts/peek.js
+++ b/vendor/assets/javascripts/peek.js
@@ -1,6 +1,4 @@
-var requestId;
-
-requestId = null;
+let requestId = null;
(function($) {
var fetchRequestResults, getRequestId, peekEnabled, toggleBar, updatePerformanceBar;
@@ -16,9 +14,11 @@ requestId = null;
};
updatePerformanceBar = function(results) {
var key, label, data, table, html, tr, duration_td, sql_td, strong;
- for (key in results.data) {
- for (label in results.data[key]) {
+
+ Object.keys(results.data).forEach((key) => {
+ Object.keys(results.data[key]).forEach((label) => {
data = results.data[key][label];
+
if (label == 'queries') {
table = document.createElement('table');
@@ -40,12 +40,11 @@ requestId = null;
table.className = 'table';
$("[data-defer-to=" + key + "-" + label + "]").html(table);
- }
- else {
+ } else {
$("[data-defer-to=" + key + "-" + label + "]").text(results.data[key][label]);
}
- }
- }
+ });
+ });
return $(document).trigger('peek:render', [getRequestId(), results]);
};
toggleBar = function(event) {
@@ -77,19 +76,6 @@ requestId = null;
};
$(document).on('keypress', toggleBar);
$(document).on('peek:update', fetchRequestResults);
- $(document).on('pjax:end', function(event, xhr, options) {
- if (xhr != null) {
- requestId = xhr.getResponseHeader('X-Request-Id');
- }
- if (peekEnabled()) {
- return $(this).trigger('peek:update');
- }
- });
- $(document).on('page:change turbolinks:load', function() {
- if (peekEnabled()) {
- return $(this).trigger('peek:update');
- }
- });
return $(function() {
if (peekEnabled()) {
return $(this).trigger('peek:update');
diff --git a/vendor/assets/stylesheets/peek.scss b/vendor/assets/stylesheets/peek.scss
index 224ecc4245e..4977487d3ae 100644
--- a/vendor/assets/stylesheets/peek.scss
+++ b/vendor/assets/stylesheets/peek.scss
@@ -6,16 +6,11 @@ header.navbar-gitlab.with-peek {
}
#peek {
- background: #000;
+ background: $black;
height: 35px;
line-height: 35px;
color: #999;
- .hidden {
- display: none;
- visibility: visible;
- }
-
&.disabled {
display: none;
}
@@ -58,12 +53,12 @@ header.navbar-gitlab.with-peek {
}
strong {
- color: #fff;
+ color: $white-light;
}
table {
strong {
- color: #000;
+ color: $black;
}
}
@@ -95,5 +90,5 @@ header.navbar-gitlab.with-peek {
}
#modal-peek-pg-queries-content {
- color: #000;
+ color: $black;
}