At times of IE6 we were exited to have a primitive console. 📺 Later came firebug bug 🔥🐜 and libraries like JQuery, which made it possible to easily navigate different web api implementations by browser vendors. While those issues started to be harmonized out of our ways (thank you W3C) compilers solved modularity and frameworks like react or angular solved state management/single page app and DOM concerns. And while all this was happening Macro Medias Flash with it’s powerful Action Script was mercilessly assassinated. 🔫😢
Finally, things are becoming simple again. 🤪 But then you will ask me how to solve your applications state management? My answer is “When in Rome, do as the Romans do”. Your application is in the DOM so do as the Domans do! How does the DOM do? The DOM is event driven and CustomEvents is a standard https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent, by which your web components https://developer.mozilla.org/en-US/docs/Web/Web_Components will be communicating. ShadowDOM, event driven web components, asynchronicity and http2 are so much optimized that your site feels as fast as a static site and at the same time let’s you make it static, if desired and hydratable by the nature of web components. 🌊
Your time to interactivity is going to be lower than ever before. No more threat blocking code! 🆘🔨
Web components are a perfect match for complex single page apps with reusable components, micro frontends on static pages and at the same time flexible enough for any other use case running in or on the DOM.
To visualize the statements above in code, I started the real world conduit example, which is similar to the TodoMVC (https://github.com/mits-gossau/event-driven-web-components-todomvc-app) but more specific for a web application scenario: https://github.com/Weedshaker/event-driven-web-components-realworld-example-app
I would be very happy, if some of you guys would join the development process!? 🥰
Thanks for reading! 🙏