如何调试 flowtype 极慢的性能？

Question

在工作中我不得不使用流类型，但是非常慢，这里有一个演示问题的视频：

https://www.youtube.com/watch?v=hloQX8wG0t0

我已经尝试了几种方法，例如删除流类型定义、摆脱循环依赖等...

在这一点上我没有想法，我也不知道如何调试这个东西，有没有人知道如何查看 saving/each 击键后生成的依赖树？

编辑 1：这是我目前的 .flowconfig:

[ignore]
.*/node_modules/react-native-keyboard-aware-scroll-view/.*
.*/node_modules/react-native-fbsdk/.*
.*/node_modules/@react-native-community/picker.*
.*/node_modules/@react-native-community/slider.*
; remove when flow is updated. Currently leads to "Cannot assign rest to restState because rest [1] is incompatible with State [2]."
.*/node_modules/redux-persist/lib/persistReducer.js.flow
.*/node_modules/recompose/dist/Recompose.cjs.js.flow

; Ignores sub apps
.*/firebase/**
.*/webapp/**
.*/node_modules/react-native-androw/src.*

; Migration to RN 0,64 causes some random errors
.*/node_modules/react-navigation-redux-helpers
.*/node_modules/react-navigation-redux-helpers
.*/node_modules/react-native-calendars
; .*/node_modules/react-native/Libraries/Interaction
; .*/node_modules/react-native/Libraries/Logbox/Data

; We fork some components by platform
.*/*[.]android.js

; Ignore "BUCK" generated dirs
<PROJECT_ROOT>/\.buckd/

; Ignore polyfills
node_modules/react-native/Libraries/polyfills/.*

; Flow doesn't support platforms
.*/Libraries/Utilities/LoadingView.js

[untyped]
.*/node_modules/@react-native-community/cli/.*/.*
.*/node_modules/react-native-confetti-cannon/.*
.*/node_modules/react-native-linear-gradient/.*


[libs]
node_modules/react-native/interface.js
node_modules/react-native/flow/
flow/libs

[options]
emoji=true
server.max_workers=1
sharedmemory.hash_table_pow=22

esproposal.optional_chaining=enable
esproposal.nullish_coalescing=enable
; RN 0.64 turns this on, our codebase explodes
; exact_by_default=true
module.file_ext=.js
module.file_ext=.json
module.file_ext=.ios.js
module.system.node.allow_root_relative=true
munge_underscores=true
module.name_mapper='^react-native/\(.*\)$' -> '<PROJECT_ROOT>/node_modules/react-native/'
module.name_mapper='^@?[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> '<PROJECT_ROOT>/node_modules/react-native/Libraries/Image/RelativeImageStub'
module.name_mapper.extension='svg' -> '<PROJECT_ROOT>/flow/SVGFlowStub.js'

suppress_type=$FlowIssue
suppress_type=$FlowFixMe
suppress_type=$FlowFixMeProps
suppress_type=$FlowFixMeState

; Types first is the architecture that forces very very strict rules (always export typed results)
; In order to increase the performance of flow (it is painfully slow)
; However our codebase is in no way shape or form ready for this (it throws around 567 type errors)
types_first=false

[lints]
sketchy-null-number=warn
sketchy-null-mixed=warn
sketchy-number=warn
untyped-type-import=warn
nonstrict-import=warn
deprecated-type=warn
unsafe-getters-setters=warn
unnecessary-invariant=warn
signature-verification-failure=warn

[strict]
deprecated-type
nonstrict-import
sketchy-null
unclear-type
unsafe-getters-setters
untyped-import
untyped-type-import

[version]
^0.137.0

我还尝试了一个不同的流插件，因为我认为它可能与 the plugin making too many requests to the flow server 有关，它提高了一点性能，但并不显着

编辑 2：

我刚刚尝试了很多东西，即删除了一堆我们为重组而设置的类型，然后还尝试将大部分类型提取到 libDef 中......仍然没有

我真的认为问题出在我们的体系结构上，我们基本上已经在 types/index.js 文件中声明了所有类型，每次我们想要使用它们时，我们都会手动导入它们，例如import type { UUID } from 'src/types'，因为所有类型都在那里声明，所以依赖树没有错，它需要在每个 change/save

上检查 400 多个文件

编辑 3

我最终解析了整个应用程序的依赖关系树，以确定是否真的出了问题...得出的结论是 Flow 没有做错任何事情，但我们的进口是罪魁祸首，主要是（我认为）由于Redux 和 Sagas，拉一个导入最终会重新检查整个应用程序。

你可以在这里找到我的计算方法：

https://ospfranco.com/post/2021/08/25/how-to-visualize-flowtype-dependency-tree/

非常感谢！

Answer 1

我最终解析了整个应用程序的依赖关系树，以确定是否真的出了问题...得出的结论是 Flow 没有做错任何事情，但我们的导入是罪魁祸首，主要是（我认为）由于Redux 和 Sagas，拉一个导入最终会重新检查整个应用程序。

你可以在这里找到我的计算方法：

https://ospfranco.com/post/2021/08/25/how-to-visualize-flowtype-dependency-tree/

如何调试 flowtype 极慢的性能？

How to debug flowtype extreme slow performance?

javascript

flowtype

编辑 3