Skip to content

Commit eb7450e

Browse files
committed
Update readme
1 parent bd79a3d commit eb7450e

File tree

1 file changed

+24
-23
lines changed

1 file changed

+24
-23
lines changed

README.md

Lines changed: 24 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -26,14 +26,14 @@
2626

2727
* [Advantages](#advantages)
2828
* [Live demos](#live-demos)
29-
* [Performance comparison](#performance-comparison)
30-
* [Build time wasted](#build-time-wasted)
31-
* [Total memory used](#total-memory-used)
3229
* [How it works](#how-it-works)
3330
* [Simple usage](#simple-usage)
3431
* [vfor-mode](#vfor-mode)
3532
* [item-mode](#item-mode)
3633
* [variable height](#variable-height)
34+
* [Performance comparison](#performance-comparison)
35+
* [Build time wasted](#build-time-wasted)
36+
* [Total memory used](#total-memory-used)
3737
* [Attentions](#attentions)
3838
* [**Props type**](#props-type)
3939
* [Public methods](#public-methods)
@@ -63,26 +63,6 @@ The main difference between `item-mode` and `vfor-mode` is that: `item-mode` mak
6363
Besides, you can also compare the experience which without using virtual-list here: [without-virtual-list](https://tangbc.github.io/vue-virtual-scroll-list/demos/without-virtual-list).
6464

6565

66-
## Performance comparison
67-
68-
According to the demos above, here are lists of approximate statistics:
69-
70-
#### Build time wasted
71-
72-
| Build amount | item-mode | vfor-mode | *without virtual list* |
73-
|-------------:|-----------|-----------|------------------------|
74-
| **1,000** | 8 ms | 35 ms | 220 ms |
75-
| **10,000** | 10 ms | 170 ms | 1500 ms |
76-
| **100,000** | 20 ms | 1300 ms | Browser crash! |
77-
78-
#### Total memory used
79-
80-
| Build amount | item-mode | vfor-mode | *without virtual list* |
81-
|-------------:|-----------|-----------|------------------------|
82-
| **1,000** | 10 MB | 80 MB | 200 MB |
83-
| **10,000** | 25 MB | 120 MB | 220 MB |
84-
| **100,000** | 55 MB | 550 MB | Browser crash! |
85-
8666
## How it works
8767

8868
<img src="https://tangbc.github.io/github-images/virtual-scroll-list-how-works.gif">
@@ -179,6 +159,27 @@ If you assign `variable` as `true`, **do not** set inline style height inside `<
179159
**More use ways or getting start you can refer to these clearly [demos](https://github.com/tangbc/vue-virtual-scroll-list/tree/master/demos) or [test suites](https://github.com/tangbc/vue-virtual-scroll-list/tree/master/test).**
180160

181161

162+
## Performance comparison
163+
164+
According to the demos above, here are lists of approximate statistics:
165+
166+
#### Build time wasted
167+
168+
| Build amount | item-mode | vfor-mode | *without virtual list* |
169+
|-------------:|-----------|-----------|------------------------|
170+
| **1,000** | 8 ms | 35 ms | 220 ms |
171+
| **10,000** | 10 ms | 170 ms | 1500 ms |
172+
| **100,000** | 20 ms | 1300 ms | Browser crash! |
173+
174+
#### Total memory used
175+
176+
| Build amount | item-mode | vfor-mode | *without virtual list* |
177+
|-------------:|-----------|-----------|------------------------|
178+
| **1,000** | 10 MB | 80 MB | 200 MB |
179+
| **10,000** | 25 MB | 120 MB | 220 MB |
180+
| **100,000** | 55 MB | 550 MB | Browser crash! |
181+
182+
182183
## Attentions
183184

184185
* Must assign the `:key` property on `<item>` component or dom frag with `v-for` directive.

0 commit comments

Comments
 (0)