JS Party: JavaScript, CSS, Web Development SSR web components for all
May 2, 2024
Brian LeRoux from the Enhance team discusses server-side rendering for web components using Enhance WASM, enabling component reuse across languages and frameworks. They also touch on topics like API SDK creation, web component integration, user management with Clerk, back end application usage, and error monitoring practices in web development.
AI Snips
Chapters
Transcript
Episode notes
Share Design Systems Across Backends
- Use Enhance WASM to share a single design-system implementation across heterogeneous backends instead of reimplementing in each stack.
- Deploy components server-side so non-Node shops avoid client-only spinners and improve UX.
Multiple Backend Demos Proved The Idea
- The Enhance team built demos for WordPress, Rails, Flask, Go, Rust and dotnet to prove the approach works across stacks.
- A PHP-only renderer even outperformed the Wasm route for simple cases using native DOM parsers.
Make Rendering A Pure Function
- Implement a simple server render contract: export a render(state, HTML) function that returns HTML to avoid mocking the browser.
- Keep rendering as a pure function of state to stay fast and portable across runtimes.