NodeJS +电子 – 优化显示大文件

我正在尝试阅读大文件。 目前，我正在关注如何读取大文件的NodeJS文档，但是当我读取一个有点大的文件（〜1.1 MB，〜20k行）时，我的Electron应用程序冻结了大约6分钟，然后应用程序完成加载所有线。

这是我目前的代码

var fileContents = document.getElementById("fileContents") //first clear out the existing text fileContents.innerHTML = "" if(fs.existsSync(pathToFile)){ const fileLine = readline.createInterface({ input: fs.createReadStream(pathToFile) }) fileLine.on('line', (line) => { fileContents.innerHTML += line + "\n" }) } else { fileContents.innerHTML += fileNotFound + "\n" console.log('Could not find file!!') } 

而我<xmp>标签是一个<xmp>标签。

什么是人们展示大文件的方式？

Answer 1

stream对于高性能通常是有用的，因为它们允许您一次处理一行，而无需将整个文件加载到内存中。

然而，在这种情况下，您正在加载每行，然后用+=连接到现有string（ fileContents.innerHTML ）。 所有这些连接可能比仅仅将文件的全部内容加载为一个string要慢。 更糟糕的是，每当你阅读一行时就输出HTML。 所以在20K行中，你要求渲染引擎呈现HTML 20,000次！

相反，尝试读取文件作为一个string，并输出HTML一次。

 fs.readFile(pathToFile, (err, data) => { if (err) throw err; fileContents.innerHTML = data; });