- WebSocket
- 流式传输 fetch
- 虚拟滚动 (渲染性能提升,一次性记载固定条数)
- 分片滚动
fetch流式传输
async function streamData(url) {unction streamOutput(msg) {// 发送 POST 请求fetch('url', {method:"POST",body:JSON.stringify({ "content": msg}),timeout: 0,dataType:"text/event-stream",headers:{"Content-Type":"application/json"},}).then(response => {// 检查响应是否成功if (!response.ok) {throw new Error('Network response was not ok');}// 返回一个可读流return response.body;}).then(body => {disableLoading();const reader = body.getReader();// 读取数据流function read() {return reader.read().then(({ done, value }) => {// 检查是否读取完毕if (done) {console.log('已传输完毕');return;}// 处理每个数据块console.log('收到的数据:', value);// 继续读取下一个数据块read();});}// 开始读取数据流read();}).catch(error => {console.error('Fetch error:', error);});
}