From 9c5a1d551d984d9c28b32146708ba9fff106adba Mon Sep 17 00:00:00 2001 From: yuetsh <517252939@qq.com> Date: Tue, 8 Sep 2026 05:43:32 -0600 Subject: [PATCH] =?UTF-8?q?perf(=E6=95=99=E5=B8=88=E7=BB=9F=E8=AE=A1):=20?= =?UTF-8?q?=E5=B1=95=E5=BC=80=E8=A1=8C=E7=9A=84=E6=98=8E=E7=BB=86=E6=94=B9?= =?UTF-8?q?=E6=88=90=E6=8C=89=E9=9C=80=E6=8B=89=EF=BC=8C=E7=BB=9F=E8=AE=A1?= =?UTF-8?q?=E5=93=8D=E5=BA=94=E4=B8=8D=E5=86=8D=E8=83=8C=E7=9D=80=204.9=20?= =?UTF-8?q?=E4=B8=87=E8=A1=8C=E6=B2=A1=E4=BA=BA=E7=9C=8B=E7=9A=84=E6=95=B0?= =?UTF-8?q?=E6=8D=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 上一版把明细收成「只取有 AC 的人、每人最近 50 条」，拿生产快照（12.4 万条提交） 实测下来只从 105631 行降到 49108 行 —— 2.1 倍，不是一个数量级。原因是绝大多数人 本来就不到 50 条，每人截断那道闸在真实分布上基本没咬到，最坏情况响应体仍有 ~2.4MB。 真正的问题是形状不对：表格一次只展开一行（updateExpandedRowKeys 只留最后一个 key）， 却给 1900 个人各准备了一份。所以明细整个从统计响应里拿掉，改成展开时按需拉： - 新端点 `GET /submissions/statistics/items`，要用户名 + 同一套时间窗和题号。 用户名这里是**精确匹配**，不是统计接口那种 ilike —— 那边填 ks251 要圈出整个班， 这边是「点开的这一行是谁」。上限 200 条，多取一条来判断 truncated，被截断时 展开行里说明「只显示最近 200 条」，免得老师以为这人就交了这么多。 - 时间窗和题号抽成共用的 statisticsScope，两个接口必须同一个范围，否则展开行 看到的是另一个窗口的数据。 - 前端按人缓存，收起再展开不重拉；每次重新统计（含 15 秒自动刷新）清缓存， 并把当前展开着的那一行重拉一遍 —— 展开行跟着一起活着，不然刷新之后上面的数 变了、下面的明细还是老的。 - 去重放在 loadItems 里：点一行会同时走 rowProps 的 onClick 和表格的 update:expanded-row-keys，两边都想拉，改之前真发出了两条一模一样的请求。 顺带把 submissionItems 从 submissionStatisticsUserSchema 里删掉。 生产快照上的验证（12.4 万条提交 / 1956 用户 / 961 题，恢复进一次性容器跑完即删）： - 最坏情况（全部时段 + 不填条件）少搬 49108 行，约 2.4MB - 真实课堂量级（最忙的一小时：583 条提交 / 81 人）四条查询分别是 主聚合 45ms、明细 6.5ms、语法未过 2.4ms、最近错因 <1ms - 「已解决」那条口径修正的实际影响：13.3% 的「人×题」有重复 AC，同一题最多 AC 45 次； 按人看最夸张的是 419 条 AC 其实只有 38 道题 - 语法要求的题 15 道、result=10 共 57 条，其中「最后也没改对」的 18 个人×题 —— 角标会出现，但稀有 浏览器实跑：展开前不发明细请求；展开后 1 条、12 个按钮；收起 +0、再展开 +0（走缓存）； 自动刷新时统计与明细 1:1 配对、间隔 15 秒，没有重复请求。 Co-Authored-By: Claude Opus 5 Claude-Session: https://claude.ai/code/session_01KqjE6qPo67fqVDKn6Bx7yd --- apps/api/src/routes/submission.ts | 128 +++++++++++------- apps/web/src/oj/api.ts | 15 ++ .../src/shared/components/StatisticsPanel.vue | 86 +++++++++--- packages/contract/src/submission.ts | 18 ++- 4 files changed, 178 insertions(+), 69 deletions(-) diff --git a/apps/api/src/routes/submission.ts b/apps/api/src/routes/submission.ts index bc23249..cb45bb4 100644 --- a/apps/api/src/routes/submission.ts +++ b/apps/api/src/routes/submission.ts @@ -8,6 +8,7 @@ import { submissionDetailSchema, submissionListItemSchema, submissionListSchema, + submissionStatisticsItemsSchema, submissionStatisticsSchema, } from "@oj2/contract" import { and, count, desc, eq, gt, ilike, inArray, isNull, or, sql, type SQL } from "drizzle-orm" @@ -238,46 +239,13 @@ async function findPublicProblemsByDisplayIds(displayIds: string[]) { } /** - * 表格展开行要看的「这个人交了哪几次」。两道闸都是为了不让「全部时段 + 不填条件」 - * 把十几万条提交整个搬进响应体： + * 展开行一次只看一个人（表格的 updateExpandedRowKeys 只留最后一个 key），所以明细 + * **按需拉**，不再随统计一起下发。 * - * - **只取有 AC 的人**。明细只挂在 `data` 里，而 `data` 本来就只留有 AC 的人， - * 原来给「一次没对的人」也捞一份明细，捞完直接扔掉。 - * - **每人只留最近 50 条**。展开行是一排 120px 的按钮，几十个就已经翻不动了。 - * 表格「提交数」那一列走的是 perUser 的 count，仍然是真实总数，不受这里截断影响。 + * 原来是随 data 一起给所有人各带一份：生产快照实测，「全部时段 + 不填条件」要搬 + * 49108 行（最早那版不截断是 105631 行），而其中真正被人看到的最多一个人的那几十条。 */ -const STATISTICS_ITEMS_PER_USER = 50 - -async function submissionItemsByUser(where: SQL | undefined, usernames: string[]) { - const byUser = new Map() - if (!usernames.length) return byUser - - // 走窗口函数而不是「查全量再在 JS 里截断」：截断要发生在数据库那边才省得下来。 - const rows = await db.execute<{ username: string; id: string; result: number }>(sql` - select username, id, result from ( - select - ${schema.submission.username} as username, - ${schema.submission.id} as id, - ${schema.submission.result} as result, - row_number() over ( - partition by ${schema.submission.username} - order by ${schema.submission.createTime} desc - ) as rn - from ${schema.submission} - where ${and(where, inArray(schema.submission.username, usernames))} - ) t - where rn <= ${STATISTICS_ITEMS_PER_USER} - -- rn 就是「这个人的第几新」，外层不排的话展开行里的按钮是乱序的 - order by username, rn - `) - - for (const row of rows) { - const bucket = byUser.get(row.username) - if (bucket) bucket.push({ id: row.id, result: row.result }) - else byUser.set(row.username, [{ id: row.id, result: row.result }]) - } - return byUser -} +const STATISTICS_ITEMS_LIMIT = 200 /** 错误摘要截断长度。编译错误能刷几十行，弹层里放不下，也没必要 */ const FAILURE_MESSAGE_LIMIT = 400 @@ -381,9 +349,21 @@ async function matchedStudents(username: string) { ) } -submissionRoutes.get("/submissions/statistics", requireTeacher, async (c) => { +/** + * 两个统计接口共用的范围：时间窗 + 题号。**用户名不在里面** —— 统计那边是 + * ilike 模糊匹配（填 ks251 要匹配整个班），明细那边必须精确到人，口径不同。 + */ +type StatisticsScope = + | { ok: true; filters: SQL[]; problemCount: number } + | { ok: false; status: 400 | 404; code: string; message: string } + +async function statisticsScope(c: { + req: { query(name: string): string | undefined } +}): Promise { const range = statisticsRange(c) - if (!range) return failure(c, 400, "invalid-request", "end is required") + if (!range) { + return { ok: false, status: 400, code: "invalid-request", message: "end is required" } + } const filters = [ isNull(schema.submission.contestId), @@ -393,16 +373,34 @@ submissionRoutes.get("/submissions/statistics", requireTeacher, async (c) => { const displayIds = parseDisplayIds(c.req.query("problemId") ?? "") if (displayIds.length > STATISTICS_MAX_PROBLEMS) { - return failure(c, 400, "invalid-request", `At most ${STATISTICS_MAX_PROBLEMS} problems`) + return { + ok: false, + status: 400, + code: "invalid-request", + message: `At most ${STATISTICS_MAX_PROBLEMS} problems`, + } } if (displayIds.length) { const { ids, missing } = await findPublicProblemsByDisplayIds(displayIds) if (missing) { - return failure(c, 404, "problem-not-found", `Problem ${missing} does not exist`) + return { + ok: false, + status: 404, + code: "problem-not-found", + message: `Problem ${missing} does not exist`, + } } filters.push(inArray(schema.submission.problemId, ids)) } + return { ok: true, filters, problemCount: displayIds.length } +} + +submissionRoutes.get("/submissions/statistics", requireTeacher, async (c) => { + const scope = await statisticsScope(c) + if (!scope.ok) return failure(c, scope.status, scope.code, scope.message) + const filters = scope.filters + const username = c.req.query("username")?.trim() if (username) filters.push(ilike(schema.submission.username, `%${username}%`)) const where = and(...filters) @@ -456,18 +454,17 @@ submissionRoutes.get("/submissions/statistics", requireTeacher, async (c) => { * 只填一道题时 `solvedCount >= 1` 和原来的 `acceptedCount > 0` 完全等价； * 不填题号时无所谓「全部」，退回「至少做出一道」。 */ - const requiredSolved = displayIds.length + const requiredSolved = scope.problemCount const isDone = (row: { solvedCount: number; acceptedCount: number }) => requiredSolved > 0 ? row.solvedCount >= requiredSolved : row.acceptedCount > 0 // 表格列的是做完了的人。没做完的（一条没交 / 交了没全对）在「未完成」那一栏 const acceptedUsers = perUser.filter(isDone) - // 这两个都要等 acceptedUsers 定下来才能查，所以进不了上面那个 Promise.all - const acceptedNames = acceptedUsers.map((row) => row.username) - const [itemsByUser, astOnlyByUserMap] = await Promise.all([ - submissionItemsByUser(where, acceptedNames), - astOnlyByUser(where, acceptedNames), - ]) + // 要等 acceptedUsers 定下来才能查，所以进不了上面那个 Promise.all + const astOnlyByUserMap = await astOnlyByUser( + where, + acceptedUsers.map((row) => row.username), + ) const submittedUsernames = new Set(perUser.map((row) => row.username)) const classNames = new Map() @@ -488,7 +485,6 @@ submissionRoutes.get("/submissions/statistics", requireTeacher, async (c) => { astOnlyCount: astOnlyByUserMap.get(row.username) ?? 0, judgingCount: row.judgingCount, correctRate: judgedRate(row.acceptedCount, row.submissionCount - row.judgingCount), - submissionItems: itemsByUser.get(row.username) ?? [], })) const dataUnaccepted = rosterRows @@ -538,6 +534,38 @@ submissionRoutes.get("/submissions/statistics", requireTeacher, async (c) => { ) }) +/** + * 统计面板展开一行时拉这个人的提交明细。 + * + * 用户名这里是**精确匹配**，不是统计接口那种 ilike —— 那边填 `ks251` 要圈出整个班， + * 这边是「点开的这一行是谁」。时间窗和题号沿用同一个 scope，不然展开行看到的 + * 会是另一个范围的数据。 + */ +submissionRoutes.get("/submissions/statistics/items", requireTeacher, async (c) => { + const username = c.req.query("username")?.trim() + if (!username) return failure(c, 400, "invalid-request", "username is required") + + const scope = await statisticsScope(c) + if (!scope.ok) return failure(c, scope.status, scope.code, scope.message) + + // 多取一条，好知道是不是被截断了 + const rows = await db + .select({ id: schema.submission.id, result: schema.submission.result }) + .from(schema.submission) + .where(and(...scope.filters, eq(schema.submission.username, username))) + .orderBy(desc(schema.submission.createTime), desc(schema.submission.id)) + .limit(STATISTICS_ITEMS_LIMIT + 1) + + const truncated = rows.length > STATISTICS_ITEMS_LIMIT + return success( + c, + submissionStatisticsItemsSchema.parse({ + items: rows.slice(0, STATISTICS_ITEMS_LIMIT), + truncated, + }), + ) +}) + submissionRoutes.post("/submissions/:id/rejudge", requireSuperAdmin, async (c) => { const [row] = await db .select({ id: schema.submission.id, problemId: schema.submission.problemId }) diff --git a/apps/web/src/oj/api.ts b/apps/web/src/oj/api.ts index 0712ccd..a67657e 100644 --- a/apps/web/src/oj/api.ts +++ b/apps/web/src/oj/api.ts @@ -37,6 +37,7 @@ import { submissionDetailSchema, type FlowchartStatistics, type SubmissionStatistics, + type SubmissionStatisticsItems, } from "@oj2/contract" import api from "utils/api" import { filterResult } from "oj/transforms" @@ -159,6 +160,20 @@ export function adminRejudge(id: string) { ) } +/** + * 统计面板展开一行时拉这个人的明细。username 这里要**精确**到人， + * 和上面那个按班级模糊匹配的不是一回事。 + */ +export function getSubmissionStatisticsItems( + duration: { start?: string; end: string }, + username: string, + problemID?: string, +) { + return api.get("submissions/statistics/items", { + params: { ...duration, problemId: problemID, username }, + }) +} + export function getSubmissionStatistics( duration: { start?: string; end: string }, problemID?: string, diff --git a/apps/web/src/shared/components/StatisticsPanel.vue b/apps/web/src/shared/components/StatisticsPanel.vue index c9a6ac9..5e5443a 100644 --- a/apps/web/src/shared/components/StatisticsPanel.vue +++ b/apps/web/src/shared/components/StatisticsPanel.vue @@ -192,7 +192,7 @@