<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Document</title></head><body><ul>控件:</ul></body></html>
setTimeout(() => {// 插⼊十万条数据const total = 100000;// ⼀次插⼊ 20 条，如果觉得性能不好就减少const once = 20;// 渲染数据总共需要⼏次const loopCount = total / once;let countOfRender = 0;let ul = document.querySelector("ul"); function add() {// 优化性能，插入不会造成回流const fragment = document.createDocumentFragment();for (let i = 0; i < once; i++) {const li = document.createElement("li");li.innerText = Math.floor(Math.random() * total);fragment.appendChild(li);}ul.appendChild(fragment);countOfRender += 1;loop();}function loop() {if (countOfRender < loopCount) {window.requestAnimationFrame(add);}}loop();},0)
