Skip to content

Commit 374ec94

Browse files
kuigookuigoo
committed
perf(design-systems): speed up preview loading
1 parent 54154a6 commit 374ec94

24 files changed

Lines changed: 798 additions & 176 deletions

‎apps/daemon/src/design-systems/index.ts‎

Lines changed: 83 additions & 58 deletions
Original file line numberDiff line numberDiff line change
@@ -337,68 +337,93 @@ export async function listDesignSystems(
337337
}
338338
for (const entry of entries) {
339339
if (!entry.isDirectory() && !entry.isSymbolicLink()) continue;
340-
const brandRoot = path.join(root, entry.name);
341-
const manifest = await readProjectManifest(brandRoot, entry.name);
342-
const designPath = path.join(brandRoot, manifest?.files.design ?? 'DESIGN.md');
343-
try {
344-
const stats = await stat(designPath);
345-
if (!stats.isFile()) continue;
346-
const raw = await readFile(designPath, 'utf8');
347-
const metadata = await readUserMetadata(root, entry.name);
348-
if (!designSystemVisibleFromWorkspace(metadata.workspaceId, options.workspaceId)) continue;
349-
const { data: frontmatter, body } = parseFrontmatter(raw);
350-
const titleMatch = /^#\s+(.+?)\s*$/m.exec(body);
351-
const markdownTitle =
352-
titleMatch?.[1] !== undefined ? cleanTitle(titleMatch[1]) : '';
353-
const fallbackTitle = markdownTitle || stringField(frontmatter, 'name') || entry.name;
354-
const title = cleanTitle(
355-
metadata.title
356-
?? manifest?.name
357-
?? fallbackTitle,
358-
);
359-
const frontmatterCategory = stringField(frontmatter, 'category');
360-
const category = (
361-
metadata.category
362-
?? manifest?.category
363-
?? extractCategory(body)
364-
?? frontmatterCategory
365-
) || 'Uncategorized';
366-
const markdownSummary = summarize(body);
367-
const markdownSwatches = extractSwatches(body);
368-
const frontmatterSwatchRow = swatchesFromFrontmatter(frontmatter);
369-
const swatches = pickFinalSwatchRow(frontmatterSwatchRow, markdownSwatches);
370-
out.push({
371-
id: `${options.idPrefix ?? ''}${entry.name}`,
372-
title,
373-
category,
374-
summary:
375-
(manifest?.description?.trim() || markdownSummary)
376-
|| stringField(frontmatter, 'description')
377-
|| '',
378-
swatches,
379-
surface:
380-
metadata.surface
381-
?? extractSurface(body)
382-
?? frontmatterSurface(frontmatter)
383-
?? 'web',
384-
body: raw,
385-
source: options.source ?? 'built-in',
386-
status: metadata.status ?? options.defaultStatus ?? 'published',
387-
isEditable: options.isEditable ?? false,
388-
...(metadata.createdAt ? { createdAt: metadata.createdAt } : {}),
389-
...(metadata.updatedAt ? { updatedAt: metadata.updatedAt } : {}),
390-
...(metadata.provenance ? { provenance: metadata.provenance } : {}),
391-
...(metadata.projectId ? { projectId: metadata.projectId } : {}),
392-
...(metadata.teamSynced ? { teamSynced: true } : {}),
393-
...(metadata.workspaceId ? { workspaceId: metadata.workspaceId } : {}),
394-
});
395-
} catch {
396-
// Skip.
397-
}
340+
const summary = await readDesignSystemSummaryFromDirectory(root, entry.name, options);
341+
if (summary) out.push(summary);
398342
}
399343
return out;
400344
}
401345

