Web Component Bytes

225 posts

Web Component Bytes

@wcbytes

Web Component tips by @lamplightdev. Writing a short & sweet summary of the week's #webcomponents news https://t.co/PeIQLfuLWJ @[email protected]

UK Присоединился Ağustos 2020

606 Подписки801 Подписчики

Закреплённый твит

Web Component Bytes@wcbytes·14 Şub

I'll still be looking for Web Component news big and small, and interesting projects that make use of WC so feel free to tweet or DM with anything you've been working on. Thanks!

English

Web Component Bytes@wcbytes·30 Eyl

🥱

ART

359

Web Component Bytes@wcbytes·2 Nis

@schizanon Seems to work? codepen.io/lamplightdev/p…

English

Kill yourself Elon@schizanon·1 Nis

@wcbytes this.shadowRoot.querySelector() -> undefined

English

Kill yourself Elon@schizanon·1 Nis

Sometimes I wonder why I advocate for #WebComponents when the API sucks so hard. You can't access attrs in the constructor, but you can't access the shadowRoot from the connectedCallback. So if you need to use the values of attrs in your shadowRoot you're fucked. This shouldn't be this hard #CustomElements #html #javascript #web

English

178

Web Component Bytes@wcbytes·1 Nis

Very much looking forward to playing with this!

Passle@passle_

Almost there 😄 SWTL will be able to SSR custom elements. The customElementRenderer is pluggable, so it supports @buildWithLit , but could probably support @enhance_dev `CustomElement`s as well, or other custom element renderers

English

416

Web Component Bytes@wcbytes·31 Mar

👀

Passle@passle_

making progress 🙂

ART

332

Web Component Bytes@wcbytes·29 Mar

I think this is great news. The core components will remain free and open source, but there's now a business model that will ensure the project gets the investment it needs and deserves to continue to be developed and maintained into the future! Happy to be a backer.

English

447

Web Component Bytes@wcbytes·28 Mar

What's the closest thing to Remix/Next for web components?

English

263

Web Component Bytes@wcbytes·15 Oca

@patrickjs I suppose you could do something similar with a server side web component - but is the attraction of RSC that this would also work as a client side component too?

English

PatrickJS@PatrickJS·15 Oca

@wcbytes Can you remake this demo with web-components how-is-this-not-illegal.vercel.app

English

Web Component Bytes@wcbytes·28 Haz

I've been playing with streaming Declarative Shadow DOM recently and it enables some pretty unique behaviour - e.g. enamel.pages.dev - a completely JS free, backend agnostic way to deliver your page shell instantly and progressively load in slotted content as it's received

English

115

Web Component Bytes@wcbytes·15 Oca

@patrickjs Yeah, styling can be an issue, although I think there are discussions around enabling some kind of slot behaviour with light dom

English

PatrickJS@PatrickJS·15 Oca

@wcbytes The other problem are the styles. If we could get slots without shadow dom then we can use it. (Also safari updates to show loading states)

English

Web Component Bytes@wcbytes·15 Oca

@patrickjs Well Firefox doesn't quite have support yet, and Safari has a higher threshold (~512bytes) before triggering streaming, but it does work after reaching that theshold.

English

PatrickJS@PatrickJS·15 Oca

@wcbytes Oh yeah I looked into this the problem is that Firefox and safari doesn’t show the loading state and waits for the loaded state

English

Web Component Bytes@wcbytes·15 Oca

@patrickjs Finally got round to it! lamplightdev.com/blog/2024/01/1…

English

1.2K

PatrickJS@PatrickJS·2 Oca

@wcbytes do you have the blog post?

English

124

Web Component Bytes@wcbytes·14 Oca

Did you know you can stream HTML out of order without any JavaScript at all? A put a little blog post together explaining how: lamplightdev.com/blog/2024/01/1… See a demo: ooo.lamplightdev.workers.dev Supported in Chrome and Safari, and in Firefox in a month or two.

English

2.7K

Web Component Bytes@wcbytes·18 Eki

Great news! If Shoelace so far has been @claviska working on it as a side project, imagine what it will be like with his full time attention! 🚀 👟🚀

Cory LaViska@claviska

Time to talk about the future of Shoelace. It's been more than two years since the beta release of Shoelace 2.0, which was the first version of the project to ship Web Components… 👇 cont'd

English

Web Component Bytes ретвитнул

Cory LaViska@claviska·17 Eki

Time to talk about the future of Shoelace. It's been more than two years since the beta release of Shoelace 2.0, which was the first version of the project to ship Web Components… 👇 cont'd

English

209

Web Component Bytes@wcbytes·15 Eki

👀

Jonathan Neal@jon_neal

Hey.. so I found a way to author Declarative ShadowDOM just once for a given element and then reuse that DSD any number of times without having to rewrite it, without any build tools, and without any JavaScript.

ART

Web Component Bytes@wcbytes·4 Eki

@rauschma Here's an example of (streaming) DSD with and without the polyfill - it's tiny and works well twitter.com/wcbytes/status…

Web Component Bytes@wcbytes

English

Axel Rauschmayer (also on 🦣)@rauschma·4 Eki

Important for web components—helps with: – Server-side rendering – Using pages without JavaScript I’m curious: How well does polyfilling the API work for these two things?

Jarred Sumner@jarredsumner

Safari is prototyping declarative Shadow DOM github.com/WebKit/WebKit/…

English

Web Component Bytes@wcbytes·4 Eki

Stating the obvious maybe, but the tendency for some discussions concerning contrasting opinions on Web Dev Twitter to devolve into arguments, sometimes personal, is very off putting for a lot of people, whether or not you're personally involved.

English

Web Component Bytes@wcbytes·2 Eki

Lots of interesting food for thought here on component based architecture. To paraphrase, when all you have is a hammer everything looks like a nail. Looking forward to seeing ideas in this space breaking out of the current JS centric framework approach!

Matthew Phillips@matthewcp

Where Web Components Went Wrong (And How We Can Turn It Around) space.matthewphillips.info/posts/where-we…

English