20:"$Sreact.view_transition" 21:I[9754,["/_next/static/chunks/2t36f5p4pjzlb.js","/_next/static/chunks/1gyqeidjm5eoa.js","/_next/static/chunks/0_fjnxc4tt_l_.js","/_next/static/chunks/1ymt1shyhmu-4.js","/_next/static/chunks/3kv2zf0i7s2wc.js","/_next/static/chunks/1vs_3g_g75zmk.js","/_next/static/chunks/2g4dh802s8oz3.js","/_next/static/chunks/1bc3f0shukf1j.js","/_next/static/chunks/192kgs9v_t14j.js","/_next/static/chunks/0z6pw0v5c_lx5.js","/_next/static/chunks/08r60e6icmtkc.js","/_next/static/chunks/3trx6c0i7_x-3.js","/_next/static/chunks/40sro5bzp9bi_.js","/_next/static/chunks/1wgf3tk38y6cf.js"],"ProjectDetail"] 22:T50c8, Stackflow · 移动优先的堆栈导航框架

移动优先 · 堆栈导航

Stackflow，把导航叠成看得见的堆栈。

每一次导航，都是把一层屏幕压进堆栈；每一层都记得自己的滚动位置。要返回，就把它弹起来。所见即是你 push 进去的堆栈，混生应用与 WebView 的原生导航手感。

开始使用在 GitHub 上浏览

home

编辑首条内容后的列表流
延续上一条屏幕的条目

offset 420

list

同一列表，滚动被原样保留，切换回去再看仍是这里

offset 192

active

在最上层一层，导航就发生在这里。向右滑动即可逐层返回

offset 0

(01) 机制

push 压入，pop 弹起

对移动开发者来说，堆栈导航是一种再熟悉不过的手感：打开新页推入一层，返回时把最上层弹走。Stackflow 把这种 UX 原样搬进浏览器与 WebView，界面不再是层层覆盖的表单向导，而是可预期、可保持状态的屏幕堆栈。

每一层屏幕独立存在，切换时拥有自然的过渡动画，并带上一套 iOS 风格的滑动返回。整个堆栈的来龙去脉一目了然，用户不会在页面里迷失方向。

从左右两条轴线向上读：从底部最活跃的屏幕一路叠到最深一层的入口，push 与 pop 就是这条纵向线上最基本、也最完整的两个动作。

(02) 状态

滚动状态，逐层保留

网页导航最磨人的地方，是返回时列表跳回顶部、上下文丢失。Stackflow 的答案是：每一层屏幕都保存自己的精确滚动位置。

右侧每条色柱代表一层屏幕，柱内填充高度即那一层的滚动偏移。你在详情页滑到一半，切回列表，它仍停在原处——offset 始终记得你读到哪。

这部分状态随堆栈生命周期被稳定保留，跨过渡不丢失，配合 iOS 风格手势，逐层弹回也顺滑如初。

(03) 扩展

插件调度，嵌进生命周期

生命周期管线

enter

mount

render

leave

插件 · 在两个阶段之间注入

插件 · 拦截过渡前后

导航不是一个黑盒，而是一条可以被打断的生命周期管线。插件接口让你能够在这些阶段之间自由注入任意扩展，不必改动框架核心。

无论是埋点上报、动画增强还是状态同步，都能如同装配线一般，稳稳地嵌进屏幕推进与离开的间隙。

正是因为核心与集成层分离，这份扩展能力才不会污染框架本体——要加什么，就挂在哪两个生命点之间。

(04) 集成

React 之外，也留给服务端

Stackflow 把核心逻辑与集成层清晰分开：核心只负责纯导航状态，集成层负责与前端框架绑定。

当前原生支持 React，同时通过 renderToString 支持服务端渲染，让首屏可以被完整预渲染。

这套分离也意味着，将来可以尝试接入其它前端框架，而无需重写那套核心堆栈。

@stackflow/core

纯逻辑核心，只管堆栈与生命周期状态，不依赖任何视图层。

@stackflow/react

React 绑定层，把核心堆栈渲染成实际可交互的屏幕。

服务端渲染

经由 ReactDOMServer.renderToString 渲染完整首屏。

可扩展

核心与集成解耦，为其它前端框架留出集成空间。

上手，只需一条命令

把配置、核心与 React 绑定三件套装进项目，即可开始搭建你自己的屏幕堆栈。

yarn add @stackflow/config @stackflow/core @stackflow/react

STEP 1安装组件

