Lazy loaded image
(类)WSI 平台的设计感想
Words 4002Read Time 11 min
Jan 31, 2026
Feb 18, 2026
type
Post
status
Published
date
Jan 31, 2026
slug
thoughts-of-platform-design
summary
一些设计平台的感想(大概吧)。
tags
Python
Engineering
category
Research
icon
password
Disclaimer: 本文内容完全为个人技术心得,其中内容可能会随着系统本身迭代而变化。由于技术更新的特性,本文不代表时下最新技术栈,还请留意。
 
起因是什么呢… 本人一直觉得各种论文上的写作严重影响到了成果落地和让别人看“这玩意是不是能重复稳定的工作”。所以当组内大佬合作者抛出了这么一个机会,那么本人自然是当仁不让的开搞了。
作为半路出家的自不量力 full-stack engineer, 当然不能放过这个机会 learn by doing projects。故开了这么一个帖子,记录一下这途中完全不会有人看得自己的一些技术心得。
 

Sect. 1 架构选型:为什么是这套技术栈?

既然终极目标是做一个不需要配置环境、小白用户双击就能用的“自动化科研替身”,技术选型就得兼顾界面炫酷和底层硬核。
  • 前端选型: 用 Electron 套壳加上 React 和 Vite。没别的原因,因为如今 Web 前端的 UI 组件库太成熟、太好看了。我们要给用户一种“这软件很聪明也很现代”的视觉体验。而且用 Electron 打包,能把极其复杂的配置环境全部藏在水面之下。
  • 后端选型: 选 Python 的 FastAPI。既然核心是搞大模型 Agent 和深度学习,Python 是唯一的宿主。FastAPI 写接口非常利索,自带文档,而且天生支持异步,这对于咱们这种动辄要跑好几天的后台任务来说简直是救命稻草。(这里同时排除我个人不会写除了 python 和 js 之外的语言,虽然我清楚 rust/go 这种新的语言貌似编译非常快)
  • 隐私至上: 为什么非得费劲巴拉做个本地客户端,而不是直接做个纯网页挂在公网上?因为医疗切片数据属于高度敏感隐私,很多医院和实验室根本不允许数据出内网。本地化部署是打破这个壁垒的唯一出路。(虽然前期的确需要通过公网公共数据集来引流打响知名度)

Sect. 2 前置挑战:如何优雅地塞进一张几十 GB 的病理切片

在让 Agent 干活之前,用户总得先上传和预览数据。但医学全切片图像动辄几十亿像素,直接往前端塞肯定当场崩溃。
这里的解法是“按需加载”加“金字塔拼图”。得益于四年来碰了各种各样的奇奇怪怪扫描仪和数字切片格式,在后端直接用上本人之前的个人项目 ASlide 把那张巨大的切片按照不同的缩放比例,切成无数个 256x256 的 tile。前端用 OpenSeadragon 这个专门处理超大图的库来接应。用户在界面上放大、缩小、拖拽的时候,前端自动计算出当前屏幕视野需要的 tile,然后精准向后端要数据,体验极其丝滑。

Sect. 3 核心灵魂:用 Agent 革了“调包侠”的命

作为软件的根本大饼和尚在完成的部分,本项目的需求定位是:以前的医学 AI 软件,是给人提供一个放大镜;我们这个软件,是直接给用户发一个数字打工人。
业务流程大体是这样的:
  1. 大白话提需求: 用户不需要懂什么叫卷积神经网络,只需要在前端输入自然语言,比如“帮我找一下这些切片里的肿瘤细胞,并评估一下恶性程度”。
  1. Agent 接管一切: 此时后端的 Agent 开始对齐用户需求。它会自动拆解任务,分析用户上传的切片和标签,自己去写数据预处理的脚本。
  1. 全自动炼丹: Agent 会根据任务类型,自动调用底层的 PyTorch 等框架,配置网络结构,自动搜寻合适的超参数,开始漫长的训练过程。
  1. 出报告甚至写文章: 模型训完还不算完,Agent 还要负责跑测试集,生成各种花里胡哨的对比图表,最后甚至按照学术论文的格式,把摘要、方法、结果的文本都完完整整的编译成可用的 PDF 档。

Sect. 4 踩坑与玄学

