Skip to content

Commit

Permalink
fix: replace recommendation in data-loading
Browse files Browse the repository at this point in the history
  • Loading branch information
atilafassina committed Oct 15, 2024
1 parent cae2e43 commit 890dafa
Showing 1 changed file with 5 additions and 7 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ It takes an async function and returns a [signal](/reference/basic-reactivity/cr

<TabsCodeBlocks>
<div id="ts">
```tsx {6-9}
```tsx {6-9} title="/src/routes/users.tsx"
import { For, createResource } from "solid-js";

type User = { name: string; house: string };
Expand All @@ -30,7 +30,7 @@ export default function Page() {
```
</div>
<div id="js">
```tsx {4-7}
```tsx {4-7} title="/src/routes/users.jsx"
import { For, createResource } from "solid-js";

export default function Page() {
Expand All @@ -46,11 +46,8 @@ export default function Page() {
</TabsCodeBlocks>

When fetching inside components, you can encounter unnecessary waterfalls, especially when nested under lazy loaded sections.
To solve this, it can be valuable to introduce a hoist and cache mechanism.

Using a library like [Tanstack Query](https://tanstack.com/query/latest) can help with this.

for the example below we will be using the data in APIs in [`solid-router`](/solid-router)
To solve this, it is recommended to hoist the data fetching to the top of the component tree or, when in [SolidStart](/solid-start), use the server to fetch data in a non-blocking way.
For the example below we will be using the data in APIs in [`solid-router`](/solid-router)

Using some of the features of `solid-router`, we can create a cache for our data:

Expand Down Expand Up @@ -78,6 +75,7 @@ export default function Page() {
}
```
</div>

<div id="js">
```tsx title="/routes/users.jsx" {4, 7, 10}
import { For } from "solid-js";
Expand Down

0 comments on commit 890dafa

Please sign in to comment.