84669 person learning
152542 person learning
20005 person learning
5487 person learning
7821 person learning
359900 person learning
3350 person learning
180660 person learning
48569 person learning
18603 person learning
40936 person learning
1549 person learning
1183 person learning
32909 person learning
vue/react/angular框架等 渲染数据时,页面产生抖动,给用户一种不太友好的感觉,怎样消除这种抖动呢?
第一种方法,再被渲染的区域预先放置loading提示,在渲染结束后隐藏/删除loading,显示正常内容。
第二种方法,给数据一个初始值,可以撑起页面样式,获取后再替换。
第二种方法的变形,从css上下手,让未渲染的部分可以显示且结构与渲染好后一致,渲染完成只改变对应的数据,不让页面结构发生改变。
使用 ng-cloak 和 v-cloak,React 没用接触过不太清楚.
ng-cloak
v-cloak
除了第一答案的解决思路之外,还可以考虑同构,reactjs提供这样的方案,nodejs输出就是成型的页面,就不需要客户端在rerender一次了,也就没有闪一下得问题了。
第一种方法,再被渲染的区域预先放置loading提示,在渲染结束后隐藏/删除loading,显示正常内容。
第二种方法,给数据一个初始值,可以撑起页面样式,获取后再替换。
第二种方法的变形,从css上下手,让未渲染的部分可以显示且结构与渲染好后一致,渲染完成只改变对应的数据,不让页面结构发生改变。
使用
ng-cloak
和v-cloak
,React 没用接触过不太清楚.除了第一答案的解决思路之外,还可以考虑同构,reactjs提供这样的方案,nodejs输出就是成型的页面,就不需要客户端在rerender一次了,也就没有闪一下得问题了。