createDocumentFragment 与字符串拼接渲染dom性能比较

一般如果我们有多个dom原生需要通过js添加到html中，如果一个dom添加一次，会造成页面多次重绘。所以我通常是两种解决方法。

1. 通过拼接好字符串后添加到html中

2. 通过 创建DocumentFragment节点接受dom元素，最后添加到html中https://www.jianshu.com/p/f02542f1f828

但是两种方式的性能比较，哪个更好呢？今天在同一浏览器，同一工作条件下，相差几秒钟试验了一下；

• 都刷新页面10次，比较结果如下
  | DocumentFragment | 字符串|
  | ------------- | ------------- |
  | 102| 108 |
  | 109| 92|
  | 105 | 96|
  | 114| 96 |
  | 109 | 86 |
  | 105| 89|
  | 106 | 101 |
  | 99 | 93 |
  | 105 | 91|
  | 97 | 88|

• 从结果可以看出通字符串拼接渲染dom性能更高。