File Viewer 最近解决了什么:Office 图表、50 万行文本、缩略图和漫画模式
File Viewer 最近解决了什么Office 图表、50 万行文本、缩略图和漫画模式File Viewer 过 1000 Star 时我写过一次阶段复盘。最近公开仓又走到 1,406 Star版本也从 2.1.23 推进到了 2.1.27。不过这次更想聊的不是数字而是几个真实问题终于有了更完整的答案Word 和 Excel 里的图表怎么还原几十万行文本怎么稳定打开文件列表怎么在浏览器里批量生成缩略图以及压缩包里的漫画怎样直接进入阅读模式。1. Office 图表不再只是一个空白位置企业文档里的图表经常不是装饰而是报表和结论本身。以前打开带图表的 DOCX、XLSX文字和单元格能出来但图表可能缺失、位置不对或者只剩一块空白。最近基于真实 issue 样本补上了两条链路DOCX 里的图表关系、数据和样式解析以及 XLSX 工作表里的图表解析与浏览器端渲染。修复后折线图、柱状图能和正文、表格一起呈现并且用对应样本加入了自动化回归。这类修复的价值很直接用户在审批页、知识库或附件中心里看到的不再是“文档大概能开”而是能读到真正影响判断的数据。2. 50 多万行文本靠虚拟滚动保持稳定日志、代码导出、数据转储经常大得离谱。一次性把几十万行节点塞进 DOM页面会卡住搜索和高亮也会跟着失去响应。新的大文本链路按可视区域渲染只保留当前视口附近的内容。测试样本达到 520,002 行仍然可以滚动到末尾并定位搜索结果代码高亮也会在超大文件下主动关闭优先保证内容可读和交互稳定。这里解决的不是“能不能把文本塞进页面”而是打开之后还能不能继续工作。3. 深色模式开始覆盖真正的渲染内容主题切换最容易出现一种假完成外层工具栏变黑了文档区域、搜索浮层或具体 renderer 仍然停在浅色。这轮继续统一了 light、dark、auto 三种主题的传递方式并补了工具栏、代码文本、OFD 等链路的验证。宿主系统切换主题时预览器可以跟随变化同时保留文档本身需要的可读对比度。4. 文件列表可以直接生成“首屏缩略图”附件中心和知识库还有一个常见问题列表里如果只有文件名用户很难快速判断内容但为了缩略图逐个完整打开文件又会浪费时间和内存。2.1.27 新增了独立的file-viewer/thumbnail。它会优先复用 EPUB、OOXML、OpenDocument、XMind 等文件内嵌的封面或缩略图没有内嵌图时再走 renderer 原生输出或首页捕获。批量任务有固定并发流式模式可以边生成边上传不会把所有 Blob 一起堆在内存里。pnpmaddfile-viewer/thumbnail file-viewer/preset-allimport{createFileViewerThumbnailGenerator}fromfile-viewer/thumbnailimportallPresetfromfile-viewer/preset-allconstgeneratorcreateFileViewerThumbnailGenerator({viewerOptions:{preset:allPreset},concurrency:2,})constresultawaitgenerator.generate({file,filename:file.name},{width:320,height:240,format:webp},)awaitupload(result.blob)awaitgenerator.destroy()这项能力更适合文件柜、素材库和附件检索页预览组件不只负责“点开后看”也开始服务“打开前先判断”。5. CBZ / CBR 不再按普通压缩包展示CBZ 和 CBR 本质上是图片压缩包但用户期待的是阅读器而不是目录树。现在这两类文件会自动进入漫画模式图片按路径自然排序打开时直接显示封面并提供翻页、页码、方向键、PageUp/PageDown、Home/End、空格键和触摸滑动。解包仍然复用原来的 Worker、RAR/ZIP fallback、密码、缓存和体积限制没有另起一套高风险逻辑。这个改动也说明项目的方向正在变化格式支持不能停在“识别扩展名”还要尽量贴近用户对这种文件的真实操作方式。接入仍然保持轻量如果只是先在 Vue 3 项目里跑起来可以直接使用 full 包pnpmaddfile-viewer/vue3-fullscript setup langts import FileViewer from file-viewer/vue3-full /script template FileViewer url/files/report.docx :options{ theme: auto } styleheight: 720px / /templateVite 项目还可以让插件自动发现已安装的 preset并复制 Worker、WASM、字体和 vendor 资源import{defineConfig}fromviteimport{fileViewerRenderers}fromfile-viewer/vite-pluginexportdefaultdefineConfig({plugins:[fileViewerRenderers({copyAssets:true})],})这段进展意味着什么从 2.1.23 到 2.1.27变化不只是又多了几个格式名Office 预览开始补齐影响业务判断的图表内容。大文件从“勉强打开”推进到可滚动、可搜索、可定位。主题和工具栏继续跨 renderer 收口。缩略图把能力延伸到了文件列表和素材管理。CBZ / CBR 开始按内容类型提供更自然的阅读体验。npm 资产复制、示例工程和公开发布校验也在继续加固。项目当前仍覆盖 206 个扩展名、24 条预览链路核心坚持浏览器端解析、按需加载和私有化部署。数字是范围真正决定能不能进业务系统的还是这些具体问题有没有被逐个处理。项目地址flyfish-dev/file-viewer接下来会继续围绕真实文件样本把 Office、PDF、OFD、CAD、压缩包和移动端这些高频链路做得更稳。