perf: optimize badge updates and beforeunload behavior

- Badge DOM diffing: only update changed nodes instead of full rebuild
- Add MutationObserver for file list virtualization, show badges immediately on scroll
- Configurable polling interval (default 0, pure event-driven)
- beforeunload uses sync commit + detached push, eliminate network blocking
- Event listeners no longer depend on autoCommit setting, badge refresh works independently
- Use onLayoutReady at startup to ensure DOM is ready
- Remove unused commitAndPushSync function

Author: whtiehack

main.js

@@ -1,4 +1,4 @@
-import { execFile, execFileSync } from "child_process";
+import { execFile, execFileSync, spawn } from "child_process";
 import { promises as fs } from "fs";
 import * as path from "path";
 
@@ -436,12 +436,27 @@ export function getChangedFilesSync(cwd: string, gitPath: string): string[] {
 	}
 }
 
-export function commitAndPushSync(cwd: string, gitPath: string, message: string): void {
+// Sync commit only, then spawn detached push process
+export function commitSyncAndPushDetached(cwd: string, gitPath: string, message: string): void {
 	try {
 		runGitSync({ cwd, gitPath, args: ["add", "-A"] });
 		runGitSync({ cwd, gitPath, args: ["commit", "-m", message] });
-		runGitSync({ cwd, gitPath, args: ["push"] });
 	} catch {
-		// Ignore errors during close
+		// Commit failed or nothing to commit
+		return;
+	}
+
+	// Spawn detached push process that continues after parent exits
+	try {
+		const child = spawn(gitPath, ["push"], {
+			cwd,
+			detached: true,
+			stdio: "ignore",
+			windowsHide: true,
+			env: { ...process.env, GIT_TERMINAL_PROMPT: "0" },
+		});
+		child.unref();
+	} catch {
+		// Ignore spawn errors
 	}
 }

src/git.ts

@@ -36,6 +36,9 @@ type Translations = {
 	showStatusBadgeName: string;
 	showStatusBadgeDesc: string;
 
+	badgeRefreshIntervalName: string;
+	badgeRefreshIntervalDesc: string;
+
 	showRibbonButtonName: string;
 	showRibbonButtonDesc: string;
 	ribbonMenuPull: string;
@@ -162,6 +165,9 @@ const en: Translations = {
 	showStatusBadgeName: "Show git status in file explorer",
 	showStatusBadgeDesc: "Display colored dots next to changed files and folders.",
 
+	badgeRefreshIntervalName: "Badge refresh interval (seconds)",
+	badgeRefreshIntervalDesc: "Detect external git changes (e.g. terminal commands). Set to 0 if you only use Obsidian.",
+
 	showRibbonButtonName: "Show ribbon button",
 	showRibbonButtonDesc: "Add a ribbon icon for quick Git actions.",
 	ribbonMenuPull: "Pull",
@@ -283,6 +289,9 @@ const zhCN: Translations = {
 	showStatusBadgeName: "在文件列表显示 Git 状态",
 	showStatusBadgeDesc: "在变动的文件和文件夹旁显示彩色圆点。",
 
+	badgeRefreshIntervalName: "状态刷新间隔（秒）",
+	badgeRefreshIntervalDesc: "用于检测外部 git 操作（如终端命令）。若只在 Obsidian 内操作可设为 0。",
+
 	showRibbonButtonName: "显示侧边栏按钮",
 	showRibbonButtonDesc: "添加快捷 Git 操作按钮。",
 	ribbonMenuPull: "拉取",

src/i18n.ts

@@ -1,6 +1,6 @@
 import { EventRef, Menu, Notice, Platform, Plugin, TAbstractFile, TFile, FileSystemAdapter } from "obsidian";
 import { AutoGitSettings, AutoGitSettingTab, DEFAULT_SETTINGS } from "./settings";
-import { getChangedFiles, commitAll, push, pull, getFileStatuses, getConflictFiles, markConflictsResolved, revertAll, revertFile, FileStatus, getChangedFilesSync, commitAndPushSync } from "./git";
+import { getChangedFiles, commitAll, push, pull, getFileStatuses, getConflictFiles, markConflictsResolved, revertAll, revertFile, FileStatus, getChangedFilesSync, commitSyncAndPushDetached } from "./git";
 import { renderTemplate } from "./template";
 import { t } from "./i18n";
 import { RevertConfirmModal } from "./modals";
@@ -15,11 +15,13 @@ export default class AutoGitPlugin extends Plugin {
 	private statusRefreshInterval: number | null = null;
 	private statusRefreshTimeout: number | null = null;
 	private currentStatuses: Map<string, FileStatus> = new Map();
+	private previousStatuses: Map<string, FileStatus> = new Map();
 	private conflictFiles: Set<string> = new Set();
 	private _hasConflicts = false;
 	private resolveConflictCommand: { id: string } | null = null;
 	private ribbonIconEl: HTMLElement | null = null;
 	private beforeUnloadHandler: (() => void) | null = null;
+	private mutationObserver: MutationObserver | null = null;
 
 	async onload() {
 		await this.loadSettings();
@@ -56,9 +58,13 @@ export default class AutoGitPlugin extends Plugin {
 		});
 
 		this.setupVaultListeners();
-		this.updateStatusBadges();
 		this.setupFileContextMenu();
 
+		// Wait for layout ready before initializing badges
+		this.app.workspace.onLayoutReady(() => {
+			this.updateStatusBadges();
+		});
+
 		// Auto pull on open
 		if (this.settings.autoPullOnOpen && !Platform.isMobileApp) {
 			// Delay to ensure vault is ready
@@ -84,7 +90,8 @@ export default class AutoGitPlugin extends Plugin {
 							if (this.settings.includeFileList) {
 								message += "\n\n" + changedFiles.join("\n");
 							}
-							commitAndPushSync(cwd, this.settings.gitPath, message);
+							// Sync commit + detached push (push runs in background after app closes)
+							commitSyncAndPushDetached(cwd, this.settings.gitPath, message);
 						}
 					}
 				}
@@ -108,6 +115,10 @@ export default class AutoGitPlugin extends Plugin {
 			window.clearTimeout(this.statusRefreshTimeout);
 			this.statusRefreshTimeout = null;
 		}
+		if (this.mutationObserver) {
+			this.mutationObserver.disconnect();
+			this.mutationObserver = null;
+		}
 		if (this.ribbonIconEl) {
 			this.ribbonIconEl.remove();
 			this.ribbonIconEl = null;
@@ -138,8 +149,6 @@ export default class AutoGitPlugin extends Plugin {
 	}
 
 	private setupVaultListeners() {
-		if (!this.settings.autoCommit) return;
-
 		if (Platform.isMobileApp) {
 			new Notice(t().noticeMobileNotSupported);
 			return;
@@ -157,8 +166,13 @@ export default class AutoGitPlugin extends Plugin {
 		if (!(file instanceof TFile)) return;
 		if (this.shouldIgnore(file.path)) return;
 
-		this.scheduleCommit();
+		// Always refresh badges on file change
 		this.scheduleStatusRefresh();
+
+		// Only schedule commit if autoCommit is enabled
+		if (this.settings.autoCommit) {
+			this.scheduleCommit();
+		}
 	}
 
 	private shouldIgnore(path: string): boolean {
@@ -450,6 +464,11 @@ export default class AutoGitPlugin extends Plugin {
 			window.clearTimeout(this.statusRefreshTimeout);
 			this.statusRefreshTimeout = null;
 		}
+		// Disconnect existing observer
+		if (this.mutationObserver) {
+			this.mutationObserver.disconnect();
+			this.mutationObserver = null;
+		}
 
 		if (Platform.isMobileApp || !this.settings.showStatusBadge) {
 			this.clearStatusBadges();
@@ -459,10 +478,59 @@ export default class AutoGitPlugin extends Plugin {
 		// Initial refresh
 		this.refreshStatusBadges();
 
-		// Refresh every 5 seconds
-		this.statusRefreshInterval = window.setInterval(() => {
-			this.refreshStatusBadges();
-		}, 5000);
+		// Setup polling if interval > 0
+		const interval = this.settings.badgeRefreshInterval;
+		if (interval > 0) {
+			this.statusRefreshInterval = window.setInterval(() => {
+				this.refreshStatusBadges();
+			}, interval * 1000);
+		}
+
+		// Setup MutationObserver for virtualized file list
+		this.setupMutationObserver();
+	}
+
+	private setupMutationObserver() {
+		// Find file explorer container
+		const container = document.querySelector(".nav-files-container");
+		if (!container) return;
+
+		this.mutationObserver = new MutationObserver((mutations) => {
+			for (const mutation of mutations) {
+				mutation.addedNodes.forEach((node) => {
+					if (node instanceof HTMLElement) {
+						this.applyBadgesToNewNodes(node);
+					}
+				});
+			}
+		});
+
+		this.mutationObserver.observe(container, {
+			childList: true,
+			subtree: true,
+		});
+	}
+
+	private applyBadgesToNewNodes(node: HTMLElement) {
+		// Check if node itself is a file/folder title
+		const items = node.matches(".nav-file-title, .nav-folder-title")
+			? [node]
+			: Array.from(node.querySelectorAll(".nav-file-title, .nav-folder-title"));
+
+		const allStatuses = this.getMergedStatuses();
+
+		for (const item of items) {
+			const path = item.getAttribute("data-path");
+			if (!path) continue;
+
+			// Skip if already has badge
+			if (item.querySelector(".git-status-badge")) continue;
+
+			const status = allStatuses.get(path);
+			if (status) {
+				this.addBadgeToElement(item, status);
+			}
+		}
 	}
 
 	private scheduleStatusRefresh() {
@@ -488,7 +556,12 @@ export default class AutoGitPlugin extends Plugin {
 
 		getFileStatuses(cwd, this.settings.gitPath).then((statuses) => {
 			this.currentStatuses = statuses;
-			this.updateBadgesInDOM();
+			// Use full update if first time, otherwise use diff
+			if (this.previousStatuses.size === 0) {
+				this.updateBadgesInDOM();
+			} else {
+				this.updateBadgesDiff();
+			}
 		}).catch(() => {
 			// Ignore errors
 		});
@@ -497,6 +570,67 @@ export default class AutoGitPlugin extends Plugin {
 	private clearStatusBadges() {
 		document.querySelectorAll(".git-status-badge").forEach((el) => el.remove());
 		this.currentStatuses.clear();
+		this.previousStatuses.clear();
+	}
+
+	private getMergedStatuses(): Map<string, FileStatus> {
+		const merged = new Map(this.currentStatuses);
+		this.conflictFiles.forEach((file) => {
+			merged.set(file, "U" as FileStatus);
+		});
+
+		// Add folder statuses
+		const folderStatuses = this.calculateFolderStatuses(merged);
+		folderStatuses.forEach((status, path) => {
+			merged.set(path, status);
+		});
+
+		return merged;
+	}
+
+	private updateBadgesDiff() {
+		const newStatuses = this.getMergedStatuses();
+
+		// Find paths to remove (in previous but not in new, or status changed)
+		for (const [path, oldStatus] of this.previousStatuses) {
+			const newStatus = newStatuses.get(path);
+			if (!newStatus || newStatus !== oldStatus) {
+				this.removeBadgeFromPath(path);
+			}
+		}
+
+		// Find paths to add/update (in new but not in previous, or status changed)
+		for (const [path, status] of newStatuses) {
+			const oldStatus = this.previousStatuses.get(path);
+			if (oldStatus !== status) {
+				this.updateBadgeForPath(path, status);
+			}
+		}
+
+		this.previousStatuses = newStatuses;
+	}
+
+	private removeBadgeFromPath(path: string) {
+		const escapedPath = CSS.escape(path);
+		const selector = `.nav-file-title[data-path="${escapedPath}"], .nav-folder-title[data-path="${escapedPath}"]`;
+		const el = document.querySelector(selector);
+		if (el) {
+			const badge = el.querySelector(".git-status-badge");
+			if (badge) badge.remove();
+		}
+	}
+
+	private updateBadgeForPath(path: string, status: FileStatus) {
+		const escapedPath = CSS.escape(path);
+		const selector = `.nav-file-title[data-path="${escapedPath}"], .nav-folder-title[data-path="${escapedPath}"]`;
+		const el = document.querySelector(selector);
+		if (el) {
+			// Remove existing badge if any
+			const existingBadge = el.querySelector(".git-status-badge");
+			if (existingBadge) existingBadge.remove();
+			// Add new badge
+			this.addBadgeToElement(el, status);
+		}
 	}
 
 	private updateBadgesInDOM() {
@@ -533,6 +667,9 @@ export default class AutoGitPlugin extends Plugin {
 				this.addBadgeToElement(item, status);
 			}
 		});
+
+		// Update previous statuses for diff tracking
+		this.previousStatuses = this.getMergedStatuses();
 	}
 
 	private calculateFolderStatuses(statuses: Map<string, FileStatus>): Map<string, FileStatus> {

src/main.ts

@@ -15,6 +15,7 @@ export interface AutoGitSettings {
 	ignoreObsidianDir: boolean;
 	showStatusBadge: boolean;
 	showRibbonButton: boolean;
+	badgeRefreshInterval: number; // 0 = disabled, otherwise seconds
 }
 
 export const DEFAULT_SETTINGS: AutoGitSettings = {
@@ -29,6 +30,7 @@ export const DEFAULT_SETTINGS: AutoGitSettings = {
 	ignoreObsidianDir: true,
 	showStatusBadge: true,
 	showRibbonButton: true,
+	badgeRefreshInterval: 0, // 0 = disabled (event-driven only), otherwise seconds
 };
 
 export class AutoGitSettingTab extends PluginSettingTab {
@@ -164,6 +166,23 @@ export class AutoGitSettingTab extends PluginSettingTab {
 				})
 			);
 
+		new Setting(containerEl)
+			.setName(i18n.badgeRefreshIntervalName)
+			.setDesc(i18n.badgeRefreshIntervalDesc)
+			.addText((text) =>
+				text
+					.setPlaceholder("10")
+					.setValue(String(this.plugin.settings.badgeRefreshInterval))
+					.onChange(async (value) => {
+						const num = parseInt(value);
+						if (!isNaN(num) && num >= 0) {
+							this.plugin.settings.badgeRefreshInterval = num;
+							await this.plugin.saveSettings();
+							this.plugin.updateStatusBadges();
+						}
+					})
+			);
+
 		new Setting(containerEl)
 			.setName(i18n.showRibbonButtonName)
 			.setDesc(i18n.showRibbonButtonDesc)