理想很丰满,但自己动手敲代码的时候,还是踩了几个天坑:
  • 异步编程的究极烧脑 在同步流程跑通之后,我立刻意识到,Agent 跑一个任务,轻则几分钟,重则几天。一开始后端接口直接用普通的同步写法,前端点个“开始训练”,浏览器页面直接卡死白屏,HTTP 请求没一会就超时断开了。更糟的是不只 Agent 炼丹这一处在拖时间,这系统里随便拎一个环节出来都是耗时大户:比如后端去几十 GB 的原始扫描文件里实时抠取图像矩阵、在送入模型前跑极其消耗 CPU 的数据预处理、甚至是最后把海量的图表和文本渲染编译成一份完整的 PDF 报告。 血泪教训是这种耗时任务绝对不能阻塞主线程。必须上个后台任务队列。前端发送任务后,后端秒回一个“任务已收到”,然后让前端通过 WebSocket 每隔几秒作 SSE 查询问一下进度,这样 UI 才能不卡顿,还能顺便画个进度条。
  • 开发时的跨域拦截 前后端分离的经典保留曲目。前端开发服务器跑在一个端口,后端跑在另一个端口,浏览器默认把这种串门当成黑客攻击给拦了。解决办法倒不难,在 FastAPI 里配好中间件,给前端放行就行。
  • 终极地狱:Python 环境打包 这是最让人头秃的一集。把前端界面打包成 exe 很容易,但怎么把庞大的 Python 环境、几十个乱七八糟的依赖包、甚至还要带着厚重的显卡驱动库,一起塞进这个安装包里?目前只能靠类似 PyInstaller 这样的工具硬啃,顺便在 Electron 启动的时候用脚本偷偷把后端服务唤醒,关软件的时候还得记得杀掉后台进程,不然电脑迟早卡死。
  • 长期维护的性能优化 这个软件一旦跑起来,动辄产生海量的训练日志、中间权重文件和切片缓存。如果不做自动清理和 PostgreSQL 数据库的定期维护(比如清理膨胀的死元组和历史记录),用户的硬盘迟早被撑爆。另外,庞大的前端视图库和 Node.js 进程跑久了容易产生内存泄漏,如何设计优雅的垃圾回收和重启机制,是后期必须面对的硬骨头。

Sect. 5 展望未来 (画饼时间)

既然是做产品,目光总得放长远一点。以下是排在任务清单(或者说梦里)的几个终极目标:
  • 支持预训练: 目前系统更多还是在做下游任务。未来的大饼是支持无监督或自监督的预训练(当然是在用户有合适的资源训练的时候支持)。毕竟医疗数据标注太贵了,让系统自己去啃海量的无标签切片,训出一个强悍的病理 Foundation Model,这才是真的降维打击。
  • 缓解 Agent 乱讲话的问题: Agent 虽然聪明,但大模型骨子里“一本正经胡说八道”的幻觉毛病依然存在。在医疗科研这种严谨领域,如何引入强大的 RAG(检索增强生成)和医学知识图谱,让 Agent 写的每一段分析、每一行代码都有迹可循,是接下来的核心难点。
  • 类似 HuggingFace 的社区建设: 既然医院的隐私数据绝对不能出内网,那就直接搞一个病理界的专属社区,用户可以在本地利用自己的私有数据训练模型,然后只把“模型权重”或“Agent 提示词工作流”分享或交易到云端社区。做到“数据不动,模型出去”,保护隐私的同时,大家还能一起推进全人类的医疗 AI 进度。
 
 

Appendix. A 术语

我之前从来没有入门过 full-stack development, 请你能够从 B/S 架构的基本名词开始,逐步介绍一些概念吗?
Gemini 如是说:
B/S 架构 指的是 Browser/Server(浏览器/服务器)架构。简单来说,就是用户只需要一个浏览器(比如 Chrome、Edge),不需要下载专门的客户端软件,就能访问和使用的系统(比如淘宝网页版、各种网站后台管理系统)。
为了快速建立直觉,我们可以把 B/S 架构想象成一家餐厅。下面我为你梳理了全栈开发中最核心的名词,并用餐厅运作的方式来解释它们:

一、 前端(Frontend)—— 餐厅的大堂 / 顾客看到的样子

