perf(miniprogram): 全面性能优化 — 分包加载 + 请求缓存 + 渲染优化
Some checks failed
CI / rust-check (push) Has been cancelled
CI / rust-test (push) Has been cancelled
CI / frontend-build (push) Has been cancelled
CI / security-audit (push) Has been cancelled

分包加载(主包从 517KB 降至 275KB,-47%):
- 将 27 个页面拆入 6 个分包(health/doctor/mall/profile/content/device)
- vendors.js 从 192KB 降至 36KB(-81%)
- echarts 514KB 仅在访问健康趋势页时按需加载

请求层优化:
- GET 请求增加 in-flight 去重 + 60s TTL 响应缓存
- 新建 points store 集中管理积分/签到状态(消除 5 处重复调用)
- health store todaySummary 增加 60s TTL
- mutation 后自动失效缓存(health input/daily-monitoring)
- logout 时清空请求缓存

渲染优化:
- 7 个组件添加 React.memo(EcCanvas/TrendChart/Loading/EmptyState 等)
- 修复 TrendChart setChartReady 导致的双重渲染
- 静态数组(quickServices/quickActions/trendLinks)提取到模块级
- restoreAuth 从页面级提升到 App 级别
- 文章列表图片添加 lazyLoad

构建优化:
- prod 配置添加 terser(drop_console + drop_debugger)
- crypto-js 从全量引入改为按需引入(AES + Utf8)
This commit is contained in:
iven
2026-04-28 11:44:37 +08:00
parent 1bece3d41f
commit fcfc0ba5d9
24 changed files with 268 additions and 192 deletions

View File

@@ -1,8 +1,9 @@
import React, { useState, useCallback, useRef } from 'react';
import { View, Text } from '@tarojs/components';
import Taro, { useDidShow, useReachBottom, usePullDownRefresh } from '@tarojs/taro';
import { getAccount, listMyTransactions } from '../../../services/points';
import type { PointsAccount, PointsTransaction } from '../../../services/points';
import { listMyTransactions } from '../../../services/points';
import type { PointsTransaction } from '../../../services/points';
import { usePointsStore } from '../../../stores/points';
import EmptyState from '../../../components/EmptyState';
import Loading from '../../../components/Loading';
import './index.scss';
@@ -14,7 +15,7 @@ const TYPE_TABS = [
];
export default function PointsDetail() {
const [account, setAccount] = useState<PointsAccount | null>(null);
const { account, refresh: refreshPoints } = usePointsStore();
const [transactions, setTransactions] = useState<PointsTransaction[]>([]);
const [activeTab, setActiveTab] = useState('');
const [page, setPage] = useState(1);
@@ -22,15 +23,6 @@ export default function PointsDetail() {
const [loading, setLoading] = useState(false);
const loadingRef = useRef(false);
const fetchAccount = useCallback(async () => {
try {
const acct = await getAccount();
setAccount(acct);
} catch {
// 账户可能尚未创建
}
}, []);
const fetchTransactions = useCallback(
async (pageNum: number, type: string, isRefresh = false) => {
if (loadingRef.current) return;
@@ -65,9 +57,9 @@ export default function PointsDetail() {
const loadAll = useCallback(
async (type?: string) => {
const t = type !== undefined ? type : activeTab;
await Promise.all([fetchAccount(), fetchTransactions(1, t, true)]);
await Promise.all([refreshPoints(), fetchTransactions(1, t, true)]);
},
[fetchAccount, fetchTransactions, activeTab],
[refreshPoints, fetchTransactions, activeTab],
);
useDidShow(() => {