T
TanStack5mo ago
other-emerald

Best way to handle a user generated page

A bit of an interesting one here. I'm currently in the process of building a POC for a page builder for a page in my application. The idea is to have the user compose this page (in some sort of back office) from a set of predefined blocks that they can add, remove, reorder and do some basic configuration. Some of these blocks will have to fetch data over an API when they're loaded in the actual page. I'm wondering if there's some optimisation I can do to cache the result of this page's construction so I don't have to go through the process of reconstructing it the page every time someone loads it? I figure I might need to have some sort of job run that compiles it down to a static page and then serve that static page from my route? Open to suggestions and general musings on this.
6 Replies
quickest-silver
quickest-silver5mo ago
Can you show an example of the way you save the page blocks?
rare-sapphire
rare-sapphire5mo ago
I'm building the same kind system where users select from a predefined list of "blocks" to compose a page. I've very interested to hear if anyone has insights here.
ambitious-aqua
ambitious-aqua5mo ago
Im curious what packages people like for doing something like this. I've come across @measured/puck but wondering if there's anything else worth checking out
other-emerald
other-emeraldOP4mo ago
@Jaga Santagostino I haven't got to the point where I'm implementing the saving functionality yet, as I imagine that'd be partly informed with the direction I take for dealing with the rendering/serving part of the POC. @DiamondDragon That's n interesting tool, I just rolled my own editor - looks similar. Didn't even think to look for there being pre-existing solutions for the actual editor.
probable-pink
probable-pink4mo ago
thanks for sharing that library! Back in time I implemented similar functionality with @hello-pangea/dnd for dragging @udecode/plate for inline text editing. I like the way they provides editing through the form on the right sidebar
other-emerald
other-emeraldOP4mo ago
For anyone interested, I'm planning on using renderToString and throw that in a document dB, then have my route load it via a server function and hydrate it. Not sure how it's going to work or how Tanstack Router is going to handle having another Root in its tree.

Did you find this page helpful?