mirror of
https://github.com/open-webui/open-webui.git
synced 2025-12-12 04:15:25 +00:00
feat: Dynamically load CodeEditor to improve first-screen loading speed
This commit is contained in:
parent
9f9f1a1517
commit
001775d6c3
3 changed files with 45 additions and 42 deletions
|
|
@ -4,7 +4,6 @@
|
|||
|
||||
const i18n = getContext('i18n');
|
||||
|
||||
import CodeEditor from '$lib/components/common/CodeEditor.svelte';
|
||||
import ConfirmDialog from '$lib/components/common/ConfirmDialog.svelte';
|
||||
import Badge from '$lib/components/common/Badge.svelte';
|
||||
import Tooltip from '$lib/components/common/Tooltip.svelte';
|
||||
|
|
@ -367,6 +366,7 @@ class Pipe:
|
|||
</div>
|
||||
|
||||
<div class="mb-2 flex-1 overflow-auto h-0 rounded-lg">
|
||||
{#await import('$lib/components/common/CodeEditor.svelte') then { default: CodeEditor }}
|
||||
<CodeEditor
|
||||
bind:this={codeEditor}
|
||||
value={content}
|
||||
|
|
@ -381,6 +381,7 @@ class Pipe:
|
|||
}
|
||||
}}
|
||||
/>
|
||||
{/await}
|
||||
</div>
|
||||
|
||||
<div class="pb-3 flex justify-between">
|
||||
|
|
|
|||
|
|
@ -7,7 +7,6 @@
|
|||
import 'highlight.js/styles/github-dark.min.css';
|
||||
|
||||
import PyodideWorker from '$lib/workers/pyodide.worker?worker';
|
||||
import CodeEditor from '$lib/components/common/CodeEditor.svelte';
|
||||
import SvgPanZoom from '$lib/components/common/SVGPanZoom.svelte';
|
||||
import { config } from '$lib/stores';
|
||||
import { executeCode } from '$lib/apis/utils';
|
||||
|
|
@ -481,6 +480,7 @@
|
|||
|
||||
{#if !collapsed}
|
||||
{#if edit}
|
||||
{#await import('$lib/components/common/CodeEditor.svelte') then { default: CodeEditor }}
|
||||
<CodeEditor
|
||||
value={code}
|
||||
{id}
|
||||
|
|
@ -492,6 +492,7 @@
|
|||
_code = value;
|
||||
}}
|
||||
/>
|
||||
{/await}
|
||||
{:else}
|
||||
<pre
|
||||
class=" hljs p-4 px-5 overflow-x-auto"
|
||||
|
|
|
|||
|
|
@ -3,7 +3,6 @@
|
|||
|
||||
const i18n = getContext('i18n');
|
||||
|
||||
import CodeEditor from '$lib/components/common/CodeEditor.svelte';
|
||||
import { goto } from '$app/navigation';
|
||||
import ConfirmDialog from '$lib/components/common/ConfirmDialog.svelte';
|
||||
import Badge from '$lib/components/common/Badge.svelte';
|
||||
|
|
@ -286,6 +285,7 @@ class Tools:
|
|||
</div>
|
||||
|
||||
<div class="mb-2 flex-1 overflow-auto h-0 rounded-lg">
|
||||
{#await import('$lib/components/common/CodeEditor.svelte') then { default: CodeEditor }}
|
||||
<CodeEditor
|
||||
bind:this={codeEditor}
|
||||
value={content}
|
||||
|
|
@ -300,6 +300,7 @@ class Tools:
|
|||
}
|
||||
}}
|
||||
/>
|
||||
{/await}
|
||||
</div>
|
||||
|
||||
<div class="pb-3 flex justify-between">
|
||||
|
|
|
|||
Loading…
Reference in a new issue