S
SolidJS•10mo ago
Wurfle

Is it possible to create a resource of type HTMLImageElement with SSR?

Is it possible to create a resource of type HTMLImageElement with SSR? The server would have to render the suspense fallback and then load the image right away on hydration. I tried delaying the resource until onMount, but that wouldn’t render the suspense fallback in the meantime
3 Replies
mdynnl
mdynnl•10mo ago
i'd use https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel/preload. you'd also get browser native caching benefits if you really want to do it, loading the image in a way it can be serialized by ssr like base64 then using that as src for image might work
Wurfle
Wurfle•10mo ago
I’m aware of preload, I’m just messing around with using images to trigger suspense. The image doesn't have to load on the server at all. The behavior I'm looking for is 1. Server renders page 2. Sees image in a resource 3. Renders suspense fallback 4. Client hydrates 5. Sees image in a resource 6. Loads image as an offscreen HTMLImageElement asynchronously 7. Hydates fallback 8. Image finishes loading 9. Resource completes with image element inside
mdynnl
mdynnl•10mo ago
Want results from more Discord servers?
Add your server
More Posts
solid-trpc and infiniteQueryI am trying to create an infinite scroll, list using `solid-infinite-scroll` and `solid-trpc` (solidHow to handle requests that need to be fetched later?I use `createResource` to fetch data from the server and make it a reactive store. But on one page Solid Start: CSR Only PageI have one page that is very interactive and if client side rendering is not available I'd like to dRemove element from store not workingI'm trying to remove an element from a reactive store based on the index. I've tried versions of thiProtected route dynamic route that has to match certain parameterI have a dynamic route for a user. The file route looks like this: routes/(home)/user/[user]/(user).Default values in props with Merge Giving me a weird interfaceIn the situation where I want to possibly pass in prop, say `arrOfStrings`: ``` tsx interface CompoSolidjs site metadata (title, description, meta image etc.) in JavascriptI'm having difficulty with setting up metadata. My site is purely client side. When I use `@solidjs/Panda CSS and Solid-Start = FOUCWhen using Panda CSS with Solid-Start, I notice there is some major FOUC happening regardless of howIs there something like a replacePathParameters method?Hello, I'm trying to do something like this with the SolidJS router: ```ts replacePathParameters("SolidStart with the static adapter and hynrid routing?Hello! Is the hybrid routing (islandsRouter) supposed to work with the static adapter in SolidStart?