feat: enhance tool loading and performance optimization

- Added DNS prefetch and preconnect links in index.html for improved API loading times.
- Implemented lazy loading for tool components to optimize performance and reduce initial load time.
- Wrapped tool components in Suspense with a loading fallback to enhance user experience during loading.
- Refactored Vite configuration to create manual chunks for better code splitting of React and UI libraries.
This commit is contained in:
typist
2025-10-29 08:49:25 +08:00
parent 55207beff5
commit 59f998e8e3
5 changed files with 66 additions and 21 deletions

View File

@@ -1,17 +1,22 @@
import type { ReactNode } from 'react';
import { lazy, type ReactNode, type ComponentType } from 'react';
import { FileJson, Hash, Binary, Network, Globe, Activity, Gauge, Wifi, MapPin } from 'lucide-react'
import UUID from './uuid'
import JSON from './json'
import Base64 from './base64'
import { DNS, Ping, TCPing, SpeedTest, IPQuery } from './network'
// 懒加载工具组件
const UUID = lazy(() => import('./uuid'))
const JSON = lazy(() => import('./json'))
const Base64 = lazy(() => import('./base64'))
const DNS = lazy(() => import('./network/dns'))
const Ping = lazy(() => import('./network/ping'))
const TCPing = lazy(() => import('./network/tcping'))
const SpeedTest = lazy(() => import('./network/speedtest'))
const IPQuery = lazy(() => import('./network/ipquery'))
export interface Tool {
path: string;
name: string;
icon: ReactNode;
description: string;
component?: ReactNode;
component?: ComponentType;
children?: Tool[];
}
@@ -21,21 +26,21 @@ export const tools: Tool[] = [
name: "UUID Generator",
description: "Generate a UUID",
icon: <Hash />,
component: <UUID />,
component: UUID,
},
{
path: "json",
name: "JSON Formatter",
description: "Format and validate JSON",
icon: <FileJson />,
component: <JSON />,
component: JSON,
},
{
path: "base64",
name: "Base64 Encoder/Decoder",
description: "Encode and decode Base64",
icon: <Binary />,
component: <Base64 />,
component: Base64,
},
{
path: "network",
@@ -48,35 +53,35 @@ export const tools: Tool[] = [
name: "DNS Lookup",
description: "DNS query tool",
icon: <Globe />,
component: <DNS />,
component: DNS,
},
{
path: "ping",
name: "Ping",
description: "Ping test tool",
icon: <Activity />,
component: <Ping />,
component: Ping,
},
{
path: "tcping",
name: "TCPing",
description: "TCP port connectivity test",
icon: <Wifi />,
component: <TCPing />,
component: TCPing,
},
{
path: "speedtest",
name: "Speed Test",
description: "Website speed test",
icon: <Gauge />,
component: <SpeedTest />,
component: SpeedTest,
},
{
path: "ipquery",
name: "IP Query",
description: "Query IP location, quality and risk info",
icon: <MapPin />,
component: <IPQuery />,
component: IPQuery,
},
],
},