rails_mini_profiler 0.6.0 → 0.7.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 3ee7ad78091b3a10151ce83c08c255e9ccc78c16112a74a89c939876c52146ed
-  data.tar.gz: 33c09a36420c374b1b40a8cdbaec6a9a5a0ef5822dddc9bb2e6a47902c0ddce3
+  metadata.gz: bb1212a4d90c46143193b2173e9e136aa6757a74a6591137cba33169235d175d
+  data.tar.gz: f799849a5d978c2c22d39b3fa1f4be6c02541f75b7a2312d98a510a1d69a195b
 SHA512:
-  metadata.gz: a40ccbdbfd8a40b8b9eba3ba9a1f29436bd25f645640112ad0cda3426a7b4c3c4b8fe174569c304c3a8dbe3cc1c1987d5b6bee4b2c4a52309cd0e273879f437e
-  data.tar.gz: 7f7527d2d8fd2e898951a36ecfb0e413cf1264b1dc495a637e4cd1a802ab690df754ae3c39d5d626e37c931120430c0f8a58a78262c5672b0f27edf7c2262ae3
+  metadata.gz: ae143e874778e4af9560e5b6521003c5d4933ec86ffe5900a56c57b93791a3d0faa3ac18294cecccac12048dc35c38a70aa7a53ffa91b12d2025a89c0acc0384
+  data.tar.gz: f2a8ca075571593f1cce9d1b59910ea5aac8f95a06c277298be9e0e93be5dcd1b013fbaefbef22bf173f6e2db40fed29068cfda44d422aa372cdde30818ec9cf

data/README.md

@@ -63,8 +63,6 @@ route:
 ```ruby
 # routes.rb
 Rails.application.routes.draw do
-  ...
-
   mount RailsMiniProfiler::Engine => '/rails_mini_profiler'
 end
 ```
@@ -76,18 +74,18 @@ top right that is injected into your pages.
 
 ![overview](docs/images/overview.png)
 
-Requests to your application will be profiled automatically. You can view all stored requests by navigating to `yourapp/rails_mini_profiler/profiled_requests`.
+Requests to your application will be profiled automatically. You can view and search all stored requests by navigating to `yourapp/rails_mini_profiler/profiled_requests`.
 
 ### Request Details
 
 <p align="center">
   <img alt="Light" src="docs/images/trace.png" width="45%">
 &nbsp; &nbsp; &nbsp; &nbsp;
-  <img alt="Dark" src="docs/images/sequel.png" width="45%">
+  <img alt="Dark" src="docs/images/trace-details.png" width="45%">
 </p>
 
 This view shows you how your requests spend their time. How much of it is spent in the DB, how much in rendering views?
-By clicking on individual traces you can find out detailed information.
+May can filter and clicking on individual traces to gain deeper insights and see detailed information.
 
 ### Flamegraphs
 
