Bad message "-23570 rows could not be mapped... showing. 23626"

[thehappycheese]

This appears to happen due to multiple overlapping asynchronous requests where the old request was not cancelled and finishes after the new request. This happens when the user is rapidly switching between a large and small number of rows, ending on the small number of rows. The small number of roads loads instantly but is then replaced on the map by the large number of rows.

[thehappycheese]

Should be able to fix it using this pattern

let currentController = null;

async function fetchData(url) {
  // Abort the previous fetch request if there's any
  if (currentController) {
    currentController.abort();
  }

  // Create a new AbortController for the current fetch request
  currentController = new AbortController();

  try {
    const response = await fetch(url, { signal: currentController.signal });

    // Reset the currentController after a successful fetch
    currentController = null;

    if (!response.ok) {
      throw new Error(`HTTP error: ${response.status}`);
    }

    return await response.json();
  } catch (error) {
    if (error.name === 'AbortError') {
      console.log('Fetch request aborted');
    } else {
      console.error('Fetch request failed:', error);
    }

    // Reset the currentController after an aborted or failed fetch
    currentController = null;
  }
}

[thehappycheese]

Despite the fixes this issue is still a problem in rare cases. The problem appears to come from internal workings of the web browser.

Because parsing received JSON data happens in an async block, there is a very short period of time between completing a fetch request and displaying the data on the map were things can still go wrong; during this time another fetch request can be completed and parsed but is unable to cancel the previous async process.

For this reason the server has been modified to echo a header x-request-id (see this bit of code) (which can take the value of any 64 bit positive integer). This header will allow the visual to easily detect out-of-order responses from the server and prevent showing out of date information on the map.

[thehappycheese]

I think I finally knocked this nail on the head with #54