diff --git a/src/views/Home/HomePage.tsx b/src/views/Home/HomePage.tsx
index 38f1484e..ef50e489 100644
--- a/src/views/Home/HomePage.tsx
+++ b/src/views/Home/HomePage.tsx
@@ -1,7 +1,7 @@
// src/views/Home/HomePage.tsx
// 首页 - 专业投资分析平台
-import React, { useEffect, useCallback, useState } from 'react';
+import React, { useEffect, useCallback, useRef } from 'react';
import { Box, Container, VStack, SimpleGrid } from '@chakra-ui/react';
import { useNavigate } from 'react-router-dom';
import { useAuth } from '@/contexts/AuthContext';
@@ -11,7 +11,6 @@ import { ACQUISITION_EVENTS } from '@/lib/constants';
import { CORE_FEATURES } from '@/constants/homeFeatures';
import { performanceMonitor } from '@/utils/performanceMonitor';
import type { Feature } from '@/types/home';
-import { HeroBackground } from './components/HeroBackground';
import { HeroHeader } from './components/HeroHeader';
import { FeaturedFeatureCard } from './components/FeaturedFeatureCard';
import { FeatureCard } from './components/FeatureCard';
@@ -25,7 +24,13 @@ const HomePage: React.FC = () => {
const { user, isAuthenticated } = useAuth();
const navigate = useNavigate();
const { track } = usePostHogTrack();
- const [imageLoaded, setImageLoaded] = useState(false);
+
+ // ⚡ 性能标记:渲染开始(组件函数执行时,使用 ref 避免严格模式下重复标记)
+ const hasMarkedStart = useRef(false);
+ if (!hasMarkedStart.current) {
+ performanceMonitor.mark('homepage-render-start');
+ hasMarkedStart.current = true;
+ }
// 响应式配置
const {
@@ -34,12 +39,11 @@ const HomePage: React.FC = () => {
headingLetterSpacing,
heroTextSize,
containerPx,
- showDecorations
} = useHomeResponsive();
- // ⚡ 性能标记:首页组件挂载 = 渲染开始
+ // ⚡ 性能标记:渲染完成(DOM 已挂载)
useEffect(() => {
- performanceMonitor.mark('homepage-render-start');
+ performanceMonitor.mark('homepage-render-end');
}, []);
// PostHog 追踪:页面浏览
@@ -70,13 +74,6 @@ const HomePage: React.FC = () => {
}
}, [track, navigate]);
- // 背景图片加载完成回调
- const handleImageLoad = useCallback(() => {
- setImageLoaded(true);
- // ⚡ 性能标记:首页渲染完成(背景图片加载完成 = 首屏视觉完整)
- performanceMonitor.mark('homepage-render-end');
- }, []);
-
// 特色功能(第一个)
const featuredFeature = CORE_FEATURES[0];
// 其他功能
@@ -91,12 +88,6 @@ const HomePage: React.FC = () => {
bg="linear-gradient(135deg, #0E0C15 0%, #15131D 50%, #252134 100%)"
overflow="hidden"
>
- {/* 背景装饰 */}
-
void;
- showDecorations: boolean | undefined;
-}
-
-/**
- * 首页英雄区背景组件
- * 包含背景图片和装饰性几何图形
- */
-export const HeroBackground: React.FC = ({
- imageLoaded,
- onImageLoad,
- showDecorations
-}) => {
- return (
- <>
- {/* 背景图片 */}
-
-
- {/* 预加载背景图片 */}
-
-
-
-
- {/* 装饰性几何图形 - 移动端隐藏 */}
- {showDecorations && (
- <>
-
-
- >
- )}
- >
- );
-};