fix(infra): memory leak (#9013)

This commit is contained in:
EYHN
2024-12-16 16:55:49 +00:00
parent 55f1cc4b1e
commit b36b398957
30 changed files with 399 additions and 135 deletions

View File

@@ -194,6 +194,7 @@ export async function markDownToDoc(
const collection = new DocCollection({
schema,
});
collection.awarenessStore.awareness.destroy();
collection.meta.initialize();
const middlewares = [defaultImageProxyMiddleware];
if (additionalMiddlewares) {

View File

@@ -54,6 +54,8 @@ export class AISlidesRenderer extends WithDisposable(LitElement) {
private _doc!: Doc;
private _docCollection: DocCollection | null = null;
@query('editor-host')
private accessor _editorHost!: EditorHost;
@@ -233,6 +235,12 @@ export class AISlidesRenderer extends WithDisposable(LitElement) {
doc.resetHistory();
this._doc = doc;
this._docCollection = collection;
}
override disconnectedCallback(): void {
this._docCollection?.dispose();
super.disconnectedCallback();
}
}

View File

@@ -12,9 +12,8 @@ import {
import { DisposableGroup } from '@blocksuite/affine/global/utils';
import type { AffineEditorContainer } from '@blocksuite/affine/presets';
import type { Doc } from '@blocksuite/affine/store';
import { use } from 'foxact/use';
import type { CSSProperties } from 'react';
import { Suspense, useEffect } from 'react';
import { useEffect, useState } from 'react';
import type { DefaultOpenProperty } from '../../doc-properties';
import { BlocksuiteEditorContainer } from './blocksuite-editor-container';
@@ -31,24 +30,6 @@ export type EditorProps = {
className?: string;
};
function usePageRoot(page: Doc) {
if (!page.root) {
use(
new Promise<void>((resolve, reject) => {
const disposable = page.slots.rootAdded.once(() => {
resolve();
});
window.setTimeout(() => {
disposable.dispose();
reject(new NoPageRootError(page));
}, 20 * 1000);
})
);
}
return page.root;
}
const BlockSuiteEditorImpl = ({
mode,
page,
@@ -58,8 +39,6 @@ const BlockSuiteEditorImpl = ({
onEditorReady,
defaultOpenProperty,
}: EditorProps) => {
usePageRoot(page);
useEffect(() => {
const disposable = page.slots.blockUpdated.once(() => {
page.collection.setDocMeta(page.id, {
@@ -142,9 +121,33 @@ const BlockSuiteEditorImpl = ({
};
export const BlockSuiteEditor = (props: EditorProps) => {
return (
<Suspense fallback={<EditorLoading />}>
<BlockSuiteEditorImpl key={props.page.id} {...props} />
</Suspense>
const [isLoading, setIsLoading] = useState(true);
const [error, setError] = useState<Error | null>(null);
useEffect(() => {
if (props.page.root) {
setIsLoading(false);
return;
}
const disposable = props.page.slots.rootAdded.once(() => {
setIsLoading(false);
});
window.setTimeout(() => {
disposable.dispose();
setError(new NoPageRootError(props.page));
}, 20 * 1000);
return () => {
disposable.dispose();
};
}, [props.page]);
if (error) {
throw error;
}
return isLoading ? (
<EditorLoading />
) : (
<BlockSuiteEditorImpl key={props.page.id} {...props} />
);
};

View File

@@ -1,32 +1,31 @@
import type { DocCollection } from '@blocksuite/affine/store';
import { useAtomValue } from 'jotai';
import { type ReactNode, Suspense } from 'react';
import { useBlockSuitePagePreview } from './use-block-suite-page-preview';
import { useDocCollectionPage } from './use-block-suite-workspace-page';
import { DocsSearchService } from '@affine/core/modules/docs-search';
import { LiveData, useLiveData, useService } from '@toeverything/infra';
import { type ReactNode, useMemo } from 'react';
interface PagePreviewProps {
docCollection: DocCollection;
pageId: string;
emptyFallback?: ReactNode;
fallback?: ReactNode;
}
const PagePreviewInner = ({
docCollection: workspace,
pageId,
emptyFallback,
fallback,
}: PagePreviewProps) => {
const page = useDocCollectionPage(workspace, pageId);
const previewAtom = useBlockSuitePagePreview(page);
const preview = useAtomValue(previewAtom);
const res = preview ? preview : null;
return res || emptyFallback;
const docSummary = useService(DocsSearchService);
const summary = useLiveData(
useMemo(
() => LiveData.from(docSummary.watchDocSummary(pageId), null),
[docSummary, pageId]
)
);
const res =
summary === null ? fallback : summary === '' ? emptyFallback : summary;
return res;
};
export const PagePreview = (props: PagePreviewProps) => {
return (
<Suspense>
<PagePreviewInner {...props} />
</Suspense>
);
return <PagePreviewInner {...props} />;
};

View File

@@ -317,9 +317,7 @@ function pageMetaToListItemProp(
pageId: item.id,
pageIds,
title: <PageTitle id={item.id} />,
preview: (
<PagePreview docCollection={props.docCollection} pageId={item.id} />
),
preview: <PagePreview pageId={item.id} />,
createDate: new Date(item.createDate),
updatedDate: item.updatedDate ? new Date(item.updatedDate) : undefined,
to: props.rowAsLink && !props.selectable ? `/${item.id}` : undefined,

View File

@@ -1,4 +1,4 @@
import { IconButton } from '@affine/component';
import { IconButton, observeIntersection, Skeleton } from '@affine/component';
import { useCatchEventCallback } from '@affine/core/components/hooks/use-catch-event-hook';
import { PagePreview } from '@affine/core/components/page-list/page-content-preview';
import { IsFavoriteIcon } from '@affine/core/components/pure/icons';
@@ -10,9 +10,16 @@ import {
} from '@affine/core/modules/workbench';
import { useI18n } from '@affine/i18n';
import type { DocMeta } from '@blocksuite/affine/store';
import { useLiveData, useService, WorkspaceService } from '@toeverything/infra';
import { useLiveData, useService } from '@toeverything/infra';
import clsx from 'clsx';
import { forwardRef, type ReactNode, useMemo } from 'react';
import {
forwardRef,
type ReactNode,
useEffect,
useMemo,
useRef,
useState,
} from 'react';
import * as styles from './styles.css';
import { DocCardTags } from './tag';
@@ -38,11 +45,11 @@ export interface DocCardProps extends Omit<WorkbenchLinkProps, 'to'> {
export const DocCard = forwardRef<HTMLAnchorElement, DocCardProps>(
function DocCard(
{ showTags = true, meta, className, autoHeightById, ...attrs },
ref
outerRef
) {
const containerRef = useRef<HTMLAnchorElement | null>(null);
const t = useI18n();
const favAdapter = useService(CompatibleFavoriteItemsAdapter);
const workspace = useService(WorkspaceService).workspace;
const docDisplayService = useService(DocDisplayMetaService);
const titleInfo = useLiveData(docDisplayService.title$(meta.id));
const title =
@@ -64,13 +71,35 @@ export const DocCard = forwardRef<HTMLAnchorElement, DocCardProps>(
return { height: `${rows * 18}px` };
}, [autoHeightById, meta.id]);
const [visible, setVisible] = useState(false);
useEffect(() => {
if (!containerRef.current) return;
const dispose = observeIntersection(containerRef.current, entry => {
setVisible(entry.isIntersecting);
});
return () => {
dispose();
};
}, []);
return (
<WorkbenchLink
to={`/${meta.id}`}
ref={ref}
ref={ref => {
containerRef.current = ref;
if (typeof outerRef === 'function') {
outerRef(ref);
} else if (outerRef) {
outerRef.current = ref;
}
}}
className={clsx(styles.card, className)}
data-testid="doc-card"
data-doc-id={meta.id}
data-visible={visible}
{...attrs}
>
<header className={styles.head} data-testid="doc-card-header">
@@ -83,11 +112,18 @@ export const DocCard = forwardRef<HTMLAnchorElement, DocCardProps>(
/>
</header>
<main className={styles.content} style={contentStyle}>
<PagePreview
docCollection={workspace.docCollection}
pageId={meta.id}
emptyFallback={<div className={styles.contentEmpty}>Empty</div>}
/>
{visible && (
<PagePreview
fallback={
<>
<Skeleton />
<Skeleton width={'60%'} />
</>
}
pageId={meta.id}
emptyFallback={<div className={styles.contentEmpty}>Empty</div>}
/>
)}
</main>
{showTags ? <DocCardTags docId={meta.id} rows={2} /> : null}
</WorkbenchLink>

View File

@@ -36,7 +36,7 @@ export class DocsIndexer extends Entity {
/**
* increase this number to re-index all docs
*/
static INDEXER_VERSION = 10;
static INDEXER_VERSION = 11;
private readonly jobQueue: JobQueue<IndexerJobPayload> =
new IndexedDBJobQueue<IndexerJobPayload>(
@@ -85,24 +85,26 @@ export class DocsIndexer extends Entity {
}
setupListener() {
this.workspaceEngine.doc.storage.eventBus.on(event => {
if (WorkspaceDBService.isDBDocId(event.docId)) {
// skip db doc
return;
}
if (event.clientId === this.workspaceEngine.doc.clientId) {
this.jobQueue
.enqueue([
{
batchKey: event.docId,
payload: { storageDocId: event.docId },
},
])
.catch(err => {
console.error('Error enqueueing job', err);
});
}
});
this.disposables.push(
this.workspaceEngine.doc.storage.eventBus.on(event => {
if (WorkspaceDBService.isDBDocId(event.docId)) {
// skip db doc
return;
}
if (event.clientId === this.workspaceEngine.doc.clientId) {
this.jobQueue
.enqueue([
{
batchKey: event.docId,
payload: { storageDocId: event.docId },
},
])
.catch(err => {
console.error('Error enqueueing job', err);
});
}
})
);
}
async execJob(jobs: Job<IndexerJobPayload>[], signal: AbortSignal) {
@@ -298,6 +300,8 @@ export class DocsIndexer extends Entity {
}
override dispose(): void {
super.dispose();
this.runner.stop();
this.worker?.dispose();
}
}

View File

@@ -1,6 +1,7 @@
import { defineSchema } from '@toeverything/infra';
export const docIndexSchema = defineSchema({
docId: 'String',
title: 'FullText',
// summary of the doc, used for preview
summary: { type: 'String', index: false },

View File

@@ -632,10 +632,31 @@ export class DocsSearchService extends Service {
);
}
async getDocTitle(docId: string) {
const doc = await this.indexer.docIndex.get(docId);
const title = doc?.get('title');
return typeof title === 'string' ? title : title?.[0];
watchDocSummary(docId: string) {
return this.indexer.docIndex
.search$(
{
type: 'match',
field: 'docId',
match: docId,
},
{
fields: ['summary'],
pagination: {
limit: 1,
},
}
)
.pipe(
map(({ nodes }) => {
const node = nodes.at(0);
return (
(typeof node?.fields.summary === 'string'
? node?.fields.summary
: node?.fields.summary[0]) ?? null
);
})
);
}
override dispose(): void {

View File

@@ -105,6 +105,11 @@ const bookmarkFlavours = new Set([
'affine:embed-loom',
]);
const markdownPreviewDocCollection = new DocCollection({
id: 'indexer',
schema: blocksuiteSchema,
});
function generateMarkdownPreviewBuilder(
yRootDoc: YDoc,
workspaceId: string,
@@ -164,10 +169,7 @@ function generateMarkdownPreviewBuilder(
const markdownAdapter = new MarkdownAdapter(
new Job({
collection: new DocCollection({
id: 'indexer',
schema: blocksuiteSchema,
}),
collection: markdownPreviewDocCollection,
middlewares: [docLinkBaseURLMiddleware, titleMiddleware],
})
);
@@ -875,6 +877,7 @@ async function crawlingDocData({
{
id: docId,
doc: Document.from<DocIndexSchema>(docId, {
docId,
title: docTitle,
summary,
}),

View File

@@ -95,8 +95,8 @@ export async function createWorker(abort: AbortSignal) {
});
},
dispose: () => {
worker.terminate();
terminateAbort.abort(MANUALLY_STOP);
worker.terminate();
},
};
}

View File

@@ -159,4 +159,8 @@ export class WorkspacePermission extends Entity {
permission
);
}
override dispose(): void {
this.revalidate.unsubscribe();
}
}

View File

@@ -15,6 +15,10 @@ export class WorkspacePermissionService extends Service {
super();
}
override dispose(): void {
this.permission?.dispose();
}
async leaveWorkspace() {
await this.store.leaveWorkspace(this.workspaceService.workspace.id);
this.workspacesService.list.revalidate();

View File

@@ -4,4 +4,8 @@ import { WorkspaceQuota } from '../entities/quota';
export class WorkspaceQuotaService extends Service {
quota = this.framework.createEntity(WorkspaceQuota);
override dispose(): void {
this.quota.dispose();
}
}

View File

@@ -66,4 +66,8 @@ export class ShareDocsList extends Entity {
)
)
);
override dispose(): void {
this.revalidate.unsubscribe();
}
}

View File

@@ -12,4 +12,8 @@ export class ShareDocsListService extends Service {
this.workspaceService.workspace.flavour !== 'local'
? this.framework.createEntity(ShareDocsList)
: null;
override dispose(): void {
this.shareDocs?.dispose();
}
}

View File

@@ -30,7 +30,7 @@ import {
import { isEqual } from 'lodash-es';
import { nanoid } from 'nanoid';
import { EMPTY, map, mergeMap, Observable, switchMap } from 'rxjs';
import { applyUpdate, encodeStateAsUpdate } from 'yjs';
import { encodeStateAsUpdate } from 'yjs';
import type { Server, ServersService } from '../../cloud';
import {
@@ -48,6 +48,7 @@ import { CloudBlobStorage } from './engine/blob-cloud';
import { StaticBlobStorage } from './engine/blob-static';
import { CloudDocEngineServer } from './engine/doc-cloud';
import { CloudStaticDocStorage } from './engine/doc-cloud-static';
import { getWorkspaceProfileWorker } from './out-worker';
const getCloudWorkspaceCacheKey = (serverId: string) => {
if (serverId === 'affine-cloud') {
@@ -123,21 +124,25 @@ class CloudWorkspaceFlavourProvider implements WorkspaceFlavourProvider {
},
});
// apply initial state
await initial(docCollection, blobStorage, docStorage);
try {
// apply initial state
await initial(docCollection, blobStorage, docStorage);
// save workspace to local storage, should be vary fast
await docStorage.doc.set(
workspaceId,
encodeStateAsUpdate(docCollection.doc)
);
for (const subdocs of docCollection.doc.getSubdocs()) {
await docStorage.doc.set(subdocs.guid, encodeStateAsUpdate(subdocs));
// save workspace to local storage, should be vary fast
await docStorage.doc.set(
workspaceId,
encodeStateAsUpdate(docCollection.doc)
);
for (const subdocs of docCollection.doc.getSubdocs()) {
await docStorage.doc.set(subdocs.guid, encodeStateAsUpdate(subdocs));
}
this.revalidate();
await this.waitForLoaded();
} finally {
docCollection.dispose();
}
this.revalidate();
await this.waitForLoaded();
return {
id: workspaceId,
flavour: this.server.id,
@@ -229,7 +234,7 @@ class CloudWorkspaceFlavourProvider implements WorkspaceFlavourProvider {
const docStorage = this.storageProvider.getDocStorage(id);
// download root doc
const localData = await docStorage.doc.get(id);
const cloudData = await cloudStorage.pull(id);
const cloudData = (await cloudStorage.pull(id))?.data;
const info = await this.getWorkspaceInfo(id, signal);
@@ -241,17 +246,16 @@ class CloudWorkspaceFlavourProvider implements WorkspaceFlavourProvider {
};
}
const bs = new DocCollection({
id,
schema: getAFFiNEWorkspaceSchema(),
});
const client = getWorkspaceProfileWorker();
if (localData) applyUpdate(bs.doc, localData);
if (cloudData) applyUpdate(bs.doc, cloudData.data);
const result = await client.call(
'renderWorkspaceProfile',
[localData, cloudData].filter(Boolean) as Uint8Array[]
);
return {
name: bs.meta.name,
avatar: bs.meta.avatar,
name: result.name,
avatar: result.avatar,
isOwner: info.isOwner,
isAdmin: info.isAdmin,
isTeam: info.workspace.team,

View File

@@ -0,0 +1,25 @@
import { type MessageCommunicapable, OpConsumer } from '@toeverything/infra/op';
import { applyUpdate, Doc as YDoc } from 'yjs';
import type { WorkerOps } from './worker-ops';
const consumer = new OpConsumer<WorkerOps>(globalThis as MessageCommunicapable);
consumer.register('renderWorkspaceProfile', data => {
const doc = new YDoc({
guid: 'workspace',
});
for (const update of data) {
applyUpdate(doc, update);
}
const meta = doc.getMap('meta');
const name = meta.get('name');
const avatar = meta.get('avatar');
return {
name: typeof name === 'string' ? name : undefined,
avatar: typeof avatar === 'string' ? avatar : undefined,
};
});
consumer.listen();

View File

@@ -18,12 +18,13 @@ import {
import { isEqual } from 'lodash-es';
import { nanoid } from 'nanoid';
import { Observable } from 'rxjs';
import { applyUpdate, encodeStateAsUpdate } from 'yjs';
import { encodeStateAsUpdate } from 'yjs';
import { DesktopApiService } from '../../desktop-api';
import type { WorkspaceEngineStorageProvider } from '../providers/engine';
import { BroadcastChannelAwarenessConnection } from './engine/awareness-broadcast-channel';
import { StaticBlobStorage } from './engine/blob-static';
import { getWorkspaceProfileWorker } from './out-worker';
export const LOCAL_WORKSPACE_LOCAL_STORAGE_KEY = 'affine-local-workspace';
const LOCAL_WORKSPACE_CHANGED_BROADCAST_CHANNEL_KEY =
@@ -97,21 +98,25 @@ class LocalWorkspaceFlavourProvider implements WorkspaceFlavourProvider {
blobSources: { main: blobStorage },
});
// apply initial state
await initial(docCollection, blobStorage, docStorage);
try {
// apply initial state
await initial(docCollection, blobStorage, docStorage);
// save workspace to local storage, should be vary fast
await docStorage.doc.set(id, encodeStateAsUpdate(docCollection.doc));
for (const subdocs of docCollection.doc.getSubdocs()) {
await docStorage.doc.set(subdocs.guid, encodeStateAsUpdate(subdocs));
// save workspace to local storage, should be vary fast
await docStorage.doc.set(id, encodeStateAsUpdate(docCollection.doc));
for (const subdocs of docCollection.doc.getSubdocs()) {
await docStorage.doc.set(subdocs.guid, encodeStateAsUpdate(subdocs));
}
// save workspace id to local storage
setLocalWorkspaceIds(ids => [...ids, id]);
// notify all browser tabs, so they can update their workspace list
this.notifyChannel.postMessage(id);
} finally {
docCollection.dispose();
}
// save workspace id to local storage
setLocalWorkspaceIds(ids => [...ids, id]);
// notify all browser tabs, so they can update their workspace list
this.notifyChannel.postMessage(id);
return { id, flavour: 'local' };
}
workspaces$ = LiveData.from(
@@ -158,16 +163,16 @@ class LocalWorkspaceFlavourProvider implements WorkspaceFlavourProvider {
};
}
const bs = new DocCollection({
id,
schema: getAFFiNEWorkspaceSchema(),
});
const client = getWorkspaceProfileWorker();
if (localData) applyUpdate(bs.doc, localData);
const result = await client.call(
'renderWorkspaceProfile',
[localData].filter(Boolean) as Uint8Array[]
);
return {
name: bs.meta.name,
avatar: bs.meta.avatar,
name: result.name,
avatar: result.avatar,
isOwner: true,
};
}

View File

@@ -0,0 +1,22 @@
import { OpClient } from '@toeverything/infra/op';
import type { WorkerOps } from './worker-ops';
let worker: OpClient<WorkerOps> | undefined;
export function getWorkspaceProfileWorker() {
if (worker) {
return worker;
}
const rawWorker = new Worker(
new URL(
/* webpackChunkName: "workspace-profile-worker" */ './in-worker.ts',
import.meta.url
)
);
worker = new OpClient<WorkerOps>(rawWorker);
worker.listen();
return worker;
}

View File

@@ -0,0 +1,5 @@
import type { OpSchema } from '@toeverything/infra/op';
export interface WorkerOps extends OpSchema {
renderWorkspaceProfile: [Uint8Array[], { name?: string; avatar?: string }];
}