Best way of rendering content of editor?

[michalvadak]

What is the best approach of just showing the content of lexical that was written in administration to be shown in the client zone without the ability to edit it?

1. Save the JSON to DB and then on the frontend pass the JSON to the lexical editor with readOnly: true?
2. Save the JSON to DB and then on the frontend pass the JSON to the custom component that will render the content?
3. Searialize to HTML before sending do DB?

[thegreatercurve]

There's really no definitive answer. It's whatever is best for your specific use case.

The Lexical readOnly mode on the editor is the easiest way to show serialized HTML or JSON editor state.

If client-side performance more of a concern though, you can build a separate "read-only" Lexical Editor which strips out any unnecessary plugins which are used in editing (e.g. OnChangePlugin).

For your specific use case, if you're display HTML which is saved in an admin panel elsewhere, you could just remove Lexical altogether on the client app and just render the saved HTML, though you would need to re-apply any custom styles.

[mubshrx]

@code-mastero for what?

[pranavmappoli]

@mhm13dev ,you have used Lexical readOnly mode or something else ?

[mubshrx]

you have used Lexical readOnly mode or something else

I stored the json state in db and then rendered the nodes from json on client side.

[pranavmappoli]

@mhm13dev how you rendered in client side ? same with lexical editor ?

[mubshrx]

@mhm13dev how you rendered in client side ? same with lexical editor ?

No, I used custom components to render the contents based on node types.

I don't have the code example handy now.

I will share once I have it.

[vannsoklay]

how to render json lexical from db to html on solidjs.

1. [json laxical] -> db
2. query -> [1] -> html
3. client -> [2] -> read html

[vadimkantorov]

TWIMC I made a primitive example achieving lexical editorState JSON -> HTML rendering: https://github.com/vadimkantorov/lexical-cli-render (as a CLI tool)