• 请不要在回答技术问题时复制粘贴 AI 生成的内容
muchan92
V2EX  ›  程序员

我终于可以骄傲地说:直接从源码分析出程序完整的数据流向图谱,现在成为可能了!

  •  
  •   muchan92 · 1h 50m ago · 1148 views

    Data Flow Graph

    在线预览: https://rainforesters.github.io/imsure-analyzer/

    这个图谱表达了程序完整的功能/业务逻辑,它们都含在数据流向里面。这就是我所说的网状结构的自动状态机,现在终于可以直观展现在大家面前了。

    这个天方夜谭的想法此刻终于落地成为现实,若没有声明式语法和 imsure,这个念头我压根不会想,是这种看似怪异的语法让这变为了可能,现在终于可以舒心一笑。

    回顾,有很多不解、质疑、甚至谩骂,辛酸是有的,但更多还是自己的原因。因为很多时候文字的表达能力很苍白,之前我很难用文字把它美丽的样子诉说给大家,每个人脑海中都是它各种怪异的样子,现在它美丽的样子终于可以直观展现给大家了。

    经历反思、自我质疑、和不断自我博弈后,因为能清晰洞见它的美,所以我还在坚持,更因为在日常工作中的真实实践,它所展现的强壮、坚韧的稳定性和可维护性,带来的收益完全足以抵消语法的不便,让我有底气坚定这是正确的方向。我依然认为从算术方法到方程式方法是正确的选择。

    下面是我们一个充斥复杂业务功能和许多“奇妙”需求的真实项目,时至今日依然可以轻易地继续添加或修改各种功能,维护难度与项目创建的第一天毫无分别,从未重构,也从不需要重构。因为把任何两个类型关联起来就像画条线一样简单,也根本不必担心会破坏任何已有的连线,就像一个韧性十足的弹性球,揉不烂、搓不坏。(曾想把图谱渲染为更理想的 3D 球状,但视角切换不利于全局观察,就此作罢,大家可以脑补)

    我知道,肯定会有指责声音出现,我接受,但请理性发言,不要谩骂,不要阴阳怪气。今天是儿童节,祝大家开心快乐,儿童的纯真,我想是最可贵,最令人向往的……

    Data Flow Graph

    备注:若这显得凌乱,是布局算法的问题,你可以把它想象为一个 3D 球。(我真不擅长这个布局算法,示例里的布局我也不甚满意,幸好还可以使用高亮关联)

    14 replies    2026-06-01 15:15:27 +08:00
    corcre
        1
    corcre  
       1h 48m ago
    以前修屎山的时候最希望就是有这个功能😂
    deplives
        2
    deplives  
       1h 37m ago
    pnpm install
    Scope: all 3 workspace projects
    [WARN] Ignoring broken lockfile at /Users/bob/Developer/github/imsure-analyzer: Lockfile /Users/bob/Developer/github/imsure-analyzer/pnpm-lock.yaml not compatible with current pnpm
    [WARN] Tarball download average speed 18 KiB/s (size 20 KiB) is below 50 KiB/s: https://registry.npmjs.org/dockview-vue/-/dockview-vue-6.6.1.tgz (GET)
    packages/graph | [WARN] deprecated [email protected]

    ╭─────────────────────────────────────────╮
    │ │
    │ Update available! 11.4.0 → 11.5.0. │
    │ Changelog: https://pnpm.io/v/11.5.0
    │ To update, run: pnpm add -g pnpm │
    │ │
    ╰─────────────────────────────────────────╯

    [WARN] Tarball download average speed 47 KiB/s (size 228 KiB) is below 50 KiB/s: https://registry.npmjs.org/d3/-/d3-7.9.0.tgz (GET)
    [WARN] Tarball download average speed 36 KiB/s (size 47 KiB) is below 50 KiB/s: https://registry.npmjs.org/@vitest/runner/-/runner-4.1.7.tgz (GET)
    [WARN] Tarball download average speed 24 KiB/s (size 114 KiB) is below 50 KiB/s: https://registry.npmjs.org/minimatch/-/minimatch-10.2.5.tgz (GET)
    [WARN] 2 other warnings
    Packages: +311
    +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
    Downloading [email protected]: 14.65 MB/14.65 MB, done
    Progress: resolved 353, reused 64, downloaded 253, added 311, done
    . postinstall$ pnpm run build
    [32 lines collapsed]
    │ packages/graph build: dist/assets/logo-BuEh7Drd.svg 3.47 kB │ gzip: 1.56 kB
    │ packages/graph build: dist/assets/index-DmvL4LxK.css 156.68 kB │ gzip: 16.33 kB
    │ packages/graph build: dist/assets/index-Btya9TlM.js 2,254.83 kB │ gzip: 644.67 kB
    │ packages/graph build: ✓ built in 895ms
    │ packages/graph build: [plugin builtin:vite-reporter]
    │ packages/graph build: (!) Some chunks are larger than 500 kB after minification. Consider:
    │ packages/graph build: - Using dynamic import() to code-split the application
    │ packages/graph build: - Use build.rolldownOptions.output.codeSplitting to improve chunking: https://rolldown.rs/reference/OutputOptions.codeSplitting
    │ packages/graph build: - Adjust chunk size limit for this warning via build.chunkSizeWarningLimit.
    │ packages/graph build: Done
    └─ Done in 4.5s
    Downloading @rolldown/[email protected]: 8.01 MB/8.01 MB, done

    devDependencies:
    + @types/node 25.9.1
    + prettier 3.8.3
    + rimraf 6.1.3
    + typescript 6.0.3
    + vitest 4.1.7

    [ERR_PNPM_IGNORED_BUILDS] Ignored build scripts: @parcel/[email protected], [email protected]

    Run "pnpm approve-builds" to pick which dependencies should be allowed to run scripts.
    w574495524
        3
    w574495524  
       1h 34m ago
    研究研究
    YanSeven
        4
    YanSeven  
       1h 33m ago
    有过类似的想法,但是交互和展示是个大问题。
    icyalala
        5
    icyalala  
       1h 30m ago   ❤️ 2
    第一张图还能勉强一看,第二张图完全不是给人看的
    tengxun
        6
    tengxun  
       1h 27m ago   ❤️ 1
    赞一个,很棒的想法
    muchan92
        7
    muchan92  
    OP
       1h 19m ago via Android
    @deplives 升级下 node pnpm 试试
    muchan92
        8
    muchan92  
    OP
       1h 18m ago via Android
    @tengxun 感谢❤️
    JoeSmith
        9
    JoeSmith  
       1h 16m ago
    https://github.com/cytoscape/cytoscape.js 这个说不定对你有帮助
    thevenin1416
        10
    thevenin1416  
       1h 3m ago
    这是一个什么样的原理呢,我这边主要是前端项目,能分析数据的来龙去脉吗?
    xingzhi95
        11
    xingzhi95  
       53 mins ago
    很屌啊,可以看数据和业务逻辑的流向
    SilenceLL
        12
    SilenceLL  
       50 mins ago
    赞,我几年前也因为我们的业务复杂度人工做了一个类似的图,但是后面因为维护的复杂性放弃更新了。最近几个月有强烈的意愿,想要做一个业务全貌的关系图谱,减少或者杜绝需求、设计阶段的业务遗漏。
    zzNaLOGIC
        13
    zzNaLOGIC  
       41 mins ago
    等会拿我们老系统试试,十多年的屎山,业务揉杂,能分析出来就说明真的有用。
    GPLer
        14
    GPLer  
       11 mins ago
    目前好像只支持 ts ,但是似乎没有明显说明。
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   5542 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 80ms · UTC 07:26 · PVG 15:26 · LAX 00:26 · JFK 03:26
    ♥ Do have faith in what you're doing.