Skip to content

Cancel duplicate network requests when filtering analytics dashboards

Elwyn Benson requested to merge 444251-dashboard-race-condition into master

What does this MR do and why?

Follows on from previous effort to prevent out-of-order responses displaying incorrect data. This final MR now cancels duplicate requests at the network level, instead of just displaying the most recent request data.

Additionally, it extends the new data source class to expose a destroy method, which panels_base will call when destroying. This allows in-flight http requests to be cleaned up when the component unmounts.

The data sources classes now extend a base class, which provides a default (no-op) implementation of destroy (so that panels_base always has something to call), as well as ensuring new data sources implement the required methods.

The different data sources must cancel pending requests in different ways, due to their implementation (e.g. GraphQL query vs CubeJS query)

  1. The usage_overview data_source has been changed to use the apollo client watchQuery instead of query, which allows unsubscribeing, which cancels http requests.

  2. CubeJS client is now given a mutexKey. This is the mechanism the CubeJS client provides for dealing with subsequent / duplicate requests. The mutexKey is generated once per data_source class instance, which means CubeJS will consider subsequent requests from the same panel as a duplicate, and clean up any existing queries which are running.

Additionally, the Cube code has been modified to use an overloaded version of load. By passing in a NodeJS style callback to handle the response, load will return an unsubscribe function. We can then use this to opt-in to the new destroy functionality.

MR acceptance checklist

Please evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

# MR status
1️⃣ Fix race condition when changing dashboard filt... (!152021 - merged) workflowcomplete
2️⃣ Refactor analytics data sources (!152022 - merged) workflowcomplete
3️⃣ Cancel duplicate network requests when filterin... (!151603) <-- you are here

Screenshots or screen recordings

No visual differences.

How to set up and validate locally

  1. Follow these instructions to setup Product Analytics in GDK.
  2. Onboard Product Analytics by setting up the feature at Project > Analytics > Analytics dashboards.
  3. Generate some events for this project so your dashboards have data.
  4. View a dashboard, and flip the date filter value very quickly. You will see additional network requests fire each time. It can be tricky to reproduce the original bug, I suggest using the devtools network panel "throttling" feature (slow-3g) to give yourself more time to toggle filters.

Related to #444251

Edited by Elwyn Benson

Merge request reports