Files
notifications-admin/app/templates/views/notifications/notification.html
Chris Hill-Scott a2929ad748 Delay AJAX calls if the server is slow to respond
By default our AJAX calls were 2 seconds. Then they were 5 seconds
because someone reckoned 2 seconds was putting too much load on the
system. Then we made them 10 seconds while we were having an incident.
Then we made them 20 seconds for the heaviest pages, but back to 5
seconds or 2 seconds for the rest of the pages.

This is not a good situation because:
- it slows all services down equally, no  matter how much traffic they
  have, or which features they have  switched on
- it slows everything down by the same amount, no matter how much load
  the platform is under
- the values are set based on our worst performance, until we manually
  remember to switch them back
- we spend time during incidents deploying changes to slow down the
  dashboard refresh time because it’s a nothing-to-lose change that
  might relieve some symptoms, when we could be spending time digging
  into the underlying cause

This pull request makes the Javascript smarter about how long it waits
until it makes another AJAX call. It bases the delay on how long the
server takes to respond (as a proxy for how much load the server is
under).

It’s based on the square root of the response time, so is more sensitive
to slow downs early on, and less sensitive to slow downs later on. This
helps us give a more pronounced difference in delay between an AJAX call
that is fast (for example the page for a single notification) and one
that is slow (for example a dashboard for a service with lots of
traffic).

*Some examples of what this would mean for various pages*

Page | Response time | Wait until next AJAX call
---|---|---
Check a reply to address | 130ms | 1,850ms
Brand new service dashboard | 229ms | 2,783ms
HM Passport Office dashboard | 634ms | 5,294ms
NHS Coronavirus Service dashboard | 779ms | 5,977ms
_Example of the kind of slowness we’ve seen during an incident_ | 6,000ms | 18,364ms
GOV.UK email dashboard | `HTTP 504` | 😬
2020-04-09 12:05:18 +01:00

112 lines
4.7 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
{% extends "withnav_template.html" %}
{% from "components/banner.html" import banner %}
{% from "components/ajax-block.html" import ajax_block %}
{% from "components/message-count-label.html" import message_count_label %}
{% from "components/page-header.html" import page_header %}
{% from "components/page-footer.html" import page_footer %}
{% block service_page_title %}
{{ message_count_label(1, template.template_type, suffix='') | capitalize }}
{% endblock %}
{% block maincolumn_content %}
{{ page_header(
message_count_label(1, template.template_type, suffix='') | capitalize,
back_link=back_link
) }}
<p>
{% if is_precompiled_letter %}
{% if created_by %}
Uploaded
{% else %}
Provided as PDF
{% endif %}
{% else %}
{% if help %}
{{ template.name }}
{% else %}
<a class="govuk-link govuk-link--no-visited-state" href="{{ url_for('.view_template', service_id=current_service.id, template_id=template.id) }}">{{ template.name }}</a>
{% endif %}
was sent
{% endif %}
{% if job and job.original_file_name != 'Report' %}
{% set destination =
{'letter': 'an address', 'email': 'an email address', 'sms': 'a phone number'} %}
to {{ destination[template.template_type] }} from
<a class="govuk-link govuk-link--no-visited-state" href="{{ url_for('.view_job', service_id=current_service.id, job_id=job.id) }}">{{ job.original_file_name }}</a>
{% elif created_by %}
by {{ created_by.name }}
{% endif %}
{{ created_at|format_datetime_human }}
</p>
{% if template.template_type == 'letter' %}
{% if notification_status in ('permanent-failure', 'cancelled') %}
<p class="notification-status-cancelled">
Cancelled {{ updated_at|format_datetime_short }}
</p>
{% elif notification_status == 'validation-failed' %}
<p class="notification-status-cancelled">
{{ message.summary | safe }}
</p>
{% elif notification_status == 'technical-failure' %}
<p class="notification-status-cancelled">
Technical failure Notify will resend once the team have
fixed the problem
</p>
{% else %}
{% if sent_with_test_key %}
{% if is_precompiled_letter %}
<p>
This letter passed our checks, but we will not print it because you used a test key.
</p>
{% else %}
<p>
We will not print this letter because you used a test key.
</p>
{% endif %}
{% else %}
<p>
{{ letter_print_day }}
</p>
<p>
Estimated delivery date: {{ estimated_letter_delivery_date|format_day_of_week }} {{ estimated_letter_delivery_date|format_date_short }}
</p>
{% endif %}
{% endif %}
{% endif %}
<div class="{{ 'letter-sent' if template.template_type == 'letter' else '' }}">
{{ template|string }}
</div>
{% if template.template_type == 'letter' %}
<div class="js-stick-at-bottom-when-scrolling">
<div class="page-footer">
{% if show_cancel_button %}
<span class="page-footer-delete-link page-footer-delete-link-without-button">
<a class="govuk-link govuk-link--destructive" href="{{ url_for('main.cancel_letter', service_id=current_service.id, notification_id=notification_id) }}">Cancel sending this letter</a>
</span>
{% else %}
<div>&nbsp;</div>
{% endif %}
<a class="govuk-link govuk-link--no-visited-state page-footer-right-aligned-link-without-button" href="{{ url_for('main.view_letter_notification_as_preview', service_id=current_service.id, notification_id=notification_id, filetype='pdf') }}" download>Download as a PDF</a>
</div>
</div>
{% elif template.template_type == 'email' %}
<div class="js-stick-at-bottom-when-scrolling">
{{ ajax_block(partials, updates_url, 'status', finished=finished) }}
</div>
{% elif template.template_type == 'sms' %}
{{ ajax_block(partials, updates_url, 'status', finished=finished) }}
{% endif %}
{% if current_user.has_permissions('send_messages') and current_user.has_permissions('view_activity') and template.template_type == 'sms' and can_receive_inbound %}
<p>
<a class="govuk-link govuk-link--no-visited-state" href="{{ url_for('.conversation', service_id=current_service.id, notification_id=notification_id, _anchor='n{}'.format(notification_id)) }}">See all text messages sent to this phone number</a>
</p>
{% endif %}
{% endblock %}