Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

useAssets is currently no-op in SSR if the markup doesn't have a <head> #202

Open
lxsmnsyc opened this issue Feb 10, 2023 · 0 comments
Open

Comments

@lxsmnsyc
Copy link
Collaborator

lxsmnsyc commented Feb 10, 2023

useAssets relies on <head> to inject its markup, which feels off where in some cases some users would just render from the an specific root instead of the whole document, which also applies to Islands.

It would be helpful if useAssets doesn't rely on such mechanism. For instance, in my JSX library, stellis, I run the following checks:

  • if the resulting markup is an HTML markup
    • if the markup has a head
      • Match the opening head element and insert pre-<head> content
      • Match the closing head element and insert post-<head> content
    • if the markup has no head
      • Concat both pre and post <head content and wrap it in a <head> markup then insert it before the HTML opening element.
    • if the markup has a body
      • Match the opening body element and insert pre-<body> content
      • Match the closing body element and insert post-<body> content
    • if the markup has no body
      • Create a <body> opening, append the pre-<body> content and insert it after </head>
      • Create a <body> closing, prepend the post-<body> content and insert it before </html>
  • if the resulting markup isn't an HTML markup (partial render)
    • if the markup has a body
      • Match the opening body element and insert pre-<body> content
      • Match the closing body element and insert post-<body> content
    • if the markup has no body
      • if the markup has no head
        • Insert the pre and post <body> content on both ends of the markup
    • if the markup has a head
      • Match the opening head element and insert pre-<head> content
      • if the markup has no body
        • Match the closing head element and insert post-<head> and pre-<body> content
        • Append post-<body> content to the markup
    • if the markup has no head
      • Prepend both pre and post <head> content to the markup

Here's the implementation:
https://github.com/lxsmnsyc/stellis/blob/main/packages/stellis/src/index.ts#L163-L231

I would love to know what you think about this

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant