ReadMeFeed / Community knowledge
Real questions. Useful conversations. Find the people who know your stack.
Stencil's lazy:true decorator creates a separate chunk for a component that is fetched only on first DOM use. See how to enable it, verify on-demand loading in DevTools, and avoid first-render latency pitfalls.
Learn how StencilJS's `lazy: true` flag creates separate chunks for web components, reducing initial bundle size and deferring load until the component is actually needed.
Learn how to distinguish between @Prop and @State in StencilJS to create clean public APIs and efficient internal state management, including the use of mutable props.
Learn how to enable and configure StencilJS’s built‑in service worker for precaching and PWA routing. Follow this step‑by‑step guide to build, test, and recover from common issues.
Learn how to effectively use @Prop and @State in StencilJS to manage component re-renders and avoid common pitfalls with object mutation in Web Components.
Stencil's React output target generates thin wrapper components so React can pass real props and listen to custom events. Here's what it does, where it fails, and how to verify it.
Deciding between StencilJS's lazy-loaded 'dist' target and the 'dist-custom-elements' bundle is a trade-off between initial load speed and integration simplicity.
An architecture note that outlines the requirements for lazy‑loading StencilJS components, the minimal design needed, trust/data boundaries, operational verification steps, failure modes, and conditions that would trigger a redesign.
Context The dist-custom-elements output target emits a single bundle per component and registers each custom element under a flat name in window.customElements . When a component's public API—props, events, or slots—changes in a breaking way, the new definition overwrites the previous one without any version identifier in the registry or the generated file n
stenciljs
react