我用antd的步骤条Steps，渲染时每次都是延迟渲染出来，却没有触发update相关生命周期，这是为什么？

#1

使用antd的steps。代码如下，没有报错

<Steps>
    <Step status="finish" title="第一步" icon={<Icon type="user" />} />
    <Step status="finish" title="第二步" icon={<Icon type="environment-o" />} />
    <Step status="finish" title="第三步" icon={<Icon type="environment-o" />} />
    <Step status="process" title="第四步" icon={<Icon type="smile-o" />} />
</Steps>

渲染结果：

问题是他每次都是都是延迟显示(大约100ms吧)。
这样用户体验很不好，先打印各个生命周期，发现只执行了三个：

于是我从componentDidMount开始debugger,（此时其他部分都已经渲染好了只有steps没有渲染），并截取了部分关键的源码，希望大佬们看看为什么



终于在这张图的35628行渲染了。但是为什么不知行生命周期函数呢？顺便截了下一张图

麻烦大佬们看看，很不解为什么会延迟渲染，又不执行生命周期函数

#2

你这个截图代码很难看懂，抱歉没能理解你的问题是什么？

附带一个可重现的 demo 以及必要的信息来提个 issue ？ http://new-issue.ant.design

#3

我又看了看，其实问题变成这样：antd使用icon为什么会延迟显示（比文字慢），是因为svg渲染慢吗？还是因为没有服务端渲染的缘故？或是其他的？

#4
#5

好吧，谢谢了

#6

icon font 比普通文字显示慢是正常的，因为要先去服务端获取字体文件，才能正确显示

#7

antd-mobile 1.x 不是 iconfont 的，是 inline 的 svg。

#8

对，我现在用本地的字体文件+缓存，就可以了。
但是又发现：antd的步骤条Steps很奇怪，别的字体只要加载一次，切换路由没有延迟了。而Steps切换路由回来，也要延迟显示。。可能是他动态创建的？