Make user bounding box updates more efficient

CHANGELOG.unreleased.md

@@ -46,6 +46,7 @@ For upgrade instructions, please check the [migration guide](MIGRATIONS.released
 - Fixed a bug where merging annotations with large tree IDs could lead to an error. [#8643](https://github.com/scalableminds/webknossos/pull/8643)
 - Fixed that the segment stats were sometimes not displayed in the context menu. [#8645](https://github.com/scalableminds/webknossos/pull/8645)
 - Fixed a bug in zarr streaming where directly after the datastore startup, chunk responses would have status 404 (leading zarr clients to fill with fill_value). Now it will yield status 503, so that clients can retry or escalate this as an error. [#8644](https://github.com/scalableminds/webknossos/pull/8644)
+- Improved efficiency of saving bounding box related changes. [#8492](https://github.com/scalableminds/webknossos/pull/8492)
 - Fixed regression which caused the import of trees (also of agglomerate skeletons) to crash if the annotation was not empty. [#8656](https://github.com/scalableminds/webknossos/pull/8656)
 - Fixed that one could activate unavailable tools or toolkits in read-only mode. [#8658](https://github.com/scalableminds/webknossos/pull/8658)
 

frontend/javascripts/dashboard/dataset/dataset_settings_view.tsx

@@ -20,7 +20,7 @@ import type {
 } from "history";
 import { handleGenericError } from "libs/error_handling";
 import Toast from "libs/toast";
-import { diffObjects, jsonStringify } from "libs/utils";
+import { jsonStringify } from "libs/utils";
 import _ from "lodash";
 import messages from "messages";
 import * as React from "react";
@@ -313,7 +313,7 @@ class DatasetSettingsView extends React.PureComponent<PropsWithFormAndRouter, St
   }
 
   didDatasourceChange(dataSource: Record<string, any>) {
-    return _.size(diffObjects(dataSource, this.state.savedDataSourceOnServer || {})) > 0;
+    return !_.isEqual(dataSource, this.state.savedDataSourceOnServer || {});
   }
 
   didDatasourceIdChange(dataSource: Record<string, any>) {

frontend/javascripts/libs/utils.ts

@@ -1084,32 +1084,27 @@ export function getWindowBounds(): [number, number] {
   return [width, height];
 }
 
-/**
- * Deep diff between two object, using lodash
- * @param  {Object} object Object compared
- * @param  {Object} base   Object to compare with
- * @return {Object}        Return a new object who represent the diff
- *
- * Source: https://gist.github.com/Yimiprod/7ee176597fef230d1451#gistcomment-2699388
- */
-export function diffObjects(
-  object: Record<string, any>,
-  base: Record<string, any>,
-): Record<string, any> {
-  function changes(_object: Record<string, any>, _base: Record<string, any>) {
-    let arrayIndexCounter = 0;
-    return _.transform(_object, (result, value, key) => {
-      if (!_.isEqual(value, _base[key])) {
-        const resultKey = _.isArray(_base) ? arrayIndexCounter++ : key;
-        // @ts-expect-error ts-migrate(2571) FIXME: Object is of type 'unknown'.
-        result[resultKey] =
-          _.isObject(value) && _.isObject(_base[key]) ? changes(value, _base[key]) : value;
-      }
-    });
-  }
-
-  // @ts-expect-error ts-migrate(2322) FIXME: Type 'unknown' is not assignable to type 'Record<s... Remove this comment to see the full error message
-  return changes(object, base);
+export function diffObjects<K extends string | number | symbol, V, Dict extends Record<K, V>>(
+  a: Dict,
+  b: Dict,
+): Partial<Dict> {
+  /**
+   * Returns the difference between two objects as a partial object.
+   *
+   * Compares two objects `a` and `b` and returns a new object containing the key-value
+   * pairs that are present in `b` but not in `a`, using deep equality comparison.
+   * Note that keys that are not present in b but in a are *not* returned.
+   *
+   * @param {Dict} a - The "original" object to compare to as a base.
+   * @param {Dict} b - The "newer" object that will be used for the returned values.
+   * @returns {Partial<Dict>} - A partial object containing the key-value pairs that differ.
+   *
+   * @example
+   * const a = { x: 1, y: 2, z: 3 };
+   * const b = { x: 1, y: 3, q: 4 }; // y is different, z is missing, q was added
+   * diffObjects(a, b); // returns { y: 3, q: 4 }
+   */
+  return _.fromPairs(_.differenceWith(_.toPairs(b), _.toPairs(a), _.isEqual)) as Partial<Dict>;
 }
 
 export function fastDiffSetAndMap<T>(setA: Set<T>, mapB: Map<T, T>) {