Rendering a component twice
Hi, im rendering the "Wiki" component in root "/".. but I also use it under "/wiki"
Is there any way to not "rerender" it and using an unique <Wiki /> call? thanks
22 Replies
Can you clarify the question a bit? I am not exactly sure what are you asking.
Sure,
root "/" renders <Wiki /> component - since I want ppl see it when they land on the page
wiki "/wiki" route also renders <Wiki /> component
--
So wiki unmounts and mounts again, there is any way to persist it?
I thought about using it at layout level, but I don't want to render it if i have other routes like "/help"
If <Wiki /> is the only component rendered on "/" (so, it's basically a page), I would handle this by adding navigate functionality to "/" which navigates to /wiki. This way anybody who visits "/" will be instantly redirected to "/wiki" and I think this is the right approach because there shouldn't be two different routes giving you exactly the same result.
If <Wiki /> is just one of many components rendered on each page, then I think it's not possible to preserve it.
Hope this answers your question š
Thanks š I was not sure if use redirect since I heard its not recommended to bloat the browsing history of people haha
Overthinking it, just let it render
I overthink too muchThat is correct, we shouldn't bloat users' browsing history. However, I think it is ok to use navigate in this case since "/" is literally the root of the app and it's the first thing you visit, so there is nothing to go back to.
One thing to keep in mind is if you have any links that should lead to "home" (eg. click on a logo), don't make it lead to "/" so it's being redirected to "/wiki", but rather make it lead directly to "/wiki".
Oke Ill do that too then š
Btw, do you recommend hosting the pics outside of Vercel?
I'm a a bit afraid of the free limit usage since my main bg is 250kb
and I'll be having like 20-40 pics, and minimum of 1k views month
I haven't dealt with that kind of problem in a while so I really don't know what to say. You will have to ask someone else about that
Cloudinary or making your own CDN with like CloudFlare
wot
Vercels 4 types of caching + redis ratelimiting + cdn cloudflare haha
Its a bit confusing for me š
in the span of 2 minutes i already did it
cloudinary
oh its easy then š
manual upload + <Image src="https://res.cloudinary.com/-the-real-url" fill alt={name}>..
and thats it? or I'm missing something?
i would use the sdk
I won't be uploading images from my app
ah then yeah just that
weird, prettier stopped working when i added const config = {
images: {
domains: ["localhost", "res.cloudinary.com"],
},
};
to next config
hmm already did that
its so weird its asking me for this, its been all day running good
Ā“--
fixed it , converted prettier options to .cjs and used use module.exports = config instead of export