#shadowdom

[javamp]

Something seems odd about the grove... It seems that we may get some new visitors soon... 

The Fox Grove will open tomorrow! Be sure to check it out and get yourself a new companion~ 100+ hand drawn designs made by me! 

[emipoemi]

Hello Dagger

Hello Dagger, my old friend, I see you at my side again. So often have you tempted me To break ties with my pen.

My hour of darkness hangs on me– There’s ne’er a shred of light to see; Mother Mary speaks no words to me– The world won’t let me be!

Hello Dagger, with your gleam You boldly tempt me all the more. I’m but a shadow of the man That I had been before.

I stand a solitary stump On someone else’s rotting road. I hear them say that walking tall Would shake me of my load–

But Dagger, they keep maiming me! First at my feet then at my wings! Life has no roads – we make the roads; But I’m still bound by strings.

I’m tired of their contradictions! I’m tired of their senseless lies! I’m tired of being happiest Whene’er I close my eyes.

Yes, hello Dagger, this time round Your timing is most opportune. What reason has the world to mourn A rover bathed in gloom?

My prayers in Heaven never ring, My pen to mighty be has tried– So Dagger, swiftly do the deed, I’m already dead inside.

–EDP

[techsmarts]

Chris Haynes - web developer consultant

With the advent of Declarative Shadow DOM (DSD) it is now possible to stream content in a static page that would have otherwised required API calls after the page has loaded. Using this technique will improve the perceived performance of static pages that have dynamic regions.

Consider the following contrived example that implements a socialy home page for our user, Alice.

The page itself has been pre-created using a text file compiler such as Gilbert. Previously, the page would have to load before API calls would go out and fetch content to populate profiles, news, weather, posts, etc. With DSD the server would make the first round of requests while the static page is streaming. Once completely streamed subsequent calls (to poll for news events for example) would be outbound from Alice's browser as normal.

It should noted that this does require some logic so you won't be able to get away with just NGinx, Caddy, S3+CloudFront, etc. But it can be achieved relatively easily with a Cloudflare Worker.

[stolpnik]

[saurshaz]

Hello Web Components !!! (Be Friendly)

How many of you have tried WebComponents ? 

How many of you have tried Polymer ?  What's the first thing that came to your mind in both of the above questions ?

Was it Shadow DOMs. If it was you are pretty much like me. If not, you've either mastered them or are unaware of them, See you soon.

I see templates, I see 2 way data binding, I see custom tags, I see a lot of promise(and a lot delivered too ) when I see Polymer.

What I see most is Encapsulation and I see semantic HTML (courtsey shadow DOm and custom tags)

So, Rod Dodson, Eric beidelman and others have done some great writeups on shadow DOMs , whys and whats.  I would rather wnat to discuss some of the issues, and the solutions that I found for shadow DOM related stuff I've ran into in my journey with web components via Polymer.

Will also discuss each in a following post  1) event tracking is a pain in shadow DOM.  event target does not work, i resorted to much less reliable e.path.(works for my purpose may not in all use cases)

2) cannot get the rendered/composed DOM.  Is there actually a way ? I suppose not, as that will be breaking the encapsulation.

3) Data binding in insertion points(distributed nodes). 

Actually not that big an issue. Create another component and use that in inner content for data binding.

4) Selection using CSS selectors.  I use shadow:: and /deep/ . but not sure they are portable and reliable enough. Are they considered hack. still new on this one.

5) used template binding extensively. once rendered templates are detached.  There shall be a binding between templates and content rendered too :-)

More to come ..

[kazu69]

[kazu69]

[kazu69]