4.4 (#25)

* docs: 4.4

* docs: 4.5.1

* docs: 4.5.2

* docs: 4.5.3

* docs: 4.5.x

* docs: 4.6.1

* docs: 4.6.2

* docs: 4.6.3

* docs: 4.6.4

* docs: 4.7

* Apply suggestions from code review

Co-authored-by: Maxime Dupont <[email protected]>

* Update content/tutorial/04-advanced-sveltekit/04-advanced-routing/05-breaking-out-of-layouts/README.md

Co-authored-by: Maxime Dupont <[email protected]>

* Update content/tutorial/04-advanced-sveltekit/05-advanced-loading/01-universal-load-functions/README.md

* fix: replace ? by .

* fix: site links

---------

Co-authored-by: Maxime Dupont <[email protected]>

content/tutorial/04-advanced-sveltekit/04-advanced-routing/01-optional-params/README.md

@@ -1,28 +1,28 @@
 ---
-title: Optional parameters
+title: Paramètres optionels
 ---
 
-In the first chapter on [routing](/tutorial/pages), we learned how to create routes with [dynamic parameters](/tutorial/params).
+Dans le premier chapitre sur le [routing](/tutorial/pages), nous avons vu comment créer des route avec des [paramètres dynamiques](/tutorial/params).
 
-Sometimes it's helpful to make a parameter optional. A classic example is when you use the pathname to determine the locale — `/fr/...`, `/de/...` and so on — but you also want to have a default locale.
+Il est parfois utile de rendre un paramètre optionnel. Un exemple classique est lorsque vous utilisez un chemin pour déterminer la langue - `/fr/...`, `/de/...` et ainsi de suite — mais vous souhaitez également avoir une langue par défaut.
 
-To do that, we use double brackets. Rename the `[lang]` directory to `[[lang]]`.
+Pour faire cela, nous utilisons les crochets doubles. Renommez le dossier `[lang]` en `[[lang]]`.
 
-The app now fails to build, because `src/routes/+page.svelte` and `src/routes/[[lang]]/+page.svelte` would both match `/`. Delete `src/routes/+page.svelte`. (You may need to reload the app to recover from the error page).
+L'application ne parvient plus à compiler, car les routes `src/routes/+page.svelte` et `src/routes/[[lang]]/+page.svelte` satisfont toutes les deux `/`. Supprimez la route `src/routes/+page.svelte` (il est possible que vous ayez besoin de recharger l'application pour annuler la page d'erreur).
 
-Lastly, edit `src/routes/[[lang]]/+page.server.js` to specify the default locale:
+Enfin, modifiez `src/routes/[[lang]]/+page.server.js` pour préciser la langue par défaut :
 
 ```js
 /// file: src/routes/[[lang]]/+page.server.js
 const greetings = {
 	en: 'hello!',
 	de: 'hallo!',
-	fr: 'bonjour!'
+	fr: 'bonjour !'
 };
 
 export function load({ params }) {
 	return {
-		greeting: greetings[params.lang +++?? 'en'+++]
+		greeting: greetings[params.lang +++?? 'fr'+++]
 	};
 }
 ```

content/tutorial/04-advanced-sveltekit/04-advanced-routing/01-optional-params/app-a/src/routes/+layout.svelte

@@ -1,8 +1,8 @@
 <nav>
-	<a href="/">default</a>
-	<a href="/en">english</a>
-	<a href="/de">german</a>
-	<a href="/fr">french</a>
+	<a href="/">par défaut</a>
+	<a href="/en">anglais</a>
+	<a href="/de">allemand</a>
+	<a href="/fr">français</a>
 </nav>
 
 <slot />

content/tutorial/04-advanced-sveltekit/04-advanced-routing/01-optional-params/app-a/src/routes/+page.svelte

@@ -1 +1 @@
-<h1>hello!</h1>
+<h1>bonjour !</h1>

content/tutorial/04-advanced-sveltekit/04-advanced-routing/01-optional-params/app-a/src/routes/[lang]/+page.server.js

@@ -1,7 +1,7 @@
 const greetings = {
 	en: 'hello!',
 	de: 'hallo!',
-	fr: 'bonjour!'
+	fr: 'bonjour !'
 };
 
 export function load({ params }) {

content/tutorial/04-advanced-sveltekit/04-advanced-routing/01-optional-params/app-b/src/routes/[[lang]]/+page.server.js

@@ -1,11 +1,11 @@
 const greetings = {
 	en: 'hello!',
 	de: 'hallo!',
-	fr: 'bonjour!'
+	fr: 'bonjour !'
 };
 
 export function load({ params }) {
 	return {
-		greeting: greetings[params.lang ?? 'en']
+		greeting: greetings[params.lang ?? 'fr']
 	};
 }

content/tutorial/04-advanced-sveltekit/04-advanced-routing/02-rest-params/README.md

@@ -1,14 +1,14 @@
 ---
-title: Rest parameters
+title: Paramètres du reste
 path: /how
 focus: /src/routes/[path]/+page.svelte
 ---
 
-To match an unknown number of path segments, use a `[...rest]` parameter, so named for its resemblance to [rest parameters in JavaScript](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/rest_parameters).
+Pour cibler un nombre indéfini de segments, utilisez un paramètre `[...rest]`, appelé ainsi pour sa ressemblance avec les [paramètres du reste en JavaScript](https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Functions/rest_parameters)  (**rest parameters** en anglais).
 
-Rename `src/routes/[path]` to `src/routes/[...path]`. The route now matches any path.
+Renommez `src/routes/[path]` en `src/routes/[...path]`. La route cible maintenant n'importe quel chemin.
 
-> Other, more specific routes will be tested first, making rest parameters useful as 'catch-all' routes. For example, if you needed a custom 404 page for pages inside `/categories/...`, you could add these files:
+> D'autres routes, plus spécifiques, seront d'abord testées, rendant les paramètres du reste efficaces en tant que routes "attrape-tout". Par exemple, si vous aviez besoin d'une page 404 personnalisée dans `/categories/...`, vous pourriez ajouter ces fichiers :
 >
 > ```diff
 > src/routes/
@@ -21,6 +21,6 @@ Rename `src/routes/[path]` to `src/routes/[...path]`. The route now matches any
 > +│ │ └ +page.server.js
 > ```
 >
-> Inside the `+page.server.js` file, `throw error(404)` inside `load`.
+> dans le fichier `+page.server.js`, ajoutez `throw error(404)` dans la fonction `load`.
 
-Rest parameters do _not_ need to go at the end — a route like `/items/[...path]/edit` or `/items/[...path].json` is totally valid.
+Les paramètres du reste n'ont _pas_ besoin d'être définis en dernier — une route comme `/items/[...path]/edit` ou `/items/[...path].json` est totalement valide.

content/tutorial/04-advanced-sveltekit/04-advanced-routing/02-rest-params/app-a/src/routes/[path]/+page.svelte

@@ -1,7 +1,7 @@
 <script>
 	import { page } from '$app/stores';
 
-	let words = ['how', 'deep', 'does', 'the', 'rabbit', 'hole', 'go'];
+	let words = ['on', 'descend', 'avec','le',  'lapin', 'blanc' ,'au', 'fond' ,'du', 'gouffre'];
 
 	$: depth = $page.params.path.split('/').filter(Boolean).length;
 	$: next = depth === words.length ? '/' : `/${words.slice(0, depth + 1).join('/')}`;
@@ -12,7 +12,7 @@
 		<p>{word}</p>
 	{/each}
 
-	<p><a href={next}>{words[depth] ?? '?'}</a></p>
+	<p><a href={next}>{words[depth] ?? '.'}</a></p>
 </div>
 
 <style>

content/tutorial/04-advanced-sveltekit/04-advanced-routing/02-rest-params/app-b/src/routes/[...path]/+page.svelte

@@ -1,7 +1,7 @@
 <script>
 	import { page } from '$app/stores';
 
-	let words = ['how', 'deep', 'does', 'the', 'rabbit', 'hole', 'go'];
+	let words = ['on', 'descend', 'avec','le',  'lapin', 'blanc' ,'au', 'fond' ,'du', 'gouffre'];
 
 	$: depth = $page.params.path.split('/').filter(Boolean).length;
 	$: next = depth === words.length ? '/' : `/${words.slice(0, depth + 1).join('/')}`;
@@ -12,7 +12,7 @@
 		<p>{word}</p>
 	{/each}
 
-	<p><a href={next}>{words[depth] ?? '?'}</a></p>
+	<p><a href={next}>{words[depth] ?? '.'}</a></p>
 </div>
 
 <style>

content/tutorial/04-advanced-sveltekit/04-advanced-routing/03-param-matchers/README.md

@@ -1,11 +1,11 @@
 ---
-title: Param matchers
+title: Validateurs de paramètres
 path: /colors/ff3e00
 ---
 
-To prevent the router from matching on invalid input, you can specify a _matcher_. For example, you might want a route like `/colors/[value]` to match hex values like `/colors/ff3e00` but not named colors like `/colors/octarine` or any other arbitrary input.
+Pour éviter que le router reconnaisse des routes avec un paramètre invalide, vous pouvez préciser un _validateur_. Par exemple, vous pourriez vouloir une route comme `/colors/[value]` pour cibler les valeurs hexadécimales comme `/colors/ff3e00` mais pas les couleurs nommées comme `/colors/octarine`, ou tout autre valeur arbitraire.
 
-First, create a new file called `src/params/hex.js` and export a `match` function from it:
+Commencez par créer un nouveau fichier appelé `src/params/hex.js` et exportez-y une fonction `match` :
 
 ```js
 /// file: src/params/hex.js
@@ -14,8 +14,8 @@ export function match(value) {
 }
 ```
 
-Then, to use the new matcher, rename `src/routes/colors/[color]` to `src/routes/colors/[color=hex]`.
+Ensuite, pour utiliser le nouveau validateur, renommez `src/routes/colors/[color]` en `src/routes/colors/[color=hex]`.
 
-Now, whenever someone navigates to that route, SvelteKit will verify that `color` is a valid `hex` value. If not, SvelteKit will try to match other routes, before eventually returning a 404.
+À partir de maintenant, lorsque quelqu'un navigue vers cette route, SvelteKit va vérifier que `color` est une valeur `hex` valide. Si ce n'est pas le cas, SvelteKit va essayer de cibler d'autres routes, avant éventuellement de renvoyer une erreur 404.
 
-> Matchers run both on the server and in the browser.
+> Les validateurs sont exécutés à la fois sur le serveur et sur le navigateur.

content/tutorial/04-advanced-sveltekit/04-advanced-routing/03-param-matchers/app-a/src/routes/+page.svelte

@@ -1 +1 @@
-<h1>color picker</h1>
+<h1>palette de couleur</h1>

content/tutorial/04-advanced-sveltekit/04-advanced-routing/04-route-groups/README.md

@@ -1,14 +1,14 @@
 ---
-title: Route groups
+title: Routes groupées
 ---
 
-As we saw in the [routing introduction](/tutorial/layouts), layouts are a way to share UI and data loading logic between different routes.
+Comme nous l'avons vu dans l'[introduction sur le routing](/tutorial/layouts), les <span class="vo">[layouts](PUBLIC_SVELTE_SITE_URL/docs/web#layout)</span> permettent de partager de l'interface et du chargement de données entre différentes routes.
 
-Sometimes it's useful to use layouts without affecting the route — for example, you might need your `/app` and `/account` routes to be behind authentication, while your `/about` page is open to the world. We can do this with a _route group_, which is a directory in parentheses.
+Il est parfois pratique d'utiliser des <span class="vo">[layouts](PUBLIC_SVELTE_SITE_URL/docs/web#layout)</span> sans affecter la route — par exemple, vous pourriez avoir besoin que vos routes `/app` et `/account` soient derrière une authentification, tandis que votre page `/about` reste accessible par tout le monde. Vous pouvez faire cela avec un _groupe de routes_, qui est un dossier entre parenthèses.
 
-Create an `(authed)` group by renaming `account` to `(authed)/account` then renaming `app` to `(authed)/app`.
+Créez un groupe `(authed)` en renommant `account` en `(authed)/account` puis renommez `app` en `(authed)/app`.
 
-Now we can control access to these routes by creating `src/routes/(authed)/+layout.server.js`:
+Nous pouvons maintenant contrôler l'accès à ces routes en créant `src/routes/(authed)/+layout.server.js` :
 
 ```js
 /// file: src/routes/(authed)/+layout.server.js
@@ -21,15 +21,15 @@ export function load({ cookies, url }) {
 }
 ```
 
-If you try to visit these pages, you'll be redirected to the `/login` route, which has a form action in `src/routes/login/+page.server.js` that sets the `logged_in` cookie.
+Si vous essayez de visiter ces pages, vous serez redirigés vers la route `/login`, qui contient une action de formulaire dans `src/routes/login/+page.server.js` permettant de définir le cookie `logged_in`.
 
-We can also add some UI to these two routes by adding a `src/routes/(authed)/+layout.svelte` file:
+Nous pouvez aussi ajouter de l'interface pour ces deux routes en ajoutant un fichier `src/routes/(authed)/+layout.svelte` :
 
 ```svelte
 /// file: src/routes/(authed)/+layout.svelte
 <slot />
 
 <form method="POST" action="/logout">
-	<button>log out</button>
+	<button>se déconnecter</button>
 </form>
 ```

content/tutorial/04-advanced-sveltekit/04-advanced-routing/04-route-groups/app-a/src/routes/+layout.svelte

@@ -1,8 +1,8 @@
 <nav>
-	<a href="/">home</a>
-	<a href="/about">about</a>
-	<a href="/account">account</a>
-	<a href="/app">app</a>
+	<a href="/">accueil</a>
+	<a href="/about">à propos</a>
+	<a href="/account">compte</a>
+	<a href="/app">application</a>
 </nav>
 
 <slot />

content/tutorial/04-advanced-sveltekit/04-advanced-routing/04-route-groups/app-a/src/routes/+page.svelte

@@ -1,3 +1,3 @@
-<h1>home</h1>
+<h1>accueil</h1>
 
-<p>this is the home page.</p>
+<p>ceci est la page d'accueil.</p>

content/tutorial/04-advanced-sveltekit/04-advanced-routing/04-route-groups/app-a/src/routes/about/+page.svelte

@@ -1,3 +1,3 @@
-<h1>about</h1>
+<h1>à propos</h1>
 
-<p>this is the about page.</p>
+<p>ceci est la page À propos.</p>

content/tutorial/04-advanced-sveltekit/04-advanced-routing/04-route-groups/app-a/src/routes/account/+page.svelte

@@ -1,3 +1,3 @@
-<h1>account</h1>
+<h1>compte</h1>
 
-<p>this is the account page</p>
+<p>ceci est la page de compte</p>

content/tutorial/04-advanced-sveltekit/04-advanced-routing/04-route-groups/app-a/src/routes/app/+page.svelte

@@ -1,3 +1,3 @@
-<h1>app</h1>
+<h1>application</h1>
 
-<p>this is the app</p>
+<p>ceci est l'application</p>

content/tutorial/04-advanced-sveltekit/04-advanced-routing/04-route-groups/app-a/src/routes/login/+page.svelte

@@ -1,5 +1,5 @@
-<h1>log in</h1>
+<h1>connexion</h1>
 
 <form method="POST">
-	<button>log in</button>
+	<button>se connecter</button>
 </form>

content/tutorial/04-advanced-sveltekit/04-advanced-routing/04-route-groups/app-b/src/routes/(authed)/+layout.svelte

@@ -1,5 +1,5 @@
 <slot />
 
 <form method="POST" action="/logout">
-	<button>log out</button>
+	<button>se déconnecter</button>
 </form>

content/tutorial/04-advanced-sveltekit/04-advanced-routing/04-route-groups/app-b/src/routes/(authed)/account/+page.svelte

@@ -1,3 +1,3 @@
-<h1>account</h1>
+<h1>compte</h1>
 
-<p>this is the account page</p>
+<p>ceci est la page de compte</p>

content/tutorial/04-advanced-sveltekit/04-advanced-routing/04-route-groups/app-b/src/routes/(authed)/app/+page.svelte

@@ -1,3 +1,3 @@
-<h1>app</h1>
+<h1>application</h1>
 
-<p>this is the app</p>
+<p>ceci est l'application</p>

content/tutorial/04-advanced-sveltekit/04-advanced-routing/04-route-groups/app-b/src/routes/account/__delete

@@ -1,3 +1,3 @@
-<h1>account</h1>
+<h1>compte</h1>
 
-<p>this is the account page</p>
+<p>ceci est la page de compte</p>

content/tutorial/04-advanced-sveltekit/04-advanced-routing/04-route-groups/app-b/src/routes/app/__delete

@@ -1,3 +1,3 @@
-<h1>account</h1>
+<h1>application</h1>
 
-<p>this is the account page</p>
+<p>ceci est l'application</p>

content/tutorial/04-advanced-sveltekit/04-advanced-routing/05-breaking-out-of-layouts/README.md

@@ -1,16 +1,19 @@
 ---
-title: Breaking out of layouts
+title: Ignorer des layouts
 ---
 
-Ordinarily, a page inherits every layout above it, meaning that `src/routes/a/b/c/+page.svelte` inherits four layouts:
+D'habitude, une page hérite de tous ses <span class="vo">[layouts](PUBLIC_SVELTE_SITE_URL/docs/web#layout)</span> parents, ce qui implique que la route `src/routes/a/b/c/+page.svelte` hérite de quatre <span class="vo">[layouts](PUBLIC_SVELTE_SITE_URL/docs/web#layout)</span> :
 
 - `src/routes/+layout.svelte`
 - `src/routes/a/+layout.svelte`
 - `src/routes/a/b/+layout.svelte`
 - `src/routes/a/b/c/+layout.svelte`
 
-Occasionally, it's useful to break out of the current layout hierarchy. We can do that by adding the `@` sign followed by the name of the parent segment to 'reset' to — for example `[email protected]` would put `/a/b/c` inside `src/routes/a/b/+layout.svelte`, while `[email protected]` would put it inside `src/routes/a/+layout.svelte`.
+Occasionnellement, c'est utile d'ignorer la hiérarchie de <span class="vo">[layouts](PUBLIC_SVELTE_SITE_URL/docs/web#layout)</span> courante. Nous pouvons faire cela en ajoutant le symbole `@` suivi du nom du segment parent servant de nouvelle "base". Par exemple, prenons le fichier de page de la route `src/routes/a/b/c` ; si on le nomme :
+- `+page.svelte`, il utilise les layouts des répertoires `a`, `a/b`, et `a/b/c`
+- `[email protected]`, il utilise les layouts des répertoires `a` et `a/b`, mais *pas* de `a/b/c`
+- `[email protected]`, il utilise le layout du répertoire `a`, mais *pas* de `a/b/c`, *ni* de `a/b`
 
-Let's reset it all the way to the root layout, by renaming it to `[email protected]`.
+Réinitialisons le <span class="vo">[layout](PUBLIC_SVELTE_SITE_URL/docs/web#layout)</span> jusqu'au layout racine, en renommant le fichier `[email protected]`.
 
-> The root layout applies to every page of your app, you cannot break out of it.
+> Le <span class="vo">[layout](PUBLIC_SVELTE_SITE_URL/docs/web#layout)</span> racine s'applique à toutes les pages de votre application, vous ne pouvez pas y échapper.

content/tutorial/04-advanced-sveltekit/04-advanced-routing/05-breaking-out-of-layouts/app-a/src/routes/+layout.svelte

@@ -1,5 +1,5 @@
 <nav>
-	<a href="/">home</a>
+	<a href="/">accueil</a>
 	<a href="/a">a</a>
 	<a href="/a/b">a/b</a>
 	<a href="/a/b/c">a/b/c</a>

content/tutorial/04-advanced-sveltekit/04-advanced-routing/05-breaking-out-of-layouts/app-a/src/routes/+page.svelte

@@ -1 +1 @@
-<h1>home</h1>
+<h1>accueil</h1>

content/tutorial/04-advanced-sveltekit/04-advanced-routing/meta.json

@@ -1,3 +1,3 @@
 {
-	"title": "Advanced routing"
+	"title": "Routing avancé"
 }

content/tutorial/04-advanced-sveltekit/05-advanced-loading/01-universal-load-functions/README.md

@@ -1,37 +1,37 @@
 ---
-title: Universal load functions
+title: Fonctions load universelles
 ---
 
-In the [previous section on loading](page-data) we loaded data from the server using `+page.server.js` and `+layout.server.js` files. This is very convenient if you need to do things like getting data directly from a database, or reading cookies.
+Dans le [précédent chapitre sur le chargement](page-data), nous avons chargé de la donnée depuis le serveur en utilisant les fichiers `+page.server.js` et `+layout.server.js`. Cette méthode est très pratique si vous avez besoin d'accéder directement à une base de données, ou de lire des cookies.
 
-Sometimes it doesn't make sense to load data from the server when doing a client-side navigation. For example:
+Parfois, charger de la donnée depuis le serveur lors d'une navigation côté client n'a pas vraiment de sens. Par exemple :
 
-- You're loading data from an external API
-- You want to use in-memory data if it's available
-- You want to delay navigation until an image has been preloaded, to avoid pop-in
-- You need to return something from `load` that can't be serialized (SvelteKit uses [devalue](https://github.com/Rich-Harris/devalue) to turn server data into JSON), such as a component or a store
+- Vous chargez de la donnée depuis une <span class="vo">[API](PUBLIC_SVELTE_SITE_URL/docs/development#api)</span> externe
+- Vous voulez utiliser de la donnée en mémoire du navigateur, si disponible
+- Vous voulez retarder la navigation jusqu'à ce qu'une image ait été chargée, pour éviter de la faire apparaître brusquement
+- Vous avez besoin de renvoyer quelque chose depuis `load` qui ne peut pas être sérialisé (SvelteKit utilise [devalue](https://github.com/Rich-Harris/devalue) pour transformer la donnée du serveur en <span class="vo">[JSON](PUBLIC_SVELTE_SITE_URL/docs/web#json)</span>), comme un composant ou un <span class="vo">[store](PUBLIC_SVELTE_SITE_URL/docs/sveltejs#store)</span>
 
-In this exercise, we're dealing with the latter case. The server `load` functions in `src/routes/red/+page.server.js`, `src/routes/green/+page.server.js` and `src/routes/blue/+page.server.js` return a `component` constructor, which can't be serialized like data. If you navigate to `/red`, `/green` or `/blue`, you'll see a 'Data returned from `load` ... is not serializable' error in the terminal.
+Dans cet exercice, nous avons à faire au dernier cas. Les fonction `load` de serveur dans `src/routes/red/+page.server.js`, `src/routes/green/+page.server.js` et `src/routes/blue/+page.server.js` renvoient un constructeur `component`, qui ne peut pas être sérialisé comme de la donnée. Si vous naviguez vers `/red`, `/green` ou `/blue`, vous verrez apparaître dans le terminal l'erreur "Data returned from `load` ... is not serializable" (_La donnée ... renvoyée par `load` n'est pas sérialisable_).
 
-To turn the server `load` functions into universal `load` functions, rename each `+page.server.js` file to `+page.js`. Now, the functions will run on the server during server-side rendering, but will also run in the browser when the app hydrates or the user performs a client-side navigation.
+Pour transformer les fonctions `load` de serveur en fonctions `load` universelles, renommez chaque fichier `+page.server.js` en `+page.js`. Désormais, les fonctions `load` seront exécutées sur le serveur lors du rendu côté serveur, mais elles seront également exécutées dans le navigateur lorsque l'application est hydratée, ou lorsque l'utilisateur ou l'utilisatrice déclenche une navigation côté client.
 
-We can now use the `component` returned from these `load` functions like any other value, including in `src/routes/+layout.svelte`:
+Nous pouvons maintenant utiliser la valeur `component` renvoyée par ces fonctions `load` comme n'importe quelle autre valeur, même dans `src/routes/+layout.svelte` :
 
 ```svelte
 /// file: src/routes/+layout.svelte
 <nav
 	class:has-color={!!$page.data.color}
 	style:background={$page.data.color ?? 'var(--bg-2)'}
 >
-	<a href="/">home</a>
-	<a href="/red">red</a>
-	<a href="/green">green</a>
-	<a href="/blue">blue</a>
+	<a href="/">accueil</a>
+	<a href="/red">rouge</a>
+	<a href="/green">vert</a>
+	<a href="/blue">bleu</a>
 
 +++	{#if $page.data.component}
 		<svelte:component this={$page.data.component} />
 	{/if}+++
 </nav>
 ```
 
-Read the [documentation](https://kit.svelte.dev/docs/load#universal-vs-server) to learn more about the distinction between server `load` functions and universal `load` functions, and when to use which.
+Rendez-vous dans la [documentation](PUBLIC_KIT_SITE_URL/docs/load#universal-vs-server) pour en apprendre plus sur la différence entre une fonction `load` de serveur et une fonction `load` universelle, ainsi que les cas d'usage de chacune.