Recentemente desenvolvi um mini figma utilizando svg e tenho um objeto que salva o snapshot da DOM em código e no final exporto pra PDF mas quando a quantidade de graficos e dados é grande o navegador fica travando e depois trava todo o PC e a página quebra, que rumo posso seguir?
obs: Estou utilizando React + typescript
Pelo que entendi você está gerando o PDF no frontend (client) e essa não é a abordagem correta, geração de PDF ou qualquer operação que tem um "esforço" computacional maior, deve ser processado no backend (servidor).
Se você já tiver um backend em NodeJS por exemplo, vc pode utilizar as bibliotecas: node-html-pdf, pdfkit, PhantomJS etc.. tem várias.
Gera o PDF no servidor e retorna pro seu frontend somente a URL por exemplo do PDF, ou o stream do PDF para que o próprio browser processe o PDF e dê a opção para o usuário abrir ou salvar.
Espero ter ajudado!
No meu caso eu adiciono imagens,tabelas dados de graficos, e isso divido em várias paginas
no final das contas tenho uma propriedade que guarda a dom das minhas páginas
{
id: 'dsadsadasas',
// algumas propriedades
snapshot: [
'<div>...</div>',
'<div>...</div>,
]
}
cada posição do array é um snapshot do que eu quero exportar, na sua abordagem seria melhor mandar para o backend e exportar do lado do servidor os snapshots?