perf: reduce frontend login and dashboard friction (#1447)

Co-authored-by: apple <apple@MacbookPro-zbh.local>

web/src/App.tsx

@@ -55,11 +55,6 @@ function App() {
   const { config: systemConfig, loading: configLoading } = useSystemConfig()
   const [route, setRoute] = useState(window.location.pathname)
 
-  // Debug log
-  useEffect(() => {
-    console.log('[App] Mounted. Route:', window.location.pathname);
-  }, []);
-
   // 从URL路径读取初始页面状态（支持刷新保持页面）
   const getInitialPage = (): Page => {
     const path = window.location.pathname

web/src/components/charts/ChartTabs.tsx

@@ -123,7 +123,6 @@ export function ChartTabs({ traderId, selectedSymbol, updateKey, exchangeId }: C
   // Auto-switch to kline chart when symbol selected externally
   useEffect(() => {
     if (selectedSymbol) {
-      console.log('[ChartTabs] Symbol selected:', selectedSymbol, 'updateKey:', updateKey)
       setChartSymbol(selectedSymbol)
       setActiveTab('kline')
     }
@@ -143,8 +142,6 @@ export function ChartTabs({ traderId, selectedSymbol, updateKey, exchangeId }: C
     }
   }
 
-  console.log('[ChartTabs] rendering, activeTab:', activeTab)
-
   return (
     <div className={`nofx-glass rounded-lg border border-white/5 relative z-10 w-full flex flex-col transition-all duration-300 ${typeof window !== 'undefined' && window.innerWidth < 768 ? 'h-[500px]' : 'h-[600px]'
       }`}>

web/src/components/common/DeepVoidBackground.tsx

@@ -9,27 +9,35 @@ interface DeepVoidBackgroundProps extends React.HTMLAttributes<HTMLDivElement> {
 export function DeepVoidBackground({ children, className = '', disableAnimation = false, ...props }: DeepVoidBackgroundProps) {
     return (
         <div className={`relative w-full min-h-screen bg-nofx-bg text-nofx-text overflow-hidden flex flex-col ${className}`} {...props}>
-            {/* BACKGROUND LAYERS */}
+            {/* Background layers: use a much lighter static stack when animations are disabled */}
+            {disableAnimation ? (
+                <>
+                    <div className="absolute inset-0 pointer-events-none z-0 bg-[radial-gradient(circle_at_top,rgba(240,185,11,0.08),transparent_38%),linear-gradient(180deg,rgba(12,14,20,0.98),rgba(8,10,15,1))]"></div>
+                    <div className="absolute inset-0 pointer-events-none z-0 opacity-[0.035] bg-[linear-gradient(to_right,#80808012_1px,transparent_1px),linear-gradient(to_bottom,#80808012_1px,transparent_1px)] bg-[size:36px_36px]"></div>
+                </>
+            ) : (
+                <>
+                    {/* 1. Grain/Noise Texture */}
+                    <div className="absolute inset-0 bg-[url('https://grainy-gradients.vercel.app/noise.svg')] opacity-20 mix-blend-soft-light pointer-events-none fixed z-0"></div>
 
-            {/* 1. Grain/Noise Texture */}
-            <div className="absolute inset-0 bg-[url('https://grainy-gradients.vercel.app/noise.svg')] opacity-20 mix-blend-soft-light pointer-events-none fixed z-0"></div>
+                    {/* 2. Grid System */}
+                    <div className="absolute inset-0 pointer-events-none fixed z-0">
+                        <div className="absolute inset-x-0 bottom-0 h-[50vh] bg-[linear-gradient(to_right,#80808012_1px,transparent_1px),linear-gradient(to_bottom,#80808012_1px,transparent_1px)] bg-[size:40px_40px] [mask-image:radial-gradient(ellipse_60%_50%_at_50%_0%,#000_70%,transparent_100%)] opacity-50" style={{ transform: 'perspective(500px) rotateX(60deg) translateY(100px) scale(2)' }}></div>
+                        <div className="absolute inset-0 bg-grid-pattern opacity-[0.03]"></div>
+                    </div>
 
-            {/* 2. Grid System */}
-            <div className="absolute inset-0 pointer-events-none fixed z-0">
-                <div className="absolute inset-x-0 bottom-0 h-[50vh] bg-[linear-gradient(to_right,#80808012_1px,transparent_1px),linear-gradient(to_bottom,#80808012_1px,transparent_1px)] bg-[size:40px_40px] [mask-image:radial-gradient(ellipse_60%_50%_at_50%_0%,#000_70%,transparent_100%)] opacity-50" style={{ transform: 'perspective(500px) rotateX(60deg) translateY(100px) scale(2)' }}></div>
-                <div className="absolute inset-0 bg-grid-pattern opacity-[0.03]"></div>
-            </div>
+                    {/* 3. Ambient Glow Spots */}
+                    <div className="absolute inset-0 overflow-hidden pointer-events-none fixed z-0">
+                        <div className="absolute top-[-10%] left-[-10%] w-[40vw] h-[40vw] bg-nofx-gold/10 rounded-full blur-[120px] mix-blend-screen animate-pulse-slow"></div>
+                        <div className="absolute bottom-[-10%] right-[-10%] w-[40vw] h-[40vw] bg-nofx-accent/5 rounded-full blur-[120px] mix-blend-screen animate-pulse-slow" style={{ animationDelay: '2s' }}></div>
+                    </div>
 
-            {/* 3. Ambient Glow Spots */}
-            <div className="absolute inset-0 overflow-hidden pointer-events-none fixed z-0">
-                <div className="absolute top-[-10%] left-[-10%] w-[40vw] h-[40vw] bg-nofx-gold/10 rounded-full blur-[120px] mix-blend-screen animate-pulse-slow"></div>
-                <div className="absolute bottom-[-10%] right-[-10%] w-[40vw] h-[40vw] bg-nofx-accent/5 rounded-full blur-[120px] mix-blend-screen animate-pulse-slow" style={{ animationDelay: '2s' }}></div>
-            </div>
-
-            {/* 4. CRT/Scanline Overlay */}
-            <div className="absolute inset-0 pointer-events-none fixed z-[9999] opacity-40">
-                <div className="absolute inset-0 bg-[linear-gradient(rgba(18,16,16,0)_50%,rgba(0,0,0,0.25)_50%),linear-gradient(90deg,rgba(255,0,0,0.06),rgba(0,255,0,0.02),rgba(0,0,255,0.06))] bg-[length:100%_4px,3px_100%] pointer-events-none"></div>
-            </div>
+                    {/* 4. CRT/Scanline Overlay */}
+                    <div className="absolute inset-0 pointer-events-none fixed z-[9999] opacity-40">
+                        <div className="absolute inset-0 bg-[linear-gradient(rgba(18,16,16,0)_50%,rgba(0,0,0,0.25)_50%),linear-gradient(90deg,rgba(255,0,0,0.06),rgba(0,255,0,0.02),rgba(0,0,255,0.06))] bg-[length:100%_4px,3px_100%] pointer-events-none"></div>
+                    </div>
+                </>
+            )}
 
             {/* Content Layer */}
             <div className="relative z-10 flex-1 flex flex-col h-full w-full">

web/src/components/common/LanguageSwitcher.tsx

@@ -1,4 +1,3 @@
-import React from 'react'
 import { Globe } from 'lucide-react'
 import { useLanguage } from '../../contexts/LanguageContext'
 import type { Language } from '../../i18n/translations'

web/src/components/modals/SetupPage.tsx

@@ -6,7 +6,6 @@ import { OnboardingModeSelector } from '../auth/OnboardingModeSelector'
 import type { UserMode } from '../../lib/onboarding'
 import { useLanguage } from '../../contexts/LanguageContext'
 import { LanguageSwitcher } from '../common/LanguageSwitcher'
-import type { Language } from '../../i18n/translations'
 
 const labels = {
   zh: {

web/src/components/trader/AITradersPage.tsx

@@ -259,7 +259,6 @@ export function AITradersPage({ onTraderSelect }: AITradersPageProps) {
   }
 
   const handleSaveEditTrader = async (data: CreateTraderRequest) => {
-    console.log('🔥🔥🔥 handleSaveEditTrader CALLED with data:', data)
     if (!editingTrader) return
 
     try {
@@ -287,10 +286,6 @@ export function AITradersPage({ onTraderSelect }: AITradersPageProps) {
         show_in_competition: data.show_in_competition,
       }
 
-      console.log('🔥 handleSaveEditTrader - data:', data)
-      console.log('🔥 handleSaveEditTrader - data.strategy_id:', data.strategy_id)
-      console.log('🔥 handleSaveEditTrader - request:', request)
-
       await api.updateTrader(editingTrader.trader_id, request)
       toast.success(t('aiTradersToast.saved', language))
       setShowEditModal(false)