[feat] results: show response times

searx/static/themes/simple/src/less/style.less

@@ -748,6 +748,20 @@ summary.title {
   }
 }
 
+#engines_msg {
+  .engine-name {
+    width: 10rem;
+  }
+
+  .response-error {
+    color: var(--color-error);
+  }
+
+  .bar-chart-value {
+    width: auto;
+  }
+}
+
 #search_url {
   div.selectable_url {
     pre {

searx/templates/simple/elements/engines_msg.html

@@ -1,27 +1,34 @@
 <div id="engines_msg">
   {% if not results and not answers %}
   <details class="sidebar-collapsable" open>
+    <summary class="title" id="engines_msg-title">{{ _('Messages from the search engines') }}</summary>
   {% else %}
   <details class="sidebar-collapsable">
+    <summary class="title" id="engines_msg-title">{{ _('Response time') }}: {{ max_response_time | round(1) }} {{ _('seconds') }}</summary>
   {% endif %}
-    <summary class="title" id="engines_msg-title">{{ _('Messages from the search engines') }}</summary>
-    <div class="dialog-error" role="alert">
-      {{ icon_big('warning') }}
-      <div>
-        <p>
-          <strong>{{ _('Error!') }}</strong>
-          {{ _('Engines cannot retrieve results') }}:
-        </p>
+    <table class="engine-stats" id="engines_msg-table">
       {%- for engine_name, error_type in unresponsive_engines -%}
-          <p>{{- engine_name }} (
+      <tr>
+        <td class="engine-name">
           <a href="{{ url_for('stats', engine=engine_name|e) }}"
              title="{{ _('View error logs and submit a bug report') }}">
-               {{- error_type -}}
+             {{- engine_name -}}
           </a>
-            ){{- '' -}}
-          </p>
+        </td>
+        <td class="response-error">{{- error_type -}}</td>
+      </tr>
       {%- endfor -%}
+      {%- for engine_name, response_time in timings -%}
+      <tr>
+        <td class="engine-name"><a href="{{ url_for('stats', engine=engine_name|e) }}">{{ engine_name }}</a></td>
+        <td class="response-time">
+          <div class="bar-chart-value">{{- response_time | round(1) -}}</div>
+          <div class="bar-chart-graph" aria-labelledby="{{engine_name}}_time" aria-hidden="true">
+            <div class="bar-chart-bar bar{{ (100 * response_time / max_response_time) | round | int }}"></div>
           </div>
-    </div>
+        </td>
+      </tr>
+      {%- endfor -%}
+    </table>
   </details>
 </div>

searx/templates/simple/results.html

@@ -57,14 +57,12 @@
           {%- include 'simple/elements/suggestions.html' -%}
         {%- endif -%}
 
+        {%- include 'simple/elements/engines_msg.html' -%}
+
         {%- if method == 'POST' -%}
           {%- include 'simple/elements/search_url.html' -%}
         {%- endif -%}
 
-        {%- if unresponsive_engines -%}
-          {%- include 'simple/elements/engines_msg.html' -%}
-	{%- endif -%}
-
         {%- if search_formats -%}
           {%- include 'simple/elements/apis.html' -%}
         {%- endif -%}

searx/webapp.py

@@ -761,6 +761,11 @@ def search():
         )
     )
 
+    # engine_timings: get engine response times sorted from slowest to fastest
+    engine_timings = sorted(result_container.get_timings(), reverse=True, key=lambda e: e.total)
+    max_response_time = engine_timings[0].total if engine_timings else None
+    engine_timings_pairs = [(timing.engine, timing.total) for timing in engine_timings]
+
     # search_query.lang contains the user choice (all, auto, en, ...)
     # when the user choice is "auto", search.search_query.lang contains the detected language
     # otherwise it is equals to search_query.lang
@@ -789,7 +794,9 @@ def search():
             settings['search']['languages'],
             fallback=request.preferences.get_value("language")
         ),
-        timeout_limit = request.form.get('timeout_limit', None)
+        timeout_limit = request.form.get('timeout_limit', None),
+        timings = engine_timings_pairs,
+        max_response_time = max_response_time
         # fmt: on
     )