Svelte 5 page loads twice: once before layout, once after layout

SkylerLipthay commented 9 months ago

Describe the bug

After upgrading to Svelte 5, a page route change sometimes causes the page component to load before its layout, and then again afterwards.

I was able to reproduce this bug with both 5.0.0-next.1 and 5.0.0-next.6.

Reproduction

Reproduction repository here. It's a barebones projects with SSR disabled, once using Svelte 4 and once using Svelte 5. The only difference between v4 and v5 is the Svelte version in package.json.

Svelte 4 behavior (normal)

cd v4; npm install; npm run dev
Visit http://localhost:5173/
Click To /other
Click To /

Console output

/ (layout)
/ (page)
/other (layout)
/other (page)
/ (layout)
/ (page)

Svelte 5 behavior (bug)

cd v5; npm install; npm run dev
Visit http://localhost:5173/
Click To /other
Click To /
Click To /other
Click To /

Console output

/ (layout)
/ (page)
/other (page)
/other (layout)
/other (page)
/ (page)
/ (layout)
/ (page)
/other (page)
/other (layout)
/other (page)
/ (layout)
/ (page)

Notice that /other (page) and / (page) get printed both before and after /other (layout) and / (layout) respectively, until exactly the 4th navigation event (?!) where the extraneous "before" page load does not occur anymore.

Instead of clicking the anchors tags, you can use the browser back/forward navigation to trigger the same behavior.

Logs

No response

System Info

System:
  OS: Linux 5.15 Ubuntu 22.04.1 LTS 22.04.1 LTS (Jammy Jellyfish)
  CPU: (12) x64 Intel(R) Core(TM) i7-5820K CPU @ 3.30GHz
  Memory: 9.57 GB / 15.57 GB
  Container: Yes
  Shell: 5.8.1 - /usr/bin/zsh
Binaries:
  Node: 17.5.0 - ~/.asdf/installs/nodejs/17.5.0/bin/node
  npm: 8.4.1 - ~/.asdf/plugins/nodejs/shims/npm
npmPackages:
  @sveltejs/adapter-static: ^2.0.3 => 2.0.3
  @sveltejs/kit: ^1.27.4 => 1.27.6
  svelte: 5.0.0-next.6 => 5.0.0-next.6
  vite: ^4.4.2 => 4.5.0

Severity

blocking an upgrade

Additional Information

No response

SkylerLipthay commented 6 months ago

This appears to be fixed. Current system info:

System:
  OS: Linux 5.15 Ubuntu 22.04.1 LTS 22.04.1 LTS (Jammy Jellyfish)
  CPU: (12) x64 Intel(R) Core(TM) i7-5820K CPU @ 3.30GHz
  Memory: 12.15 GB / 15.57 GB
  Container: Yes
  Shell: 5.8.1 - /usr/bin/zsh
Binaries:
  Node: 21.1.0 - ~/.asdf/installs/nodejs/21.1.0/bin/node
  npm: 10.2.0 - ~/.asdf/plugins/nodejs/shims/npm
  bun: 1.0.11 - ~/.asdf/shims/bun
npmPackages:
  @sveltejs/adapter-auto: ^3.0.0 => 3.1.1
  @sveltejs/kit: ^2.0.0 => 2.5.4
  @sveltejs/vite-plugin-svelte: ^3.0.0 => 3.0.2
  svelte: ^5.0.0-next.78 => 5.0.0-next.78
  vite: ^5.0.3 => 5.1.6

pboling commented 5 months ago

We're experiencing a similar double page load on Svelte5, and I'm not sure why. Will be looking into it soon.

sveltejs / kit