15 replies

1. Private reply Bluesky 13 hr later
   1. Danny Engelman 🌷🏍️🛥️ Bluesky 17 hr later

      DSD - Declarative ShadowDOM is handled by the Browser

      1. Private reply Bluesky 20 hr later
         1. Burton Smith Bluesky 1 day later

            What's the use case for using DSD in a Nuxtjs app?

            1. Private reply Bluesky 1 day later
               1. Burton Smith Bluesky 1 day later

                  Why do you need a shadow DOM in a Vuejs template? Nuxt has SSR and Vuejs already has slots and style encapsulation (although not as strict as a shadow DOM).

                  1. Konnor Rogers Bluesky 1 day later

                     They said NextJS not Nuxt 😅

                     And I dont think they implied writing the shadom dom directly. They're saying if they use a library of web components that can be SSR'ed (like Web Awesome) NextJS' Lit adapter only renders "Shallowly" without the shadow dom, and produces hydration errors in some cases.

                     1. Burton Smith Bluesky 2 days later

                        🤦‍♂️ I guess I read want I wanted to see. Sorry about that.

                        1. Konnor Rogers Bluesky 2 days later

                           happens to the best of us 😅

                        2. Private reply Bluesky 2 days later
                     2. Cory LaViska Bluesky 2 days later

                        It's tough when the metaframework ignores web standards.

                  2. Private reply Bluesky 1 day later
                     1. Konnor Rogers Bluesky 1 day later

                        I modified the Astro SSR + DSD adapter one and fixed some bugs and it works with the latest version of Astro:

                        github.com/shoelace-sty...

                        I have a PR to Nuxt to upgrade to latest version of Lit that has languished:

                        github.com/prashantpali...

                        (and looks like other PRs have improved on my PR)

                        1. Konnor Rogers Bluesky 1 day later

                           I have a small example using Vue + Vite:

                           github.com/KonnorRogers...

                           Svelte is probably next on my list to look at.

                           NextJS seems like the odd one out for SSR, mostly because theres no real hooks into it, and last I heard talks stalled with the Next team and the Lit team.

                     2. Burton Smith Bluesky 2 days later

                        Sorry, I misread that.

                        I agree. I'm not a big fan of the framework-specific solutions and would prefer a standards-based solution.

                        I was hoping Declarative Custom Elements could help in this area.

                        dev.to/stuffbreaker...