serialize JSX.Element? | SolidJS | Page 1

#

but why the element itself

#

how is the string set in bold/italics

#

is this string coming from an editor

#

I mean surely there has to be a way to represent this much better

#

something like a VDOM-like object

#

No, I'm saying how you should represent the state

#

like it could be:

 return {
    url: "/images/user.svg",
    header: "User Created",
    body: {
      type: 'div',
      children: [
        'The user with the name ',
        { type: 'b', children: [data.name] },
        ' has been created',
      ],
    },
  };

#

then reconstruct it somehow

#

no it's actually easy

#

the thing is though I have no idea if body is something you produce statically or from a function

#

but my answer here is that there should be a way to present body in a format that it's easy to encode/decode

#

like there's so many questions here:

is it necessary for body to be an HTML data? can it be just the data and then be constructed when received based on the body?
can it just be a HTML string instead?
can it just be a VDOM-like representation (the one I showed)

#

is this code in the server only?

#

so I guess you're looking at a premature optimization

#

so yeah I mean why JSX specifically

#

no I meant on the "state"

#

so now my question is that

#

is the rest of the JSX static or like randomized

#

does it have to be JSX, or it can be html

#

if this is all in client-side

#

then why not just set serverData.name and serverData.seed as the state, and just make renderUserCard a component or something

#

funny thing is renderUserCard could've been the component itself

#

but then why JSX specifically

#

why not HTML string

#

function renderUserCard(serverData) {
  const replies = [ 
    `The user <b>${serverData.name}</b> has been created`, 
    `Thanks for creating an account ${serverData.name}`
  ];

  const reply = randomItem(serverData.seed, replies); // re-rendering doesn't cause different item

  // I'm not sure if this is really JSX
  return (
    <>
      <div>Account Created!!</div>
      <div innerHTML={reply} />
    </>
  );
}

#

or if it isn't JSX then

return `
  <div>Account Created!!</div>
  <div>${reply}</div>
`;

#

well JSX itself is exploitable if we were to use Solid's JSX. This is why i'm refraining to answer the question directly

#

I know the answer, but my thoughts are:

is serializing JSX really necessary? is there anyway to present this in such a way you don't have to resort with serializing HTML

#

no, if you were to serialize the JSX form of that script you would still have that issue

#

which is why i'm trying to help if there's really another way to solve problem, at least by presenting the body in another format

#serialize JSX.Element?