Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

渲染 10w 个节点,对比 fre、vue、react #355

Closed
zengxiaoluan opened this issue Nov 26, 2022 · 2 comments
Closed

渲染 10w 个节点,对比 fre、vue、react #355

zengxiaoluan opened this issue Nov 26, 2022 · 2 comments

Comments

@zengxiaoluan
Copy link

例子可以看下面的链接:

vue

react

把节点渲染出来,fre 要耗时更久一些,猜测是因为 const threshold: number = 5 的原因。

https://github.com/frejs/fre/blob/master/src/schedule.ts#L4

@yisar
Copy link
Collaborator

yisar commented Nov 26, 2022

fre 默认开启时间切片,所以这种同步测试会比较吃亏

@yisar
Copy link
Collaborator

yisar commented Nov 30, 2022

我回来了,你这个测试的是首屏的性能指标,首屏幕 fre 要比 vue/react 要慢的,原因如下:

  1. fre 默认开启时间切片,首屏幕默认也切片,也就是你说的 5ms 阈值导致的
  2. fre 为了 1kb 并没有区分 mount 和 update 逻辑,也就是说 fre 的 mount 默认也走 update 的 diff 算法,这个算法的时间复杂度是 O(logN),算法自身是不快的,而 react 和 vue,首屏 mount 阶段是不走这个 diff 的,直接 append

所以这个 benchmark 用例,fre 会更慢,但是如果你写一个复杂的更新逻辑的时候,react 则会变成最慢的那个

因为 fre 的 diff 算法本质上和 inferno/vue3 原理相同,fre 用的最长公共子序列,inferno 用的最长递增子序列,这基本上是最快的 diff 算法了

@yisar yisar closed this as completed Nov 30, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants