Skip to content

Commit c8018a4

Browse files
committed
🤖 Fix main process freeze: Make React DevTools non-blocking
PROBLEM: React DevTools installation is awaited in app.whenReady(), blocking the main process for several seconds before window creation. User experiences macOS spinning cursor and frozen UI immediately on 'bun start'. Timeline (blocking): App ready → await installExtension (8s) → createMenu → createWindow SOLUTION: Don't await React DevTools installation. Let it install in background while app continues startup. Timeline (non-blocking): App ready → installExtension (background) + createMenu + createWindow IMPACT: - Main process no longer blocks on DevTools installation - Window appears immediately - DevTools still installs, just doesn't block startup
1 parent dc76e7b commit c8018a4

File tree

1 file changed

+11
-9
lines changed

1 file changed

+11
-9
lines changed

src/main.ts

Lines changed: 11 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -363,18 +363,20 @@ function createWindow() {
363363
if (gotTheLock) {
364364
void app.whenReady().then(async () => {
365365
try {
366-
console.log("App ready, creating window...");
366+
console.log(`[${timestamp()}] App ready, creating window...`);
367367

368-
// Install React DevTools in development
368+
// Install React DevTools in development (non-blocking)
369+
// Don't await - let it install in background while app starts
369370
if (!app.isPackaged && installExtension && REACT_DEVELOPER_TOOLS) {
370-
try {
371-
const extension = await installExtension(REACT_DEVELOPER_TOOLS, {
372-
loadExtensionOptions: { allowFileAccess: true },
371+
void installExtension(REACT_DEVELOPER_TOOLS, {
372+
loadExtensionOptions: { allowFileAccess: true },
373+
})
374+
.then((extension) => {
375+
console.log(`[${timestamp()}] React DevTools installed: ${extension.name}`);
376+
})
377+
.catch((err) => {
378+
console.log(`[${timestamp()}] React DevTools install failed:`, err);
373379
});
374-
console.log(`✅ React DevTools installed: ${extension.name} (id: ${extension.id})`);
375-
} catch (err) {
376-
console.log("❌ Error installing React DevTools:", err);
377-
}
378380
}
379381

380382
createMenu();

0 commit comments

Comments
 (0)