前端是运行在用户浏览器(Browser)上的代码,主要负责展示内容和与用户交互。
  • HTML (超文本标记语言): 网页的“骨架”。就像餐厅里的桌椅板凳、墙壁结构。它决定了网页上哪里是标题,哪里是图片。
  • CSS (层叠样式表): 网页的“皮肤”。就像餐厅的装修、灯光、桌布颜色。它负责把网页打扮得漂亮(排版、颜色、动画)。
  • JavaScript (JS): 网页的“肌肉”。就像餐厅里的各种互动,比如你按下桌上的服务铃,铃会响。JS 让网页“动”起来,比如点击按钮弹出窗口、轮播图滚动。
  • 前端框架 (Framework): 比如 Vue.jsReact。你可以把它们理解为“精装修套餐”或者“预制菜”,它们提供了一套现成的工具和规则,让你不用从零开始写代码,能更快地建好一个复杂的网页。

二、 后端(Backend)—— 餐厅的厨房 / 幕后的处理中心

后端是运行在服务器(Server)上的代码,用户看不见它,但它负责处理真正的业务逻辑。
  • Server (服务器): 其实就是一台24小时开机、连着互联网的超级电脑。用来接收和处理大家发来的请求。
  • 后端语言: 比如 Java、Python、Node.js、Go。这就是大厨们做菜的手艺和流程,用来写“如何计算购物车总价”、“如何验证密码是否正确”的逻辑代码。
  • API (应用程序接口): 这是前后端沟通的“桥梁”。你可以把它完美地想象成餐厅的“服务员”。你在前端(大堂)点击了“查看订单”,前端就会叫服务员(API)去后端(厨房)拿数据,后端查好后,再由服务员(API)把数据端给前端显示出来。

三、 数据库(Database)—— 餐厅的仓库 / 数据的家

后端(厨房)在处理业务时,需要有地方存放和读取原材料(数据)。
  • Database (DB / 数据库): 专门用来永久保存数据的地方,比如用户的账号、密码、发布的文章、商品列表。
  • 关系型数据库 (SQL): 比如 MySQL。就像是有着严格格式的 Excel 表格,数据一行一行、一列一列排列得非常规整,适合存订单、用户信息。
  • 非关系型数据库 (NoSQL): 比如 Redis 或 MongoDB。类似于一个个储物箱,存放方式更自由、读取速度极快,通常用来存一些需要秒开的数据(比如网页的热门排行榜)。

四、 网络通信(Network)—— 沟通的规则

大堂和厨房之间是如何喊话的?
  • HTTP / HTTPS: 浏览器和服务器之间互相传递信息的“语言规则”。加了 "S" (Secure) 代表信息经过了加密,更安全。
  • Request (请求) & Response (响应): 你在浏览器输入网址按下回车,或者点击“登录”按钮,就是向服务器发出了一个 Request (请求);服务器处理完,把网页画面或登录成功的信息传回给你,这就是一次 Response (响应)
  • JSON: 一种轻量级的数据打包格式。前端和后端在传递数据时,通常会把信息打包成这种格式,因为它体积小且双方都能轻松读懂。
 

什么是 Electron?(把餐厅开到顾客家里)

在传统的 B/S 架构里,顾客(用户)必须走到“美食城”(打开浏览器),才能进入你的“餐厅”(网页)。
Electron 就像是一辆“全副武装的美食车”: 你把你写的前端代码(大堂),加上一个隐形的迷你浏览器(Chromium核心),再配上一个本地运行环境(Node.js,类似于迷你厨房),全部打包在一起,做成一个独立的 .exe(Windows) 或 .dmg(Mac)安装包。
用户下载安装后,只需双击图标,界面就打开了。用户以为自己用的是一个传统的电脑软件,但实际上,他是在看一个被包装起来的网页!

总结一下全栈 B/S 架构的流程: 你在浏览器(B)用 HTML/CSS/JS 做了一个精美的界面 ➡️ 用户点击按钮发起 HTTP 请求 ➡️ API(服务员) 把请求送达 ➡️ 服务器(S)里的后端代码接收请求,去数据库里翻找数据 ➡️ 后端把数据打包成 JSON,作为响应交给 API ➡️ API 送回前端,前端用 JS 拆开数据,展示给用户看。
 

Appendix. B 系统总体架构

这个没什么好说的,况且写的太详细也不符合这篇心得体会的定位。故简要列出如下:
层级
技术
前端
Electron + React + TypeScript + Vite
后端
Python + FastAPI + SQLAlchemy
数据库
PostgreSQL
AI
PyTorch + timm + transformers
WSI
ASlide (OpenSlide wrapper) + OpenSeadragon
 
Prev Post
2019 年度总结
Next Post
2025 年终总结

Comments
Loading...