@@ -114,15 +112,8 @@ Rails Mini Profiler provides a wide array of configuration options. You can find
 | `skip_paths`             | `[]`                         | An array of request paths that should not be profiled. Regex allowed.                           |
 | `storage`                | `Storage.new`                | Storage configuration. See [Storage](#Storage).                                                 |
 | `ui`                     | `UserInterface.new`          | UI configuration. See [UI](#UI).                                                                |
-| `user_provider`          | `Rack::Request.new(env).ip`  | How to identify users. See [Users](#Users)                                                      |
-
-### Request Configuration
+| `user_provider`          | `Rack::Request.new(env).ip`  | How to identify users. See [Authorization](#Authorization)                                                      |
 
-You may override the configuration by sending request parameters. The following parameters are available:
-
-| Name           | Description                                                                                 |
-| ---------------- | ------------------------------------------------------------------------------------------- |
-| `rmp_flamegraph` | Overrides `flamegraph_enabled` If set to `true` will redirect to the flamegraph immediatly. |
 
 ### Storage
 
@@ -140,7 +131,7 @@ Rails Mini Profiler does not offer an automatic way to clean up old profiling in
 
 ```ruby
 # Clockwork
-every(1.month, 'purge rails mini profiler' do
+every(1.month, 'purge rails mini profiler') do
     ProfiledRequestCleanupJob.perform_later
 end
 
@@ -158,25 +149,33 @@ end
 
 Rails Mini Profiler allows you to configure various UI features. 
 
-| Name                | Default      | Description                                                                                     |
-|---------------------|--------------|-------------------------------------------------------------------------------------------------|
-| `badge_enabled`     | `true`       | Should the hedgehog 🦔 badge be injected into pages?                                             |
-| `badge_position`    | `'top-left'` | Where to display the badge. Options are `'top-left', 'top-right', 'bottom-left, 'bottom-right'` |
-| `page_size`         | `25`         | The page size for lists shown in the UI.                                                        |
-| `webpacker_enabled` | `true`       | Use Webpacker if available? Disable to fall back to the asset pipeline.
+| Name                | Default                   | Description                                                                                     |
+|---------------------|---------------------------|-------------------------------------------------------------------------------------------------|
+| `badge_enabled`     | `true`                    | Should the hedgehog 🦔 badge be injected into pages?                                             |
+| `badge_position`    | `'top-left'`              | Where to display the badge. Options are `'top-left', 'top-right', 'bottom-left, 'bottom-right'` |
+| `base_controller`   | `ApplicationController` | Which controller UI controllers should inherit from.                                            |
+| `page_size`         | `25`                      | The page size for lists shown in the UI.                                                        |
+| `webpacker_enabled` | `true`                    | Use Webpacker if available? Disable to fall back to the asset pipeline.                         |
 
+### Request Configuration
 
-### Users
+You may override static configuration on a per-request by attaching request parameters. For example, `https://myapp.com/api/mydata?rmp_flamegraph=false`
 
-Profiling information is segregated by user ID. That means users cannot see each other's profiled requests.
+| Name           | Description                                                                                 |
+| ---------------- | ------------------------------------------------------------------------------------------- |
+| `rmp_flamegraph` | Overrides `flamegraph_enabled` If set to `true` will redirect to the flamegraph immediately. |
+
+### Authorization
 
-Per default, individual users are identified by their IP address. You may change this by setting a custom user provider:
+Profiling information is segregated by user ID. That means users cannot see each other's profiled requests. Per default, individual users are identified by their IP adress.
+
+You may change this by setting a custom user provider:
 
 ```ruby
 config.user_provider = proc { |env| Rack::Request.new(env).ip }
 ```
 
-You may also explicitly set the user from the application itself:
+You may also explicitly set the user by modifying your application controller (or the controller you have configured as UI base controller):
 
 ```ruby
 class ApplicationController < ActionController::Base
@@ -186,15 +185,18 @@ class ApplicationController < ActionController::Base
 end
 ```
 
-Note that you **must** set the current user when running Rails Mini Profiler in production. No profiles will be saved otherwise.
+`ApplicationController` is used as the default base class for UI controllers. To change it, you may use `configuration.ui.base_controller`.
 
 ### Profiling in Production
 
 Rails Mini Profiler is not intended for performance reporting. There are other tools for that ( [Skylight](https://www.skylight.io/),
-[New Relic](https://newrelic.com/), [DataDog](https://www.datadoghq.com/)...).
+[New Relic](https://newrelic.com/), [DataDog](https://www.datadoghq.com/)...). But you can still use RMP in production to profile specific requests. 
+
+Per default, *no requests will be profiled* in production, and the Rails Mini Profiler UI will be inaccessible. 
+
+#### Enabling Profiling
 
-However, you can still use it in production to profile specific requests. Since profiling impacts performance, it is recommended
-that you limit which requests are being profiled:
+Since profiling impacts performance, it is recommended that you limit which requests are being profiled:
 
 ```ruby
 RailsMiniProfiler.configure do |config|
@@ -202,7 +204,17 @@ RailsMiniProfiler.configure do |config|
 end
 ```
 
-Only requests by explicitly set users will be stored. To configure how individual users are identified see [Users](#Users)
+#### Authorizing Users
+
+You must explicitly authorize profiling for users, as well as authenticate them to the UI:
+
+```ruby
+class ApplicationController < ActionController::Base
+  before_action do
+    RailsMiniProfiler::User.authorize(current_user.id) # Requests by this user will now be profiled, and they get access to the UI
+  end
+end
+```
 
 ## Why Rails Mini Profiler?
 
@@ -212,13 +224,13 @@ Improving the performance of any application is a 3-step process. You have to an
 2. Why is it slow?
 3. Did my solution fix the slowness?
 
-I'm a huge fan of [rack-mini-profiler](https://github.com/MiniProfiler/rack-mini-profiler), and AMP tools such as [Skylight](https://www.skylight.io/) or [Scout APM](https://scoutapm.com), and each of these tools has its place.
+I'm a huge fan of [rack-mini-profiler](https://github.com/MiniProfiler/rack-mini-profiler), and APM tools such as [Skylight](https://www.skylight.io/) or [Scout APM](https://scoutapm.com). Each of these tools has its own areas where it succeeds.
 
-APM tools are excellent for profiling your app in production - aka. they show you what is slow - and offer _some_ hints as to what causes the slowdown. `rack-mini-profiler` can do some sampling in production, but excels at providing detailed insight into _why_ something is slow, using Flamegraphs and detailed query information.
+APM tools are excellent for profiling your app in production - aka. they show you what is slow - and offer _some_ hints as to what causes the slowdown. `rack-mini-profiler` can do some sampling in production, but excels at providing detailed insight into _why_ something is slow by providing Flamegraphs and detailed query information.
 
 Rails Mini Profiler improves upon `rack-mini-profiler` in the latter regard. It is a developer tool, rather than a monitoring tool, and sets a big focus on developer experience. Simply put, it aims to be the best tool available to help you figure out _why_ specific requests are slow.
 
-As such, compared to `rack-mini-profiler`, it does not support non-Rails apps (e.g. Sinatra) or production sampling, but provides a much better user experience and better supports API-only applications.
+As such, compared to `rack-mini-profiler`, it does not support non-Rails apps (e.g. Sinatra) or production sampling, but provides a much better user experience and better support for API-only applications.
 
 ## Troubleshooting
 
@@ -243,13 +255,13 @@ rails db:migrate
 
 Rails Mini Profiler supports API-only apps, but you have to make some small adjustments to use it. At the top of `application.rb` add [Sprockets](https://github.com/rails/sprockets-rails):
 
-```
+```ruby
 require "sprockets/railtie"
 ```
 
 Then, modify `application.rb`:
 
-```
+```ruby
 module ApiOnly
   class Application < Rails::Application
     
@@ -259,7 +271,7 @@ module ApiOnly
 end
 ```
 
-**Note: Sprockets and flash are currently required for some of Rails Mini Profiler's UI features. These modifications may no longer be needed in the future.
+**Note**: Sprockets and flash are currently required for some of Rails Mini Profiler's UI features. These modifications may no longer be needed in the future.
 
 ### No Flamegraphs are being recored?
 

data/app/adapters/rails_mini_profiler/database_adapter.rb

@@ -0,0 +1,16 @@
+# frozen_string_literal: true
+
+module RailsMiniProfiler
+  class DatabaseAdapter
+    class << self
+      def cast_to_text(column)
+        if ActiveRecord::Base.connection.adapter_name == 'PostgreSQL'
+          # Cast json field to text to have access to the LIKE operator
+          "#{column}::text"
+        else
+          column
+        end
+      end
+    end
+  end
+end

data/app/controllers/rails_mini_profiler/application_controller.rb

@@ -1,12 +1,10 @@
 # frozen_string_literal: true
 
 module RailsMiniProfiler
-  class ApplicationController < ActionController::Base
-    include Pagy::Backend
-
+  class ApplicationController < RailsMiniProfiler.configuration.ui.base_controller
     rescue_from ActiveRecord::RecordNotFound, with: ->(error) { handle(error, 404) }
 
-    before_action :check_current_user
+    before_action :check_rmp_user
 
     protected
 
@@ -26,8 +24,13 @@ module RailsMiniProfiler
       end
     end
 
-    def check_current_user
-      redirect_back(fallback_location: root_path) unless User.get(request.env).present?
+    def check_rmp_user
+      user = User.get(request.env).present?
+      redirect_back(fallback_location: fallback_location) unless user
+    end
+
+    def fallback_location
+      defined?(main_app.root_path) ? main_app.root_path : '/'
     end
   end
 end

data/app/controllers/rails_mini_profiler/profiled_requests_controller.rb

@@ -4,6 +4,8 @@ require_dependency 'rails_mini_profiler/application_controller'
 
 module RailsMiniProfiler
   class ProfiledRequestsController < ApplicationController
+    include Pagy::Backend
+
     before_action :set_profiled_request, only: %i[show destroy]
 
     def index
@@ -14,11 +16,16 @@ module RailsMiniProfiler
     end
 
     def show
-      @traces = @profiled_request.traces
-      @traces = @traces.where("#{payload_column} LIKE ?", "%#{params[:search]}%") if params[:search]
-      @traces = @traces
+      search = TraceSearch.new(show_params, scope: @profiled_request.traces)
+      context = {
+        start: @profiled_request.start,
+        finish: @profiled_request.finish,
+        total_duration: @profiled_request.duration,
+        total_allocations: @profiled_request.allocations
+      }
+      @traces = search.results
                   .order(:start)
-                  .map { |trace| present(trace, profiled_request: @profiled_request) }
+                  .map { |trace| present(trace, context: context) }
       @profiled_request = present(@profiled_request)
     end
 
@@ -40,6 +47,10 @@ module RailsMiniProfiler
 
     private
 
+    def show_params
+      params.permit(:id, :payload, :duration, :allocations, name: [])
+    end
+
     def index_params
       params.permit(:path, :duration, id: [], method: [], media_type: [], status: [])
     end

data/app/helpers/rails_mini_profiler/profiled_requests_helper.rb

@@ -12,5 +12,15 @@ module RailsMiniProfiler
     def formatted_allocations(allocations)
       number_to_human(allocations, units: { unit: '', thousand: 'k', million: 'M', billion: 'B', trillion: 'T' })
     end
+
+    def trace_display_name(name)
+      {
+        'sql.active_record': 'ActiveRecord Query',
+        'instantiation.active_record': 'ActiveRecord Instantiation',
+        'render_template.action_view': 'Render View',
+        'render_partial.action_view': 'Render Partial',
+        'process_action.action_controller': 'Controller'
+      }[name.to_sym]
+    end
   end
 end

data/app/javascript/js/clipboard_controller.js

@@ -36,11 +36,18 @@ export default class extends Controller {
     }
 
     const copiedClass = this.data.get("copiedClass");
-    console.log(copiedClass);
-    this.buttonTarget.classList.add(copiedClass);
+    if (copiedClass) {
+      this.buttonTarget.classList.add(copiedClass);
+    }
+    const copiedMessage = this.data.get("copiedMessage");
+    const content = this.buttonTarget.innerHTML;
+    if (copiedMessage) {
+      this.buttonTarget.innerHTML = copiedMessage;
+    }
 
     this.timeout = setTimeout(() => {
       this.buttonTarget.classList.remove(copiedClass);
+      this.buttonTarget.innerHTML = content;
     }, this.successDuration);
   }
 }

data/app/javascript/js/filter_controller.js

@@ -7,6 +7,10 @@ export default class extends Controller {
     location.href = `${window.location.pathname}?${this.params}`;
   }
 
+  reset() {
+    location.href = `${window.location.pathname}`;
+  }
+
   post() {
     const token = document.head.querySelector(
       'meta[name="csrf-token"]'

data/app/javascript/stylesheets/components/buttons.scss

@@ -0,0 +1,59 @@
+button,
+.button {
+  display: inline-block;
+  padding: 0.5em 0.5em;
+  border: none;
+  border-radius: 5px;
+  cursor: pointer;
+  font-size: 1rem;
+  text-align: center;
+  text-decoration: none;
+
+  &:disabled {
+    background: var(--grey-200);
+    cursor: not-allowed;
+  }
+}
+
+.btn-red {
+  background: var(--red-500);
+  color: white;
+  font-weight: 600;
+  outline: none;
+
+  &:hover {
+    background: var(--red-600);
+  }
+}
+
+.btn-grey {
+  background: var(--grey-200);
+
+  &:hover {
+    background: var(--grey-100);
+  }
+}
+
+.btn-white {
+  border: 1px solid var(--grey-200);
+  background: white;
+
+  &:hover {
+    background: var(--grey-100);
+  }
+}
+
+button:hover {
+  box-shadow: 0 0.25rem 0.25rem 0 var(--grey-50);
+}
+
+button.none {
+  padding: 0;
+  border: none;
+  background: none;
+  outline: none;
+
+  &:hover {
+    box-shadow: none;
+  }
+}

data/app/javascript/stylesheets/components/{profiled_request_table/profiled_request_table.scss → dropdown.scss}

@@ -1,54 +1,3 @@
-.table {
-  width: 100%;
-  border: hidden 1px var(--border-color);
-
-  /* Hack to get table row borders, see https://stackoverflow.com/a/2586780/2553104 */
-  border-collapse: collapse;
-  border-radius: 5px;
-  box-shadow: 0 0 0 1px var(--border-color);
-  table-layout: fixed;
-}
-
-.table th,
-.table td {
-  padding: 0.5rem 1rem;
-}
-
-.table thead tr {
-  border: hidden 1px var(--border-color);
-  box-shadow: 0 0 0 1px var(--border-color);
-  color: var(--grey-400);
-}
-
-.table tr:nth-child(even) {
-  background: var(--grey-50);
-}
-
-.table thead th {
-  font-weight: 400;
-}
-
-.table-filter-icon {
-  width: 14px;
-  margin-left: 0.5rem;
-}
-
-.table tbody tr:not(.no-row) {
-  border: solid 1px var(--border-color);
-  color: var(--grey-700);
-  cursor: pointer;
-}
-
-.table tbody tr:not(.no-row):hover {
-  background: var(--grey-100);
-}
-
-.request-checkbox {
-  z-index: 1;
-  width: 1rem;
-  height: 1rem;
-}
-
 .dropdown-body {
   padding: 0.33rem 0.5rem;
 }
@@ -152,28 +101,3 @@
     background: var(--red-600);
   }
 }
-
-.dropdown-search-button {
-  display: inline-block;
-  padding: 0.5em 0.5em;
-  border: none;
-  background: var(--red-500);
-  border-radius: 5px;
-  color: white;
-  cursor: pointer;
-  font-size: 1rem;
-  font-weight: 600;
-  text-align: center;
-  text-decoration: none;
-
-  &:hover {
-    background: var(--red-600);
-  }
-}
-
-.request-path {
-  overflow: hidden;
-  max-width: 280px;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}

data/app/javascript/stylesheets/components/input.scss

@@ -0,0 +1,10 @@
+input[type=submit] {
+  display: inline-block;
+  padding: 0.5em 0.5em;
+  border: none;
+  border-radius: 5px;
+  cursor: pointer;
+  font-size: 1rem;
+  text-align: center;
+  text-decoration: none;
+}

data/app/javascript/stylesheets/components/page_header.scss

@@ -0,0 +1,7 @@
+.page-header {
+  padding: 2.5rem 0 2.5rem;
+}
+
+.page-header h1 {
+  font-size: 28px;
+}

data/app/javascript/stylesheets/components/{profiled_request_table/placeholder.scss → placeholder.scss}

@@ -1,4 +1,3 @@
-
 .placeholder {
   display: flex;
   width: 100%;
@@ -20,6 +19,10 @@
   text-align: center;
 }
 
+.placeholder-text h2 {
+  padding-bottom: 1rem;
+}
+
 .placeholder-link {
   color: var(--grey-400);
 

data/app/javascript/stylesheets/components/profiled_request_table.scss

@@ -0,0 +1,55 @@
+.table {
+  width: 100%;
+  border: hidden 1px var(--border-color);
+
+  /* Hack to get table row borders, see https://stackoverflow.com/a/2586780/2553104 */
+  border-collapse: collapse;
+  border-radius: 5px;
+  box-shadow: 0 0 0 1px var(--border-color);
+  table-layout: fixed;
+}
+
+.table th,
+.table td {
+  padding: 0.5rem 1rem;
+}
+
+.table thead tr {
+  color: var(--grey-500);
+}
+
+.table tr:nth-child(even) {
+  background: var(--grey-50);
+}
+
+.table thead th {
+  font-weight: 400;
+}
+
+.table-filter-icon {
+  width: 14px;
+  margin-left: 0.5rem;
+}
+
+.table tbody tr:not(.no-row) {
+  border: solid 1px var(--border-color);
+  color: var(--grey-700);
+  cursor: pointer;
+}
+
+.table tbody tr:not(.no-row):hover {
+  background: var(--grey-100);
+}
+
+.request-checkbox {
+  z-index: 1;
+  width: 1rem;
+  height: 1rem;
+}
+
+.request-path {
+  overflow: hidden;
+  max-width: 280px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}

data/app/javascript/stylesheets/components/trace.scss

@@ -0,0 +1,93 @@
+.trace {
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  padding: 0.25em 0;
+  list-style: none;
+}
+
+.trace:nth-child(odd) {
+  background: var(--grey-100);
+}
+
+.trace .trace-bar {
+  position: relative;
+  height: 16px;
+  padding: 0;
+  margin: 0;
+  background: linear-gradient(to top right, var(--grey-500), var(--grey-400));
+  cursor: pointer;
+}
+
+.instantiation-trace .trace-bar {
+  background: linear-gradient(to top right, var(--green-400), var(--green-300));
+}
+
+.sequel-trace .trace-bar {
+  background: linear-gradient(to top right, var(--green-500), var(--green-400));
+}
+
+.controller-trace .trace-bar {
+  background: linear-gradient(to top right, var(--yellow-500), var(--yellow-400));
+}
+
+.render-template-trace .trace-bar,
+.render-partial-trace .trace-bar {
+  background: linear-gradient(to top right, var(--blue-500), var(--blue-400));
+}
+
+.trace-name {
+  overflow: hidden;
+  box-sizing: border-box;
+  padding: 0 0.5em;
+  margin: 0;
+  color: var(--grey-400);
+  font-size: 14px;
+  text-align: right;
+  text-overflow: ellipsis;
+}
+
+.trace-payload {
+  margin: 0;
+}
+
+.sequel-trace-query {
+  overflow: auto;
+  max-height: 100px;
+  padding: 1em 1em;
+  background: var(--grey-100);
+  white-space: pre-wrap;
+}
+
+.sequel-trace-binds {
+  overflow: auto;
+  max-height: 100px;
+  padding: 0.5em 1em;
+  margin: 0 0 1em 0;
+  background: var(--grey-50);
+  font-size: 12px;
+  white-space: pre-wrap;
+}
+
+.backtrace {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0.5em;
+  background: var(--grey-100);
+}
+
+.backtrace button {
+  overflow: auto;
+  height: 20px;
+  padding: 0;
+  margin: 0;
+  background: none;
+  color: var(--grey-500);
+}
+
+.backtrace button svg {
+  width: 20px;
+  height: 20px;
+}