脚本使 cpu 达到 100%，并在使用“npm build”构建之后滞后，但在通过“npm start”服务之前不会滞后

Question

对我来说，这是一个非常奇怪的问题。我正在开发一个基本的小型 PGP 工具，它运行良好，我部署了但忘记了。今天早上去服务器上测试，它滞后，有时会使浏览器崩溃，但总是将 cpu 飙升至 100%。罪魁祸首是异步调用 openpgp.generateKey()，这就是构建后挂起的内容。当我通过 npm 启动它时，它超级活泼，没有任何问题。我为此使用了 create react app，并尝试通过这篇文章禁用分块： 如何使用 webpack4 禁用块（代码拆分）？

但是没有用。我必须假设构建过程中的某些东西导致了这个，我只是想不通是什么。任何帮助将不胜感激！

import { useState } from 'react'
import * as openpgp from 'openpgp';

function GenKeys () {
    const genKeyPair = async (name, email, passphrase) => {
        const { privateKey, publicKey } = await openpgp.generateKey({
            type: 'rsa', // Type of the key
            rsaBits: 4096, // RSA key size (defaults to 4096 bits)
            userIDs: [{ name, email }], // you can pass multiple user IDs
            passphrase // protects the private key
        });
        setPrivateKey(privateKey)
        setPublicKey(publicKey)
    }


    const [name, setName] = useState('')
    const [email, setEmail] = useState('')
    const [passphrase, setPassphrase] = useState('')
    const [privateKey, setPrivateKey] = useState('')
    const [publicKey, setPublicKey] = useState('')

    return <div>
        <input defaultValue={name} onChange={e => setName(e.target.value)} placeholder='Name' />    
        <input defaultValue={email} onChange={e => setEmail(e.target.value)} placeholder='Email' /> 
        <input defaultValue={passphrase} onChange={e => setPassphrase(e.target.value)} type="password" placeholder='Password' />    
        <button onClick={e => genKeyPair(name, email, passphrase)}>Gen Keys</button>
        <div>
            <div>
                Private Key
                <br />
                <textarea value={privateKey}></textarea>
            </div>
            <div>
                Public Key
                <br />
                <textarea value={publicKey}></textarea>
            </div>
        </div>
    </div>;

}

export default GenKeys;

Answer 1

正如您提到的，您遇到的性能问题可能与 openpgp 库的大小有关。这种大小的库可能需要一段时间才能加载和执行，尤其是在资源有限的浏览器环境中。

一个可能的解决方案是将密钥生成卸载到可以更有效地处理 CPU 密集型工作的服务器端脚本。这将减少客户端计算机上的负载并提高整体性能。您可以设置一个 API 端点来接收必要的输入参数并返回生成的密钥对。

您可以尝试的另一件事是，如果可能的话，使用较小的库进行 PGP 加密。有几个可用的轻量级库可以处理基本的 PGP 操作，而无需增加像 openpgp 这样的大型库的体积。

最后，您可以尝试不同的 RSA 密钥大小，看看较小的密钥大小是否会在提高性能的同时提供可接受的安全性。 4096 位的密钥大小非常安全，但对于您的特定用例来说可能有点过头了。