desktop: further improve window creation time

apps/desktop/src/main.ts

@@ -16,9 +16,8 @@ GNU General Public License for more details.
 You should have received a copy of the GNU General Public License
 along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
-/* global MAC_APP_STORE, RELEASE */
 
-import { app, BrowserWindow, nativeTheme, shell } from "electron";
+import { app, BrowserWindow, nativeTheme, session, shell } from "electron";
 import { isDevelopment } from "./utils";
 import { registerProtocol, PROTOCOL_URL } from "./utils/protocol";
 import { configureAutoUpdater } from "./utils/autoupdater";
@@ -46,8 +45,8 @@ if (process.platform == "win32" && process.env.PORTABLE_EXECUTABLE_DIR) {
   app.setPath("documents", path.join(root, "Documents"));
   app.setPath("userData", path.join(root, "UserData"));
 }
-// only run a single instance
 
+// only run a single instance
 if (!MAC_APP_STORE && !app.requestSingleInstanceLock()) {
   app.exit();
 }
@@ -56,19 +55,22 @@ if (process.platform === "win32") {
   app.setAppUserModelId(app.name);
 }
 
+app.commandLine.appendSwitch("lang", "en-US");
+
 async function createWindow() {
   const cliOptions = await parseArguments();
+  setTheme(getTheme());
 
   const mainWindowState = new WindowState({});
   const mainWindow = new BrowserWindow({
-    show: false,
+    show: !cliOptions.hidden,
     x: mainWindowState.x,
     y: mainWindowState.y,
     width: mainWindowState.width,
     height: mainWindowState.height,
     darkTheme: getTheme() === "dark",
     backgroundColor: getBackgroundColor(),
-
+    opacity: 0,
     autoHideMenuBar: true,
     icon: AssetManager.appIcon({
       size: 512,
@@ -86,34 +88,18 @@ async function createWindow() {
   globalThis.window = mainWindow;
   mainWindowState.manage(mainWindow);
 
-  mainWindow.once("show", async () => {
-    setTheme(getTheme());
-    setupMenu();
-    setupJumplist();
+  if (cliOptions.hidden && !config.desktopSettings.minimizeToSystemTray)
+    mainWindow.minimize();
 
-    if (isDevelopment())
-      mainWindow.webContents.openDevTools({ mode: "right", activate: true });
+  setTimeout(() => {
+    mainWindow.setOpacity(1);
+  }, 70);
 
-    mainWindow.webContents.setWindowOpenHandler((details) => {
-      shell.openExternal(details.url);
-      return { action: "deny" };
-    });
-
-    nativeTheme.on("updated", () => {
-      setupTray();
-      setupJumplist();
-    });
-
-    await AssetManager.loadIcons();
-    if (config.privacyMode) {
-      await api.integration.setPrivacyMode(config.privacyMode);
-    }
-  });
-
-  setupDesktopIntegration(cliOptions.hidden);
+  setupDesktopIntegration();
   createIPCHandler({ router, windows: [mainWindow] });
 
-  mainWindow.webContents.loadURL(`${createURL(cliOptions, "/")}`);
+  await mainWindow.webContents.loadURL(`${createURL(cliOptions, "/")}`);
+
   mainWindow.webContents.session.setSpellCheckerDictionaryDownloadURL(
     "http://dictionaries.notesnook.com/"
   );
@@ -121,9 +107,29 @@ async function createWindow() {
   mainWindow.once("closed", () => {
     globalThis.window = null;
   });
+
+  setupMenu();
+  setupJumplist();
+
+  if (isDevelopment())
+    mainWindow.webContents.openDevTools({ mode: "right", activate: true });
+
+  mainWindow.webContents.setWindowOpenHandler((details) => {
+    shell.openExternal(details.url);
+    return { action: "deny" };
+  });
+
+  nativeTheme.on("updated", () => {
+    setupTray();
+    setupJumplist();
+  });
+
+  await AssetManager.loadIcons();
+  if (config.privacyMode) {
+    await api.integration.setPrivacyMode(config.privacyMode);
+  }
 }
 
-app.commandLine.appendSwitch("lang", "en-US");
 app.once("ready", async () => {
   console.info("App ready. Opening window.");
 
@@ -159,7 +165,7 @@ function createURL(options: CLIOptions, path = "/") {
   return url;
 }
 
-function setupDesktopIntegration(hidden: boolean) {
+function setupDesktopIntegration() {
   const desktopIntegration = config.desktopSettings;
 
   if (
@@ -169,18 +175,6 @@ function setupDesktopIntegration(hidden: boolean) {
     setupTray();
   }
 
-  globalThis.window?.once("ready-to-show", () => {
-    if (!hidden) {
-      globalThis.window?.show();
-      globalThis.window?.focus();
-    }
-
-    if (hidden && !desktopIntegration.minimizeToSystemTray) {
-      globalThis.window?.show();
-      globalThis.window?.minimize();
-    }
-  });
-
   // when close to system tray is enabled, it becomes nigh impossible
   // to "quit" the app. This is necessary in order to fix that.
   if (desktopIntegration.closeToSystemTray) {

apps/desktop/src/utils/asset-manager.ts

@@ -21,8 +21,8 @@ import { NativeImage, nativeImage } from "electron";
 import path from "path";
 import { isDevelopment } from "./index";
 import { parse, ParsedImage } from "icojs";
-import { readFileSync } from "fs";
 import { getSystemTheme } from "./theme";
+import { readFile } from "fs/promises";
 
 type Formats = "ico" | "png" | "icns";
 type IconOptions<TFormat extends Formats> = {
@@ -70,7 +70,7 @@ export class AssetManager {
           "icons",
           `${icon}${prefix}.ico`
         );
-        const icoBuffer = readFileSync(icoPath);
+        const icoBuffer = await readFile(icoPath);
         const images = await parse(icoBuffer, "image/png");
         ALL_ICONS.push({ id: icon, images, prefix });
       }
@@ -80,10 +80,10 @@ export class AssetManager {
   static appIcon(options: IconOptions<Formats>) {
     const { size = 32, format = "png" } = options;
 
-    if (format === "ico") return path.join("assets", "icons", "app.ico");
-    if (format === "icns") return path.join("assets", "icons", "app.icns");
+    if (format === "ico") return "assets\\icons\\app.ico";
+    if (format === "icns") return "assets/icons/app.icns";
 
-    return path.join("assets", "icons", `${size}x${size}.png`);
+    return `assets/icons/${size}x${size}.png`;
   }
 
   static icon<TFormat extends Formats>(

apps/web/index.html

@@ -61,7 +61,7 @@
     <script type="module" src="/src/index.tsx"></script>
     <style>
       html[data-theme="dark"] {
-        --bg: #1b1b1b;
+        --bg: #0f0f0f;
         --fg: #fff;
         --three-bars-bg: #494949;
         --gradient-stop-color: #111111;