From 0998bc355e6425e6b2bdf3d2da7124aa7b63b2a2 Mon Sep 17 00:00:00 2001
From: Jacky Zhao <j.zhao2k19@gmail.com>
Date: Thu, 17 Aug 2023 08:58:11 +0000
Subject: [PATCH] fix rebuild debouncing

---
 quartz/build.ts |  109 +++++++++++++++++++++++++++---------------------------
 1 files changed, 55 insertions(+), 54 deletions(-)

diff --git a/quartz/build.ts b/quartz/build.ts
index a293277..b5b1f9e 100644
--- a/quartz/build.ts
+++ b/quartz/build.ts
@@ -1,30 +1,29 @@
-import "source-map-support/register.js"
+import sourceMapSupport from "source-map-support"
+sourceMapSupport.install(options)
 import path from "path"
-import { PerfTimer } from "./perf"
+import { PerfTimer } from "./util/perf"
 import { rimraf } from "rimraf"
 import { isGitIgnored } from "globby"
 import chalk from "chalk"
-import http from "http"
-import serveHandler from "serve-handler"
 import { parseMarkdown } from "./processors/parse"
 import { filterContent } from "./processors/filter"
 import { emitContent } from "./processors/emit"
 import cfg from "../quartz.config"
-import { FilePath, joinSegments, slugifyFilePath } from "./path"
+import { FilePath, joinSegments, slugifyFilePath } from "./util/path"
 import chokidar from "chokidar"
 import { ProcessedContent } from "./plugins/vfile"
-import WebSocket, { WebSocketServer } from "ws"
-import { Argv, BuildCtx } from "./ctx"
-import { glob, toPosixPath } from "./glob"
+import { Argv, BuildCtx } from "./util/ctx"
+import { glob, toPosixPath } from "./util/glob"
+import { trace } from "./util/trace"
+import { options } from "./util/sourcemap"
 
