I am working on a site that has some learning materials that have to be saved in a DB and can be shown in the site for users to see using something like React PDF Viewer. The three problems I’m trying to figure out are from client to server, storing in the DB and from server to client.

I got the client to server working using Uint8Array, but when storing this in the database and retrieving it the client side it would change the values of each byte. I found a couple of people who came across the same problem and had it fixed by using encode(data::bytea, 'escape') in the select query. This got me the right values for each byte but when sending it to the front-end I wasn’t able to get it back to a Uint8Array, even though it had the exact same format of:

{
  "0":37,
  "1":70,
  ...
}

The peculiar thing is that it also didn’t function as an array anymore. I wasn’t able to loop through it, I couldn’t get any of the values like I could before by just using its index.

Also loading in the data was very time consuming with taking 1-2 seconds for a couple page pdf.
The site would have somewhere around 30 documents, all of which between 5 and 20 pages long with at most 5 to 10 users simultaneously.