Skip to content

Commit 30b6d93

Browse files
Copilotlstein
andcommitted
Add setTimeout(0) to allow spinner to render before heavy computation
The issue was that the synchronous operations were executing immediately after showing the spinner, without giving the browser a chance to paint the DOM changes. By adding `await new Promise(resolve => setTimeout(resolve, 0))`, we yield control back to the event loop, allowing the browser to render the spinner before the expensive cluster sorting operations begin. This ensures the spinner is visible during the 1-3 second delay on large clusters. Co-authored-by: lstein <111189+lstein@users.noreply.github.com>
1 parent a3e9fbb commit 30b6d93

File tree

1 file changed

+6
-0
lines changed
  • photomap/frontend/static/javascript

1 file changed

+6
-0
lines changed

photomap/frontend/static/javascript/umap.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1260,6 +1260,9 @@ async function handleClusterClick(clickedIndex) {
12601260
// Show spinner immediately to provide visual feedback
12611261
showUmapSpinner();
12621262

1263+
// Yield to the browser to allow spinner to render before heavy computation
1264+
await new Promise(resolve => setTimeout(resolve, 0));
1265+
12631266
try {
12641267
const clickedCluster = clickedPoint.cluster;
12651268
const clusterColor = getClusterColor(clickedCluster);
@@ -1302,6 +1305,9 @@ async function handleImageClick(clickedIndex) {
13021305
// Show spinner immediately to provide visual feedback
13031306
showUmapSpinner();
13041307

1308+
// Yield to the browser to allow spinner to render before heavy computation
1309+
await new Promise(resolve => setTimeout(resolve, 0));
1310+
13051311
try {
13061312
// Clear any existing search selection
13071313
exitSearchMode();

0 commit comments

Comments
 (0)