sveltejs / sveltejs/kit

ArrayBuffer differs on same api called on server vs on client.

Open
#13,949 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
JavaScript
Stars
20.8k
Forks
2.3k
Avg merge
1d 16h
Merged PRs (30d)
156

Description

Describe the bug

i want to consume an apache arrow stream (casted to ArrayBuffer) inside a page.svelte file.

calling the following during client side works fine:

onMount(async () => {
    const arrowBuffer = await (await fetch(`my-static-api`)).arrayBuffer()
    await tableManager.fromBuffer(arrowBuffer , {})
});

note: tableManager is a wrapper on an external tool (@finos/perspective)

but, if i run the same code, but loading the api on ssr page.ts file:

//page.ts 
export const load: PageLoad = async ({locals, fetch }) => {
    const x = await fetch(`my-static-api`)
    return {
        arrowBuffer: await x.arrayBuffer()
    };
};

//page.svelte

let { data } = $props();
onMount(async () => {
    await tableManager.fromBuffer(data.arrowBuffer, {})
});

in the first case, i get back a fully formed arraybuffer, while on ssr, i get back the following error:
sales-Unexpected error: Error: Abort(): Failed to open RecordBatchStreamReader: IOError: Invalid flatbuffers message.

i'm pretty sure the error depends on how devalue handles these buffers, and is not a problem related to finos perspective, since on client side code the api works and i see data.

moreover, the page.ts code works fine if i set ssr=false.

Reproduction

given the direction given for providing a reproduction is impossible for me to provide a short, self-contained fork.
i have an apache arrow stream api service that converts chucks of data coming from sql queries result and streams them to the UI...

Logs

System Info
System:
    OS: Windows 10 10.0.19045
    CPU: (14) x64 Intel(R) Core(TM) Ultra 5 135U   
    Memory: 2.15 GB / 15.46 GB
  Binaries:
    Node: 20.18.0 - ~\root\Programs\NodeJS\node.EXE
    Yarn: 1.22.22 - ~\AppData\Roaming\npm\yarn.CMD 
    npm: 11.1.0 - ~\root\Programs\NodeJS\npm.CMD   
  Browsers:
    Edge: Chromium (134.0.3124.93)
    Internet Explorer: 11.0.19041.5794
  npmPackages:
    @sveltejs/adapter-node: ^2.0.0 => 2.1.2
    @sveltejs/kit: ^2.5.27 => 2.21.5
    @sveltejs/vite-plugin-svelte: ^4.0.0 => 4.0.4
    svelte: ^5.0.0 => 5.34.6
    vite: ^5.4.8 => 5.4.19
Severity

annoyance

Additional Information

No response

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the page.ts load function and the page.svelte onMount handler, comparing the client-side fetch with the SSR result passed through devalue. Reproduce the Apache Arrow buffer failure and determine whether SSR serialization preserves valid ArrayBuffer contents; done means the same buffer can be consumed successfully in both paths or the limitation is clearly documented.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
backend, web-dev
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
30/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.