You've already forked DataMate
feat(label-studio): 添加预加载组件以优化加载性能
- 实现 LabelStudioPreloader 组件用于预加载资源 - 使用 iframe 在后台加载 /lsf/lsf.html 页面 - 设置 2 秒延迟避免与初始页面加载竞争资源 - 配置隐藏样式确保预加载过程不可见 - 添加清理函数防止内存泄漏 - 实现条件渲染控制预加载时机
This commit is contained in:
35
frontend/src/components/business/LabelStudioPreloader.tsx
Normal file
35
frontend/src/components/business/LabelStudioPreloader.tsx
Normal file
@@ -0,0 +1,35 @@
|
|||||||
|
import { useEffect, useState } from "react";
|
||||||
|
|
||||||
|
const PRELOAD_URL = "/lsf/lsf.html";
|
||||||
|
|
||||||
|
export default function LabelStudioPreloader() {
|
||||||
|
const [shouldLoad, setShouldLoad] = useState(false);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
// Delay preloading slightly to avoid contending with initial page load resources
|
||||||
|
// Using 2000ms (2 seconds) as a reasonable idle time approximation
|
||||||
|
const timer = setTimeout(() => {
|
||||||
|
setShouldLoad(true);
|
||||||
|
}, 2000);
|
||||||
|
|
||||||
|
return () => clearTimeout(timer);
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
if (!shouldLoad) return null;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<iframe
|
||||||
|
src={PRELOAD_URL}
|
||||||
|
style={{
|
||||||
|
display: "none",
|
||||||
|
width: 0,
|
||||||
|
height: 0,
|
||||||
|
border: 0,
|
||||||
|
position: "absolute",
|
||||||
|
visibility: "hidden"
|
||||||
|
}}
|
||||||
|
title="Label Studio Preloader"
|
||||||
|
aria-hidden="true"
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user