346+
export async function readDesignSystemSummary(
347+
root: string,
348+
id: string,
349+
options: DesignSystemListOptions = {},
350+
): Promise<DesignSystemSummary | null> {
351+
const dirId = stripPrefixAndValidateId(id, options.idPrefix);
352+
if (!dirId) return null;
353+
try {
354+
const entries = await readdir(root);
355+
if (!entries.includes(dirId)) return null;
356+
} catch {
357+
return null;
358+
}
359+
return readDesignSystemSummaryFromDirectory(root, dirId, options);
360+
}
361+
362+
async function readDesignSystemSummaryFromDirectory(
363+
root: string,
364+
dirId: string,
365+
options: DesignSystemListOptions,
366+
): Promise<DesignSystemSummary | null> {
367+
const brandRoot = path.join(root, dirId);
368+
const manifest = await readProjectManifest(brandRoot, dirId);
369+
const designPath = path.join(brandRoot, manifest?.files.design ?? 'DESIGN.md');
370+
try {
371+
const stats = await stat(designPath);
372+
if (!stats.isFile()) return null;
373+
const raw = await readFile(designPath, 'utf8');
374+
const metadata = await readUserMetadata(root, dirId);
375+
if (!designSystemVisibleFromWorkspace(metadata.workspaceId, options.workspaceId)) return null;
376+
const { data: frontmatter, body } = parseFrontmatter(raw);
377+
const titleMatch = /^#\s+(.+?)\s*$/m.exec(body);
378+
const markdownTitle =
379+
titleMatch?.[1] !== undefined ? cleanTitle(titleMatch[1]) : '';
380+
const fallbackTitle = markdownTitle || stringField(frontmatter, 'name') || dirId;
381+
const title = cleanTitle(
382+
metadata.title
383+
?? manifest?.name
384+
?? fallbackTitle,
385+
);
386+
const frontmatterCategory = stringField(frontmatter, 'category');
387+
const category = (
388+
metadata.category
389+
?? manifest?.category
390+
?? extractCategory(body)
391+
?? frontmatterCategory
392+
) || 'Uncategorized';
393+
const markdownSummary = summarize(body);
394+
const markdownSwatches = extractSwatches(body);
395+
const frontmatterSwatchRow = swatchesFromFrontmatter(frontmatter);
396+
const swatches = pickFinalSwatchRow(frontmatterSwatchRow, markdownSwatches);
397+
return {
398+
id: `${options.idPrefix ?? ''}${dirId}`,
399+
title,
400+
category,
401+
summary:
402+
(manifest?.description?.trim() || markdownSummary)
403+
|| stringField(frontmatter, 'description')
404+
|| '',
405+
swatches,
406+
surface:
407+
metadata.surface
408+
?? extractSurface(body)
409+
?? frontmatterSurface(frontmatter)
410+
?? 'web',
411+
body: raw,
412+
source: options.source ?? 'built-in',
413+
status: metadata.status ?? options.defaultStatus ?? 'published',
414+
isEditable: options.isEditable ?? false,
415+
...(metadata.createdAt ? { createdAt: metadata.createdAt } : {}),
416+
...(metadata.updatedAt ? { updatedAt: metadata.updatedAt } : {}),
417+
...(metadata.provenance ? { provenance: metadata.provenance } : {}),
418+
...(metadata.projectId ? { projectId: metadata.projectId } : {}),
419+
...(metadata.teamSynced ? { teamSynced: true } : {}),
420+
...(metadata.workspaceId ? { workspaceId: metadata.workspaceId } : {}),
421+
};
422+
} catch {
423+
return null;
424+
}
425+
}
426+
402427
/**
403428
* Whether a design system claimed by `owner` should be listed while `scope` is
404429
* the active workspace.

‎apps/daemon/src/design-systems/server-services.ts‎

Lines changed: 34 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -73,6 +73,17 @@ type DesignSystemWorkspaceOptions = {
7373
exactTeam?: boolean;
7474
};
7575

76+
function canonicalizeBuiltInDesignSystem(
77+
summary: DesignSystemSummary,
78+
): DesignSystemSummary {
79+
return {
80+
...summary,
81+
source: 'built-in',
82+
isEditable: false,
83+
status: 'published',
84+
};
85+
}
86+
7687
export type DesignSystemAssetSyncOutcome =
7788
| { ok: true; synced: string[] }
7889
| { ok: false; reason: 'not-found' | 'no-workspace-project' };
@@ -180,6 +191,7 @@ export function createDesignSystemServerServices({
180191
};
181192
designSystems: {
182193
listDesignSystems: (root: string, options?: DesignSystemListOptions) => Promise<DesignSystemSummary[]>;
194+
readDesignSystemSummary: (root: string, id: string, options?: DesignSystemListOptions) => Promise<DesignSystemSummary | null>;
183195
readDesignSystem: (root: string, id: string, options?: Pick<DesignSystemListOptions, 'idPrefix' | 'workspaceId'>) => Promise<string | null | undefined>;
184196
readDesignSystemPackageInfo: (root: string, id: string, options?: Pick<DesignSystemListOptions, 'idPrefix' | 'workspaceId'>) => Promise<unknown>;
185197
readDesignSystemStaticFile: (root: string, id: string, filePath: string, options?: Pick<DesignSystemListOptions, 'idPrefix' | 'workspaceId'>) => Promise<DesignSystemStaticFile | null | undefined>;
@@ -363,12 +375,8 @@ export function createDesignSystemServerServices({
363375
exactTeam?: boolean;
364376
exactPersonal?: boolean;
365377
} = {}) {
366-
const builtIn = (await designSystems.listDesignSystems(paths.DESIGN_SYSTEMS_DIR)).map((s) => ({
367-
...s,
368-
source: 'built-in',
369-
isEditable: false,
370-
status: 'published',
371-
}));
378+
const builtIn = (await designSystems.listDesignSystems(paths.DESIGN_SYSTEMS_DIR))
379+
.map(canonicalizeBuiltInDesignSystem);
372380
let installed: DesignSystemSummary[] = [];
373381
try {
374382
installed = await designSystems.listDesignSystems(paths.USER_DESIGN_SYSTEMS_DIR, {
@@ -458,6 +466,25 @@ export function createDesignSystemServerServices({
458466
});
459467
}
460468

469+
async function readAvailableDesignSystemSummary(
470+
id: string,
471+
options: {
472+
workspaceId?: string | null;
473+
workspaceMemberId?: string | null;
474+
exactTeam?: boolean;
475+
exactPersonal?: boolean;
476+
} = {},
477+
): Promise<DesignSystemSummary | null> {
478+
if (!id.startsWith('user:')) {
479+
const summary = await designSystems.readDesignSystemSummary(paths.DESIGN_SYSTEMS_DIR, id);
480+
return summary ? canonicalizeBuiltInDesignSystem(summary) : null;
481+
}
482+
// User and Team systems still go through the catalog's persisted binding
483+
// filters. The direct path is intentionally limited to public bundled
484+
// presets, whose id maps to one immutable repository directory.
485+
return (await listAllDesignSystems(options)).find((system) => system.id === id) ?? null;
486+
}
487+
461488
async function readAvailableDesignSystem(
462489
id: string,
463490
options: {
@@ -957,6 +984,7 @@ export function createDesignSystemServerServices({
957984
listAllSkillLikeEntries,
958985
listAllSkills,
959986
readAvailableDesignSystem,
987+
readAvailableDesignSystemSummary,
960988
readAvailableDesignSystemPackageInfo,
961989
readAvailableDesignSystemStaticFile,
962990
readDesignSystemWorkspaceTextFile,

‎apps/daemon/src/routes/design-systems.ts‎

Lines changed: 26 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -109,6 +109,10 @@ export interface RegisterDesignSystemRoutesDeps extends RouteDeps<'db' | 'paths'
109109
id: string,
110110
options?: { workspaceId?: string | null; workspaceMemberId?: string | null; exactTeam?: boolean },
111111
) => Promise<string | null>;
112+
readAvailableDesignSystemSummary: (
113+
id: string,
114+
options?: { workspaceId?: string | null; workspaceMemberId?: string | null; exactTeam?: boolean },
115+
) => Promise<AvailableDesignSystemSummary | null>;
112116
readAvailableDesignSystemPackageInfo: (
113117
id: string,
114118
options?: { workspaceId?: string | null; workspaceMemberId?: string | null; exactTeam?: boolean },
@@ -216,6 +220,7 @@ export function registerDesignSystemRoutes(
216220
listUserDesignSystemRevisions,
217221
prepareDesignTokenContractRebuild,
218222
readAvailableDesignSystem,
223+
readAvailableDesignSystemSummary,
219224
readAvailableDesignSystemPackageInfo,
220225
readAvailableDesignSystemStaticFile,
221226
readDesignSystemWorkspaceTextFile,
@@ -233,6 +238,17 @@ export function registerDesignSystemRoutes(
233238
{ workspaceId: string; workspaceMemberId: string } | null
234239
>();
235240

241+
const resolveAvailableDesignSystemSummary = async (
242+
id: string,
243+
options: {
244+
workspaceId?: string | null;
245+
workspaceMemberId?: string | null;
246+
exactTeam?: boolean;
247+
} = {},
248+
): Promise<AvailableDesignSystemSummary | undefined> => {
249+
return (await readAvailableDesignSystemSummary(id, options)) ?? undefined;
250+
};
251+
236252
const getBoundDesignSystem = (
237253
dbHandle: unknown,
238254
workspaceId: string,
@@ -333,11 +349,13 @@ export function registerDesignSystemRoutes(
333349
binding = personalBinding;
334350
}
335351
}
336-
const isPublicBuiltIn = resolution.context && !binding
337-
? (await listAllDesignSystems({
352+
const publicSummary = resolution.context && !binding
353+
? await resolveAvailableDesignSystemSummary(id, {
338354
workspaceId: resolution.context.workspaceId,
339-
})).some((system) => system.id === id && system.source === 'built-in')
340-
: false;
355+
workspaceMemberId: resolution.context.workspaceMemberId,
356+
})
357+
: undefined;
358+
const isPublicBuiltIn = publicSummary?.source === 'built-in';
341359
// Explicit Workspace requests never inherit ownerless legacy resources.
342360
// A Personal design system is private to its exact persisted creator even
343361
// when the caller is an owner/admin in the same Workspace. Team resources
@@ -693,21 +711,16 @@ export function registerDesignSystemRoutes(
693711
const workspaceId = headerValue(req, 'x-od-workspace-id');
694712
const workspaceMemberId = headerValue(req, 'x-od-workspace-member-id');
695713
const storage = resolveDesignSystemStorage(req, req.params.id);
696-
const systems = await listAllDesignSystems({
714+
const summary = await resolveAvailableDesignSystemSummary(req.params.id, {
697715
workspaceId,
698716
workspaceMemberId,
699717
exactTeam: storage.exactTeam,
700718
});
701-
const summary = systems.find((s) => s.id === req.params.id);
702-
const projectBody = await readDesignSystemWorkspaceTextFile(db, summary, 'DESIGN.md');
703-
const body = projectBody ?? await readAvailableDesignSystem(req.params.id, {
704-
workspaceId,
705-
workspaceMemberId,
706-
exactTeam: storage.exactTeam,
707-
});
708-
if (body === null || !summary) {
719+
if (!summary) {
709720
return res.status(404).json({ error: 'design system not found' });
710721
}
722+
const projectBody = await readDesignSystemWorkspaceTextFile(db, summary, 'DESIGN.md');
723+
const body = projectBody ?? summary.body;
711724
const packageInfo = await readAvailableDesignSystemPackageInfo(req.params.id, {
712725
workspaceId,
713726
workspaceMemberId,

‎apps/daemon/src/server.ts‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -319,6 +319,7 @@ import {
319319
listUserDesignSystemFiles,
320320
listUserDesignSystemRevisions,
321321
readDesignSystem,
322+
readDesignSystemSummary,
322323
readDesignSystemPackageInfo,
323324
readDesignSystemStaticFile,
324325
readUserDesignSystemFile,
@@ -2708,6 +2709,7 @@ export async function startServer({
27082709
designSystems: {
27092710
listDesignSystems,
27102711
readDesignSystem,
2712+
readDesignSystemSummary,
27112713
readDesignSystemPackageInfo,
27122714
readDesignSystemStaticFile,
27132715
listUserDesignSystemFiles,
@@ -2763,6 +2765,7 @@ export async function startServer({
27632765
listAllSkillLikeEntries,
27642766
listAllSkills,
27652767
readAvailableDesignSystem,
2768+
readAvailableDesignSystemSummary,
27662769
readAvailableDesignSystemPackageInfo,
27672770
readAvailableDesignSystemStaticFile,
27682771
readDesignSystemWorkspaceTextFile,
@@ -8118,6 +8121,7 @@ export async function startServer({
81188121
listUserDesignSystemRevisions,
81198122
prepareDesignTokenContractRebuild,
81208123
readAvailableDesignSystem,
8124+
readAvailableDesignSystemSummary,
81218125
readAvailableDesignSystemPackageInfo,
81228126
readAvailableDesignSystemStaticFile,
81238127
readDesignSystemWorkspaceTextFile,

‎apps/daemon/tests/design-systems/design-system-family-workspace-authority.test.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -211,6 +211,7 @@ async function startAuthorityServer(options: {
211211
decision: { available: false },
212212
}) as never,
213213
readAvailableDesignSystem: async () => summary.body,
214+
readAvailableDesignSystemSummary: async () => summary,
214215
readAvailableDesignSystemPackageInfo: async () => null,
215216
readAvailableDesignSystemStaticFile: calls.static,
216217
readDesignSystemWorkspaceTextFile: async () => null,

0 commit comments

Comments
 (0)