The QNoSsr component makes sense only if you are creating a SSR website/app.
It avoids rendering its content on the server and leaves that for client only. Useful when you got code that is not isomorphic and can only run on the client side, in a browser.
Alternatively, you can also use it to render content only on server-side and it automatically removes it if it ends up running on a client browser.
Usage
Basic
<q-no-ssr>
<div>This won't be rendered on server</div>
</q-no-ssr>content_paste
Multiple client nodes
<q-no-ssr>
<div>This won't be rendered on server.</div>
<div>This won't either.</div>
</q-no-ssr>content_paste
Multiple client nodes with tag prop
<q-no-ssr tag="blockquote">
<div>This won't be rendered on server.</div>
<div>This won't either.</div>
</q-no-ssr>content_paste
Placeholder property
<q-no-ssr placeholder="Rendered on server">
<div>This won't be rendered on server</div>
</q-no-ssr>content_paste
Placeholder slot
<q-no-ssr>
<div>This won't be rendered on server</div>
<template v-slot:placeholder>
<div>Rendered on server</div>
</template>
</q-no-ssr>content_paste
Multiple content in placeholder slot
<q-no-ssr>
<div>This won't be rendered on server</div>
<template v-slot:placeholder>
<div>Rendered on server (1/2)</div>
<div>Rendered on server (2/2)</div>
</template>
</q-no-ssr>content_paste
Only placeholder slot
<q-no-ssr>
<template v-slot:placeholder>
<div>Rendered on server</div>
</template>
</q-no-ssr>content_paste