用上面的命令一次性引入核心与 React 集成。

STEP 2注册屏幕

把要参与导航的屏幕注册进堆栈栈长。

STEP 3开始导航

push 进新层，pop 弹回旧层，滚动自动为你保留。

(05) 许可

开放，可长期依赖

TypeScript MIT 许可移动优先

前往 stackflow.so 由 daangn 团队维护 · 源码基于 MIT 许可开放

Stackflow · 移动优先的堆栈导航框架

23:T5114, Stackflow · mobile-first stack navigation

Mobile-first · stack navigation

Stackflow turns navigation into a pile you can see.

Every navigation drops one screen onto a growing stack; every layer remembers exactly where you scrolled. Pop a layer off to go back. What you see is precisely what you pushed — native-feeling stack navigation for hybrid apps and webviews.

Get started Browse on GitHub

home

the original feed, still full
and exactly where you left it

offset 420

list

the same list, kept in place;
come back and it is still here

offset 192

active

navigation happens on the top layer.
Swipe right to unwind the pile

offset 0

(01) Mechanism

Push in, pop back

Stack navigation is a feel every mobile developer already knows: open a page and a new layer is pushed on, hit back and the top one pops off. Stackflow brings that same feel into the browser and webview, so the interface is not a hidden chain of pages but a predictable, stateful stack of screens.

Each screen lives on its own layer with smooth transitions, plus an iOS-style swipe-back gesture. Users always know where they are in the stack and never lose their place.

Read the two arrows as rails: push walks downward into the next layer, pop peels back toward the entry. The two actions make a complete, vertical story of your navigation.

(02) State

Scroll state, kept per layer

The most grinding habit of web navigation is returning to a list that snaps back to the top, losing your context. Stackflow answers by letting every layer remember its exact scroll position.

Each tinted column on the right is one screen; the fill height is that layer's scroll offset. Read halfway down a detail page, switch back to the list, and it still sits exactly where you left it.

That state is preserved across the stack's lifecycle and rides through transitions untouched — so the whole unwinding still feels smooth, gesture by gesture.

(03) Extension

Plugins, slotted between lifecycles

lifecycle pipeline

enter

mount

render

leave

plugin injected between two stages

plugin, before and after a transition

Navigation is not a black box; it is a lifecycle pipeline you can step into. The plugin interface lets you inject any extra behaviour between these stages, without touching the framework core.

Whether you want analytics, animation work, or state synchronisation, it hides neatly into the gaps between a screen sliding in and another sliding out.

Because the core is separated from the integration layer, that extension power never pollutes the framework itself — you just decide which two life point the behaviour belongs between.

(04) Integration

React today, room for the server

Stackflow draws a clean line between core logic and the integration layer: the core owns pure navigation state, the integration binds it to a frontend framework.

React is supported natively today, and server-side rendering is available through renderToString, so a first screen can be fully pre-rendered.

That same separation means the core stack can be bound to other frontends later, without rewriting the mechanics underneath.

@stackflow/core

Pure logic, owning the stack and lifecycle state with no view dependency.

@stackflow/react

The React binding that renders that core into interactive screens.

Server rendering

A full first screen rendered via ReactDOMServer.renderToString.

Extensible

Decoupled core and integration leave room for other frontends.

Start with a single command

Install the config, core and React binding together, then begin composing your own stack of screens.

yarn add @stackflow/config @stackflow/core @stackflow/react

STEP 1Install

Pull in the core and the React integration with one command.

STEP 2Register screens

STEP 3Navigate

Push new layers and pop back to old ones — scroll is kept for you.

(05) License

Open, and safe to lean on

TypeScript MIT license mobile-first

Visit stackflow.so maintained by daangn · source released under MIT

Stackflow · mobile-first stack navigation

a:[["$","$20",null,{"enter":{"secondary-forward":"secondary-forward","secondary-back":"secondary-back-enter","default":"none"},"exit":{"secondary-forward":"secondary-forward","secondary-back":"secondary-back-exit","default":"none"},"update":{"secondary-forward":"secondary-forward","secondary-back":"secondary-back-update","default":"none"},"default":"none","children":["$","$L21","cmt2u9c6u002o14nxtjucsnaw:zh-CN:beautified",{"project":{"id":"cmt2u9c6u002o14nxtjucsnaw","slug":"daangn-stackflow","name":"stackflow","description":"移动优先的堆栈导航器框架，带可组合插件系统","authorName":"daangn","authorVerification":{"verified":false,"verifiedAt":null},"category":"development_tools","subcategory":"data_ai_tools","experienceUrl":"https://stackflow.so/","qualityScore":86,"featured":false,"officialSite":null,"views":{"original":{"available":true},"official":{"available":false,"reason":"disabled_by_policy"},"beautified":{"available":true,"reason":null},"defaultView":"beautified"},"beautifiedView":{"revisionId":"cmt2up5lr001yj9djixwdjiza","kind":"artifact","artifact":{"schemaVersion":"localized-static-html-v4","kind":"static_html","locales":["zh-CN","en"],"defaultLocale":"zh-CN","documents":{"zh-CN":"$22","en":"$23"},"designDirections":{"schemaVersion":"dodot-design-directions-v1","directions":[{"id":"screen-pile","name":"Screen Pile","projectMetaphor":"Each navigation action drops one translucent screen layer onto a growing pile; every layer remembers its own scroll. The pile is the framework: what you see is exactly the stack you pushed.","signatureVisual":"A fan of offset, translucent screen cards, each carrying its own thin scroll track, slightly rotated and stacked in depth with a single semantic foreground layer on top.","heroGeometry":"Vertical axis of overlapping translucent panels receding in perspective up-right, foreground panel holds the title, background panels carry the stack's scroll positions.","sectionSequence":["hero pile","mechanism push/pop anatomy","scroll-state preservation","plugin lifecycle pipeline","integration matrix (react/ssr)","getting started","license & signal strip"],"surfaceModel":"Layered glass: each screen panel a frosted sheet with a faint cast shadow in the stack direction, the topmost panel nearer and brighter, rear panels progressively dimmed.","palette":"Cool stack: near-black ink base, frosted white panels at 3 opacity steps, a single warm amber accent for the active/top layer and swipe-back gestures.","typography":"Condensed tech grotesque for labels and layer names, with a generous line-height serif-style reading type contrast for the few prose passages.","desktopComposition":"Large left-stacked perspective screen pile as hero, headline inset on the foreground panel, supporting text to the right column, section separators as thin stack edges.","mobileTransformation":"The pile collapses to a single full-bleed foreground card that the content scrolls through; rear layers shrink to compact edge tabs peeking behind top and bottom.","mediaStrategy":"No product screenshots. All visuals are derived geometric screen layers drawn in CSS; each layer labelled with a lifecycle event to avoid fake UI.","forbiddenPatterns":["three metric cards under a slogan","generic feature-card wall","phone or browser mocking shells","decorative glow replacing the pile concept"],"compositionFingerprint":"overlapping translucent screen-pile with per-layer scroll tracks + warm active-top accent"},{"id":"lifecycle-rail","name":"Lifecycle Rail","projectMetaphor":"Navigation is a timeline of lifecycle events; plugins latch onto the rail between events and inject behaviour. The project's arc is a horizontal assembly line of effects.","signatureVisual":"A horizontal rail of lifecycle nodes (enter/mount/leave) threaded by a continuous animated line, with plugin blocks shown nesting between adjacent nodes as injectable additions.","heroGeometry":"Long horizontal axis with equally spaced lifecycle nodes; plugin capsules hang off the rail between nodes like leaves from a stem.","sectionSequence":["rail hero with lifecycle line","node anatomy (single transition)","plugin injection between lifecycles","core/integration split","SSR render pass","start building"],"surfaceModel":"Flat technical schematic: hairline borders, no elevation, tonal fills distinguish core (neutral) from plugin (accent), connectors drawn as thin ruled lines rather than shadows.","palette":"Schematic print: warm off-white paper, ink-blue lines, a single signal-orange for plugin injections, dark slate for live nodes.","typography":"Mono-spaced label type for lifecycle and node names, paired with a neutral geometric sans for reading — reads like an annotated spec sheet.","desktopComposition":"Full-width horizontal rail dominating the hero, lifecycle nodes horizontally tiled, plugin capsules below the rail, explanation paragraphs arranged in an annotation ledger beside each node.","mobileTransformation":"The horizontal rail rotates to a vertical spine that the user scrolls; nodes become stacked stops along the edge with plugin capsules to the side.","mediaStrategy":"No product screenshots; the rail and nodes are drawn geometric schematic marks. Text labels are real lifecycle terms, never fake UI controls.","forbiddenPatterns":["hero slogan over metric cards","feature-card wall","editor or terminal shell","particles/grid background as filler"],"compositionFingerprint":"horizontal lifecycle rail with plugin capsules nested between nodes + mono annotation ledger"},{"id":"scroll-vector-field","name":"Scroll Vector Field","projectMetaphor":"What distinguishes stack navigation is preserving each screen's exact scroll position. The page is a field of independent scroll columns, each one holding its 'frozen' state, converging to the framework core.","signatureVisual":"Multiple parallel vertical scroll columns, each filled to a different offset, their scrollbars 'frozen' in place, all feeding a central stack node that preserves those states.","heroGeometry":"A grid of parallel vertical scroll strips converging toward a single central node, each strip tinted to a distinct preserved offset.","sectionSequence":["scroll field hero","independent scroll preservation","state kept across transitions","plugin pipeline","react integration","deploy a stack"],"surfaceModel":"Data-state abstraction: flat tinted strips over a quiet ground, the only 'depth' is offset between strips, central node rendered as a bounded state cell.","palette":"Cool data set: deep indigo ground, three saturated column tints (amber, teal, violet) tied to preserved states, white on dark type.","typography":"Wide-tracked uppercase data labels for columns, with a clear humanist sans for body; numbers use a tabular variant to align offsets.","desktopComposition":"Six to eight parallel scroll strips tiled at a slight angle across the hero, each showing a frozen offset reading, central stack node converging the field, headline overlaid on the right third.","mobileTransformation":"Strips collapse to a single dominant scroll column the user actively scrolls, while ghost strips at the edges hint at the frozen neighbours.","mediaStrategy":"No product screenshots; scroll positions are drawn as filled column proportions and offset numerals — an honest representation of scroll-state preservation, not UI mockery.","forbiddenPatterns":["three stat cards","generic feature wall","browser/phone shell","glow or grid texture replacing the offset concept"],"compositionFingerprint":"parallel frozen scroll columns converging to one preserved-state node + offset tabular numerals"}],"selectedDirectionId":"screen-pile","selectionRationale":"The screen-pile direction most directly expresses Stackflow's core mechanism: pushing and popping screens as physical, depth-stacked layers that each preserve their own scroll state. It is the strongest evidence fit because the readme explicitly centres stacked screens, kept scroll state, transitions, and iOS-style swipe back — all of which the pile geometrically realises. It keeps a genuinely mobile-first reading (collapse to a single foreground card) and avoids the marketing-hero / three-card defaults. The lifecycle-rail and scroll-vector-field directions are strong alternates that foreground the plugin pipeline and state preservation respectively, but the pile best unifies stack + scroll + transition into one signature visual and is least similar to generic library landing pages. antiTemplateContext is empty, so no fingerprint/section-sequence collision risk."},"designBrief":{"schemaVersion":"dodot-design-brief-v1","selectedDirectionId":"screen-pile","projectMetaphor":"Each navigation action drops one translucent screen layer onto a growing pile; every layer remembers its own scroll. The pile is the framework: what you see is exactly the stack you pushed.","signatureVisual":"A fan of offset, translucent screen cards, each carrying its own thin scroll track, slightly rotated and stacked in depth with a single semantic foreground layer on top.","compositionFingerprint":"overlapping translucent screen-pile with per-layer scroll tracks + warm active-top accent","heroGeometry":"Vertical axis of overlapping translucent panels receding in perspective up-right, foreground panel holds the title, background panels carry the stack's scroll positions.","sectionSequence":["hero pile","mechanism push/pop anatomy","scroll-state preservation","plugin lifecycle pipeline","integration matrix (react/ssr)","getting started","license & signal strip"],"surfaceModel":"Layered glass: each screen panel a frosted sheet with a faint cast shadow in the stack direction, the topmost panel nearer and brighter, rear panels progressively dimmed.","palette":"Cool stack: near-black ink base, frosted white panels at 3 opacity steps, a single warm amber accent for the active/top layer and swipe-back gestures.","typography":"Condensed tech grotesque for labels and layer names, with a generous line-height serif-style reading type contrast for the few prose passages.","desktopComposition":"Large left-stacked perspective screen pile as hero, headline inset on the foreground panel, supporting text to the right column, section separators as thin stack edges.","mobileTransformation":"The pile collapses to a single full-bleed foreground card that the content scrolls through; rear layers shrink to compact edge tabs peeking behind top and bottom.","mediaStrategy":"No product screenshots. All visuals are derived geometric screen layers drawn in CSS; each layer labelled with a lifecycle event to avoid fake UI.","evidencePlan":["hero: name stackflow, mobile-first stack navigator value line, real CTA, and the translucent screen-pile signature visual all visible within five seconds","mechanism push/pop anatomy presents the stacked-screens + transition facts from the readme","scroll-state preservation section shows the preserved-scroll and iOS-style swipe-back evidence","plugin lifecycle pipeline section shows the composable plugin injection between lifecycles evidence","integration matrix (react/ssr) shows the core/integration separation and React + server-side rendering evidence without inventing metrics"],"localeContract":{"zh-CN":"使用概括式中文：堆栈导航、插件系统、React 集成、SSR 支持等提示词需用自然中文表述，避免生硬直译；保持简体中文排版密度适配。","en":"Natural English; the shared section sequence and brief apply, with copy density and wording kept natural for English readers."},"forbiddenPatterns":["three metric cards directly under a generic slogan","repeated feature-card wall that could accept any project's copy","phone, browser, terminal, editor, or dashboard shells without direct project evidence","decorative glow, grid, or particle field used as a substitute for the screen-pile idea","fake tabs, search boxes, switches, controls, charts, customer logos, or testimonials","desktop columns merely stacked on mobile without recomposition","any fingerprint, signature visual, or section sequence listed in antiTemplateContext"]},"visualReview":{"schemaVersion":"dodot-automated-design-review-v1","status":"approved","summary":"页面忠实实现了选中方向 screen-pile：Hero 呈现由多层半透明、带独立滚动轨道与偏移读数的屏幕卡片堆叠而成的签名视觉，前景层持标题，符合 heroGeometry。全部事实（堆栈导航、滚动状态保留、过渡与 iOS 滑动返回、可组合插件生命周期、core/integration 分离、React 与 SSR renderToString、安装命令）均可回溯到 material 事实，无虚构指标。手机视为全屏前景卡片 + 后层收拢为边缘小页签的重新组织而非简单堆叠。双语章节结构完全对齐、文案自然不等价于逐字翻译。未回退到通用 Hero/三卡/卡片墙，无设备外壳、装饰性渐变网格或假控件。未查看截图，仅依据源码与 QA 布局指标判定。","checks":{"projectFit":{"passed":true,"evidence":"选中方向 screen-pile 被完整落实：Hero 三层半透明卡片（back-2/back-1/front）旋转、错位、渐进变暗，前景层持 h1，与 heroGeometry（垂直轴纵深透视、前景持标题）与 signatureVisual 一致。章节顺序 hero→push/pop 机制→滚动状态→插件管线→集成矩阵→上手→许可，与 brief sectionSequence 完全对应。"},"evidenceBound":{"passed":true,"evidence":"机制/状态/插件/集成文案逐条对应 material.summary.claims：堆栈屏幕与滚动状态保留、iOS 滑动返回、插件在生命周期间注入、core 与 integration 分离、React + ReactDOMServer.renderToString SSR。安装命令 'yarn add @stackflow/config @stackflow/core @stackflow/react' 精确匹配 readme.commands。caveats（仅 React、Next.js 不推荐）未虚增。滚动列 offset 数字（420/192/1320/640/2480/890）为媒体策略允许的示意偏移，非伪指标。"},"signatureVisual":{"passed":true,"evidence":"签名视觉真实存在于 Hero：多层旋转半透明屏幕卡叠加、每层带独立 3px 滚动轨道与 thumb、底部偏移读数，单层暖色 amber 前景层顶端强调，与 compositionFingerprint 'overlapping translucent screen-pile with per-layer scroll tracks + warm active-top accent' 逐字吻合。"},"mobileTransformation":{"passed":true,"evidence":"max-width:700px 下 grid 全部收敛为 1 列，pile 由绝对定位转为相对流式前景卡片，.layer.front 全宽前景、后层收拢为边缘页签（back-2 在 ≤420px 隐藏，back-1 错位边缘）。columns、steps、chip-wall 重排，signal-wrap 改纵向。这是重构而非简单堆叠；overflow-x 未越界（scrollWidth=clientWidth 390，QA 通过）。"},"localeParity":{"passed":true,"evidence":"zh-CN 与 en 均 7 个 section、同 sectionSequence、同 h2/节点/chip/step 名称；layer 描述、plug-cap、lede 等均按其语言自然重写（如 zh '把导航叠成看得见的堆栈' vs en 'turns navigation into a pile you can see'），非逐字机械直译，概览式中文排版密度适配。"},"antiTemplate":{"passed":true,"evidence":"未出现三卡/卡片墙/设备外壳/终端编辑器壳/装饰性网格或光晕替代。叠层为带生命周期标签的抽象几何层，非 phone/browser mockup；集成矩阵为 @stackflow/core 与 @stackflow/react 的真实包名映射而非通用 feature wall。antiTemplateContext 为空，无指纹冲突。"},"noFakeUi":{"passed":true,"evidence":"无假页签、搜索框、开关、图表、客户 logo、证言。视觉抽象全部配语义标签（home/list/active、enter/mount/render/leave、ENTRY/MAIN/DETAIL/TOP）；安装命令为真实命令，.cmd 为代码块非假控件。QA 两语言桌面/手机 fakeControlCount=0、brokenImageCount=0。"}},"issues":[]},"repairEvidence":[],"provenance":{"executor":"opencode","model":"deepseek/deepseek-v4-flash","opencodeVersion":"1.1.58","promptVersion":"dodot-showcase-deepseek-v4","inputHash":"ac89f9ed85b04ef963a231af6f856a560c7ac1df9e98d09f86d1cabe5986e8e0","artifactHash":"4499f09736bb9c3a0424c832ad4feadcb3d09eeccf5a8f2abc24c44b8e368994","designSkill":"dodot-showcase-design"},"qaEvidence":{"zh-CN":[{"viewport":"desktop","passed":true,"localePassed":true,"metrics":{"language":"zh-CN","h1Count":1,"h2Count":6,"sectionCount":7,"textLength":1712,"cjkCount":1011,"latinLetterCount":363,"scrollWidth":1280,"clientWidth":1280,"scrollHeight":4245,"h1Top":159,"bottomInset":157.390625,"brokenImageCount":0,"missingAltCount":0,"fakeControlCount":0,"emptyLinkCount":0},"screenshotHashes":{"top":"b46ac290f018ee44bf794517332eb2bf297463830b95c93116c03b38feeae962","middle":"9e6e1359aa38b17928ad872cc62c5d8addc111c3c4db51885bd87cbc42259fb5","bottom":"840b3ea0ae1d56fa08a3ebdbbe00e362a9bebf7461fdb1662e4fee86b978f008"},"consoleErrors":[],"networkRequests":[]},{"viewport":"mobile","passed":true,"localePassed":true,"metrics":{"language":"zh-CN","h1Count":1,"h2Count":6,"sectionCount":7,"textLength":1673,"cjkCount":990,"latinLetterCount":353,"scrollWidth":390,"clientWidth":390,"scrollHeight":5904,"h1Top":135,"bottomInset":156.953125,"brokenImageCount":0,"missingAltCount":0,"fakeControlCount":0,"emptyLinkCount":0},"screenshotHashes":{"top":"b56a9b215df2ee259a2a565c84af9692e1067640318d5b83af3ef4bd8d50a2e1","middle":"899562fafe2bdfce2986d88cb99ac9b8bf679ee5707bab008fcd40df56109d82","bottom":"75d4ae6d867c3f2bec2727a55f7477ff1b8b5b60f4bc7309507ff816c4b89046"},"consoleErrors":[],"networkRequests":[]}],"en":[{"viewport":"desktop","passed":true,"localePassed":true,"metrics":{"language":"en","h1Count":1,"h2Count":6,"sectionCount":7,"textLength":4102,"cjkCount":0,"latinLetterCount":3260,"scrollWidth":1280,"clientWidth":1280,"scrollHeight":4319,"h1Top":156,"bottomInset":154.34375,"brokenImageCount":0,"missingAltCount":0,"fakeControlCount":0,"emptyLinkCount":0},"screenshotHashes":{"top":"cf22c3f1f24fd9134105b06079f5b0c2a7b83335bb34784aed118dcb689cdca3","middle":"b91b59e498c1c74288c26a1d55304029cf05bf5f4dfe95660d3310b5b0d1b7b1","bottom":"3f2bd1422059e2d5507f710a172b0adba43c8081a0b3327870bd3d4bd29ecec1"},"consoleErrors":[],"networkRequests":[]},{"viewport":"mobile","passed":true,"localePassed":true,"metrics":{"language":"en","h1Count":1,"h2Count":6,"sectionCount":7,"textLength":4026,"cjkCount":0,"latinLetterCount":3202,"scrollWidth":390,"clientWidth":390,"scrollHeight":6630,"h1Top":132,"bottomInset":154.453125,"brokenImageCount":0,"missingAltCount":0,"fakeControlCount":0,"emptyLinkCount":0},"screenshotHashes":{"top":"9a2a4b67cb07452f921ae5e945bce523744442a58afbd3ac97f5cadc08a34b6f","middle":"21d74f89cc5ee66c79e1b610ba000f5cd3434550504a0e5284b76feb076c0b1f","bottom":"5ada95ceb93466f1e119d2eaca08713a24cf4798e3dbc99aa2a8c8b9dadfb1b4"},"consoleErrors":[],"networkRequests":[]}]}},"generatorVersion":"opencode-1.1.58:deepseek/deepseek-v4-flash:dodot-showcase-deepseek-v4","publishedAt":"2026-08-21T11:13:12.292Z"},"rawExtraction":{"projectRevisionId":"cmt2u9c8j002w14nxuetqekto","projectVersion":1,"sources":[{"canonicalKey":"github:daangn/stackflow","role":"primary","revisionVersion":1,"url":"https://github.com/daangn/stackflow"}],"facts":[{"key":"repository_owner","value":"daangn","evidence":[{"path":"repository.owner","excerpt":"daangn"}]},{"key":"repository_name","value":"stackflow","evidence":[{"path":"repository.name","excerpt":"stackflow"}]},{"key":"description","value":"🧱 Mobile-first stack navigator framework with composable plugin system","evidence":[{"path":"repository.description","excerpt":"🧱 Mobile-first stack navigator framework with composable plugin system"}]},{"key":"primary_language","value":"TypeScript","evidence":[{"path":"repository.language","excerpt":"TypeScript"}]},{"key":"license","value":"MIT","evidence":[{"path":"repository.license","excerpt":"MIT"}]},{"key":"topics","value":"framework, mobile, navigator, plugin, react, stack, system, typescript, webview","evidence":[{"path":"repository.topics","excerpt":"framework, mobile, navigator, plugin, react, stack, system, typescript, webview"}]},{"key":"source_count","value":"1","evidence":[{"path":"projectRevision.sources","excerpt":"github:daangn/stackflow"}]}],"taxonomy":{"category":"development_tools","subcategory":"data_ai_tools","confidence":0.65,"evidence":[{"path":"repository.description","excerpt":"🧱 Mobile-first stack navigator framework with composable plugin system"}]},"lifecycle":{"stage":"prototype","confidence":0.65,"evidence":[{"path":"readmeExcerpt","excerpt":"

$\"demo\"$ ![logo](./logo-light.svg#gh-light-mode-only) ![logo](./logo-dark.svg#gh-dark-mode-only) ![](https://img.shields.io/npm/v/@stackflow/core) ![](https://img.shields.io/npm/l/@stackflow/core) ![](https://img.shields.io/npm/dt/@stackflow/core) ![](https://img.shields.io/github/contributors/daangn/stackflow) ![](https://img.shields.io/github/last-commit/daangn/stackflow)

## I"}]},"userIntents":[{"slug":"build_software","label":"构建或改进软件","confidence":0.65,"evidence":[{"path":"repository.description","excerpt":"🧱 Mobile-first stack navigator framework with composable plugin system"}]},{"slug":"automate_work","label":"自动化工作流程","confidence":0.65,"evidence":[{"path":"repository.description","excerpt":"🧱 Mobile-first stack navigator framework with composable plugin system"}]},{"slug":"create_content","label":"创作内容或设计","confidence":0.65,"evidence":[{"path":"repository.description","excerpt":"🧱 Mobile-first stack navigator framework with composable plugin system"}]},{"slug":"analyze_data","label":"分析与理解数据","confidence":0.65,"evidence":[{"path":"repository.description","excerpt":"🧱 Mobile-first stack navigator framework with composable plugin system"}]},{"slug":"learn_explore","label":"学习与探索","confidence":0.65,"evidence":[{"path":"repository.description","excerpt":"🧱 Mobile-first stack navigator framework with composable plugin system"}]}],"readme":{"headings":["Introduction","Getting Started","Integration Examples","Contributors","License"],"commands":["yarn add @stackflow/config @stackflow/core @stackflow/react"]},"changeSet":[{"field":"authorName","beforeHash":"74234e98afe7498fb5daf1f36ac2d78acc339464f950703b8c019892f982b90b","afterHash":"801823776ffb98d6e5e625e6a82db433cef59c27d42427fd1ef66e6d65be9f45"},{"field":"description","beforeHash":"74234e98afe7498fb5daf1f36ac2d78acc339464f950703b8c019892f982b90b","afterHash":"e188584208b8eab0217368063768fbeb7e9ca525fa1c7b7acb13499b78166fae"},{"field":"experienceUrl","beforeHash":"74234e98afe7498fb5daf1f36ac2d78acc339464f950703b8c019892f982b90b","afterHash":"513e08bf6858cff653a54edc614308dceb363b4a4b02f6ae2a006d4b90c76f32"},{"field":"name","beforeHash":"74234e98afe7498fb5daf1f36ac2d78acc339464f950703b8c019892f982b90b","afterHash":"b1a402ec6dbad3a096229031790527f56a11ecb2abb57689da38a55dc401e474"},{"field":"repository","beforeHash":"74234e98afe7498fb5daf1f36ac2d78acc339464f950703b8c019892f982b90b","afterHash":"f0360ba31a33f143941d1814f66c996ae02e25331f62dc0389fdb122937f788e"},{"field":"sourceCount","beforeHash":"74234e98afe7498fb5daf1f36ac2d78acc339464f950703b8c019892f982b90b","afterHash":"6b86b273ff34fce19d6b804eff5a3f5747ada4eaa22f1d49c01e52ddb7875b4b"}]},"publishedAt":"2026-08-21T11:10:26.416Z","updatedAt":"2026-08-21T11:10:26.462Z","summary":{"id":"cmt2ulllf000vj9dj2bkuuxkg","projectType":"library","oneLine":"移动优先的堆栈导航器框架，带可组合插件系统","overview":"Stackflow 是一个移动优先的堆栈导航器框架，专为混合应用和 WebView 设计。它实现了 iOS/Android 常见的堆栈导航 UX，支持屏幕堆叠、滚动状态保持、过渡动画和 iOS 风格滑动返回。核心逻辑与 UI 分离，可通过插件系统扩展，目前支持 React，并支持服务端渲染。","highlights":["堆栈导航 UX","插件系统","React 集成","SSR 支持"],"bestFor":["构建移动端 WebView 应用","需要堆栈导航的 React 开发者","希望自定义导航 UI 的团队"],"caveats":["目前仅支持 React","Next.js 集成不推荐","需要手动配置 URL 解析器（最新版本）"],"categorySuggestion":"development_tools","subcategorySuggestion":"libraries_sdks","lifecycleStages":["frontend"],"audienceIntents":["build","integrate","learn"],"confidence":0.85,"evidence":[{"claim":"Stackflow 是一个移动优先的堆栈导航器框架，具有可组合的插件系统。","sourceType":"description","locator":"https://github.com/daangn/stackflow"},{"claim":"它实现了移动设备（iOS/Android）中常用的堆栈导航 UX，有助于开发混合应用和 WebView。","sourceType":"readme","locator":"https://github.com/daangn/stackflow"},{"claim":"支持堆叠屏幕并保持滚动状态，支持堆叠过渡效果和 iOS 风格滑动返回。","sourceType":"readme","locator":"https://github.com/daangn/stackflow"},{"claim":"核心逻辑与集成层分离，目前仅支持 React，但可扩展至其他前端框架。","sourceType":"readme","locator":"https://github.com/daangn/stackflow"},{"claim":"支持服务端渲染（ReactDOMServer.renderToString）。","sourceType":"readme","locator":"https://github.com/daangn/stackflow"},{"claim":"通过插件接口，可以在生命周期之间注入任何额外的扩展。","sourceType":"readme","locator":"https://github.com/daangn/stackflow"}],"publishedAt":"2026-08-21T11:10:26.416Z"},"github":{"url":"https://github.com/daangn/stackflow","ownerAvatarUrl":"https://avatars.githubusercontent.com/u/12152522?v=4","starsCount":1026,"forksCount":115,"language":"TypeScript","syncedAt":"2026-08-21T11:00:50.925Z","license":"MIT","defaultBranch":"main","archived":false,"disabled":false,"lastChangedAt":"2026-08-21T10:58:56.000Z","missing":false},"tags":[],"updates":[]},"entryPoint":"discovery","claim":{"state":"unclaimed","verified":false},"initialView":"beautified","community":{"viewer":null,"state":{"likesCount":0,"creativeCount":0,"followersCount":0,"commentsCount":0,"liked":false,"creative":false,"followed":false},"comments":{"comments":[],"nextCursor":null}}}]}],"$L24"]