-async function buildQuartz(argv: Argv, version: string) {
+async function buildQuartz(argv: Argv, clientRefresh: () => void) {
   const ctx: BuildCtx = {
     argv,
     cfg,
     allSlugs: [],
   }
 
-  console.log(chalk.bgGreen.black(`\n Quartz v${version} \n`))
   const perf = new PerfTimer()
   const output = argv.output
 
@@ -43,13 +42,14 @@
   console.log(`Cleaned output directory \`${output}\` in ${perf.timeSince("clean")}`)
 
   perf.addEvent("glob")
-  const fps = await glob("**/*.md", argv.directory, cfg.configuration.ignorePatterns)
+  const allFiles = await glob("**/*.*", argv.directory, cfg.configuration.ignorePatterns)
+  const fps = allFiles.filter((fp) => fp.endsWith(".md"))
   console.log(
     `Found ${fps.length} input files from \`${argv.directory}\` in ${perf.timeSince("glob")}`,
   )
 
   const filePaths = fps.map((fp) => joinSegments(argv.directory, fp) as FilePath)
-  ctx.allSlugs = fps.map((fp) => slugifyFilePath(fp as FilePath))
+  ctx.allSlugs = allFiles.map((fp) => slugifyFilePath(fp as FilePath))
 
   const parsedFiles = await parseMarkdown(ctx, filePaths)
   const filteredContent = filterContent(ctx, parsedFiles)
@@ -57,15 +57,17 @@
   console.log(chalk.green(`Done processing ${fps.length} files in ${perf.timeSince()}`))
 
   if (argv.serve) {
-    await startServing(ctx, parsedFiles)
+    return startServing(ctx, parsedFiles, clientRefresh)
   }
 }
 
-async function startServing(ctx: BuildCtx, initialContent: ProcessedContent[]) {
+// setup watcher for rebuilds
+async function startServing(
+  ctx: BuildCtx,
+  initialContent: ProcessedContent[],
+  clientRefresh: () => void,
+) {
   const { argv } = ctx
-  const wss = new WebSocketServer({ port: 3001 })
-  const connections: WebSocket[] = []
-  wss.on("connection", (ws) => connections.push(ws))
 
   const ignored = await isGitIgnored()
   const contentMap = new Map<FilePath, ProcessedContent>()
@@ -74,34 +76,51 @@
     contentMap.set(vfile.data.filePath!, content)
   }
 
-  let timeoutId: ReturnType<typeof setTimeout> | null = null
+  const initialSlugs = ctx.allSlugs
+  let timeoutIds: Set<ReturnType<typeof setTimeout>> = new Set()
   let toRebuild: Set<FilePath> = new Set()
   let toRemove: Set<FilePath> = new Set()
+  let trackedAssets: Set<FilePath> = new Set()
   async function rebuild(fp: string, action: "add" | "change" | "delete") {
+    // don't do anything for gitignored files
+    if (ignored(fp)) {
+      return
+    }
+
+    // dont bother rebuilding for non-content files, just track and refresh
     fp = toPosixPath(fp)
-    if (!ignored(fp)) {
-      const filePath = joinSegments(argv.directory, fp) as FilePath
+    const filePath = joinSegments(argv.directory, fp) as FilePath
+    if (path.extname(fp) !== ".md") {
       if (action === "add" || action === "change") {
-        toRebuild.add(filePath)
+        trackedAssets.add(filePath)
       } else if (action === "delete") {
-        toRemove.add(filePath)
+        trackedAssets.delete(filePath)
       }
+      clientRefresh()
+      return
+    }
 
-      if (timeoutId) {
-        clearTimeout(timeoutId)
-      }
+    if (action === "add" || action === "change") {
+      toRebuild.add(filePath)
+    } else if (action === "delete") {
+      toRemove.add(filePath)
+    }
 
-      // debounce rebuilds every 250ms
-      timeoutId = setTimeout(async () => {
+    timeoutIds.forEach((id) => clearTimeout(id))
+
+    // debounce rebuilds every 250ms
+    timeoutIds.add(
+      setTimeout(async () => {
         const perf = new PerfTimer()
         console.log(chalk.yellow("Detected change, rebuilding..."))
         try {
           const filesToRebuild = [...toRebuild].filter((fp) => !toRemove.has(fp))
 
-          ctx.allSlugs = [...new Set([...contentMap.keys(), ...toRebuild])]
+          const trackedSlugs = [...new Set([...contentMap.keys(), ...toRebuild, ...trackedAssets])]
             .filter((fp) => !toRemove.has(fp))
             .map((fp) => slugifyFilePath(path.posix.relative(argv.directory, fp) as FilePath))
 
+          ctx.allSlugs = [...new Set([...initialSlugs, ...trackedSlugs])]
           const parsedContent = await parseMarkdown(ctx, filesToRebuild)
           for (const content of parsedContent) {
             const [_tree, vfile] = content
@@ -120,11 +139,12 @@
         } catch {
           console.log(chalk.yellow(`Rebuild failed. Waiting on a change to fix the error...`))
         }
-        connections.forEach((conn) => conn.send("rebuild"))
+
+        clientRefresh()
         toRebuild.clear()
         toRemove.clear()
-      }, 250)
-    }
+      }, 250),
+    )
   }
 
   const watcher = chokidar.watch(".", {
@@ -137,31 +157,12 @@
     .on("add", (fp) => rebuild(fp, "add"))
     .on("change", (fp) => rebuild(fp, "change"))
     .on("unlink", (fp) => rebuild(fp, "delete"))
-
-  const server = http.createServer(async (req, res) => {
-    await serveHandler(req, res, {
-      public: argv.output,
-      directoryListing: false,
-    })
-    const status = res.statusCode
-    const statusString =
-      status >= 200 && status < 300
-        ? chalk.green(`[${status}]`)
-        : status >= 300 && status < 400
-        ? chalk.yellow(`[${status}]`)
-        : chalk.red(`[${status}]`)
-    console.log(statusString + chalk.grey(` ${req.url}`))
-  })
-  server.listen(argv.port)
-  console.log(chalk.cyan(`Started a Quartz server listening at http://localhost:${argv.port}`))
-  console.log("hint: exit with ctrl+c")
 }
 
-export default async (argv: Argv, version: string) => {
+export default async (argv: Argv, clientRefresh: () => void) => {
   try {
-    await buildQuartz(argv, version)
-  } catch {
-    console.log(chalk.red("\nExiting Quartz due to a fatal error"))
-    process.exit(1)
+    return await buildQuartz(argv, clientRefresh)
+  } catch (err) {
+    trace("\nExiting Quartz due to a fatal error", err as Error)
   }
 }

--
Gitblit v1.10.0