[Open WebUI] Knowledge 페이지 로딩 속도 개선: 중복 API 호출 제거

PR 링크: open-webui/open-webui#18057 상태: Merged | 변경: +1 / -15

들어가며

Open WebUI의 Knowledge 페이지(/workspace/knowledge)에서는 onMount 시 getKnowledgeBases() API를 호출하여 knowledges 스토어를 설정하고, 그 값이 null이 아닐 때만 Knowledge 컴포넌트를 렌더링했습니다. 하지만 knowledges 목록은 데이터가 없더라도 빈 배열([])을 반환하므로, 이 null 체크와 API 호출은 완전히 불필요한 작업이었습니다.

핵심 코드 분석

기존: 불필요한 API 호출 + 조건부 렌더링

Before:

<script>
    import { onMount } from 'svelte';
    import { knowledge } from '$lib/stores';
    import { getKnowledgeBases } from '$lib/apis/knowledge';
    import Knowledge from '$lib/components/workspace/Knowledge.svelte';

    onMount(async () => {
        await Promise.all([
            (async () => {
                knowledge.set(await getKnowledgeBases(localStorage.token));
            })()
        ]);
    });
</script>

{#if $knowledge !== null}
    <Knowledge />
{/if}

변경: 직접 컴포넌트 렌더링

After:

<script>
    import Knowledge from '$lib/components/workspace/Knowledge.svelte';
</script>

<Knowledge />

왜 이게 좋은가

• 15줄 삭제, 코드 대폭 간소화: 불필요한 import, onMount, Promise.all, 조건부 렌더링이 모두 제거됩니다.
• 페이지 로딩 속도 개선: API 호출 대기 없이 컴포넌트가 즉시 렌더링됩니다.
• 워터폴 제거: 페이지 로드 -> API 호출 -> 응답 대기 -> 렌더링이던 체인이, 페이지 로드 -> 즉시 렌더링으로 단축됩니다.
• Knowledge 컴포넌트 자체에서 데이터 로딩: 데이터 로딩 책임이 해당 컴포넌트 내부로 이동하여 관심사 분리가 개선됩니다.

참고 자료

• PR #18057 - Perf: knowledge page loading speed