Loading in Layouts

So far, we’ve only looked at load() being used in +page.js or +page.server.js files, but it can also be utilized in +layout.js or +layout.server.js files. While layouts cannot export actions, they are otherwise functionally identical to page files. This means that previously mentioned page options (such as ssr) and load() functions will apply to any components nested inside of the layout. Another important quality to understand about load() functions is that because they are run concurrently within SvelteKit, a single page will not render until all requests have completed. Having a load() function on a page as well as a layout will prevent rendering until both have completed. But because they will be run simultaneously, any delays should be negligible.

When loading data in a layout, the most obvious advantage of doing so is the ability to access that data in sibling and child pages. This means that any data loaded by a layout can then be accessed within...